Mettre image en header sur le theme base
header image
Discussions Générales
Sympa Membre non connecté
Booster Bazooka
- Booster Bazooka
- Voir le profil du membre Sympa
- Inscrit le : 23/08/2018
- Site internet
Je veux mettre une image au niveau du header du site avecle thème "base", quel fichiers editer ?
Je voudrais aussi mettre une image en arrière plan, c'est à dire une bacground-image, comment procéder svp?
ElenWii Membre non connecté
- Administrateur
- Voir le profil du membre ElenWii
- Inscrit le : 14/08/2009
- Site internet
- Groupes :
- Equipe Graphique
On est sur les base du CSS, je t'invite à parcourir les cours d'initiation gratuit disponible un peu partout sur internet pour te permettre de gagner en aisance. Tu devrais assez rapidement tomber sur la fonction background-url.
Comme indiqué dans la documentation, les fichiers CSS sont dans le répertoire de ton thème et la partie design est présente dans le fichier design.css . (Pense aussi a lire la documentation tu y trouveras de nombreuses réponses a tes questions)
En fonction du design voulu il faudra l'appliquer sur la bonne CLASS où ID CSS.
Sympa Membre non connecté
Booster Bazooka
- Booster Bazooka
- Voir le profil du membre Sympa
- Inscrit le : 23/08/2018
- Site internet
Swan Membre non connecté
Booster Mortier
- Booster Mortier
- Voir le profil du membre Swan
- Inscrit le : 31/05/2013
- Site internet
<span style="text-decoration: underline;">Pour le background : </span>
Dans le <a href="/wiki/fichier-design-css">https://www.phpboost.com/wiki/fichier-design-css</a> ...
<div class="formatter-container formatter-blockquote"><span class="formatter-title">Citation :</span><div class="formatter-content"><h4 class="formatter-title">L'arrière plan, la couleur, taille de la police :</h4>
Code CSS :
body { position: relative; min-height: 100%; height: auto; background: #E8EDF3 url(images/body.png) repeat-x; color: #555555; font-size: 13px; font-family: "Trebuchet MS", Verdana, 'Bitstream Vera Sans', Times, serif; }
Le body est le premier élément du site. Tous les éléments ont donc une répercutions sur les classes suivantes.
La taille du texte ainsi que la police doivent être définit ici pour éviter les déclarations multiples.
Pour changer l'arrière plan ( background ) il vous suffira simplement de changer l'image global ainsi que la valeur de son code couleur :
Code CSS :
repeat-x veut dire que l'on va répéter l'image tout le long (à l'horizontal).background:#E9ECEF url(images/global.png) repeat-x;
Pour répéter une image verticalement il vous suffira de mettre :
Code CSS :
repeat-y
Et pour que l'image ne soit pas répétée mettre :
Code CSS :
</div></div>no-repeat
<span style="text-decoration: underline;">Et le header :</span>
En gros voir toujours sur la même page, cette section de la doc : <a href="/wiki/fichier-design-css#paragraph-l-en-tete-et-le-sous-en-tete">https://www.phpboost.com/wiki/fichier-design-css#paragraph-l-en-tete-et-le-sous-en-tete</a>
Et faire comme ceci :
<a href="https://nsa39.casimages.com/img/2018/11/30/18113012545546299.jpg" data-lightbox="formatter" class="formatter-lightbox"><img src="https://nsa39.casimages.com/img/2018/11/30/18113012545546299.jpg" alt="" /></a>
bon en plaçant le lien de l'image de votre thème, que vous aurez mis dans le dossier "theme/images" et en appelant en css de cette façon :
<div class="formatter-container formatter-blockquote"><span class="formatter-title">Citation :</span><div class="formatter-content">background: url('images/bg-header.jpg') no-repeat scroll center top;</div></div>
Swan.
Sympa Membre non connecté
Booster Bazooka
- Booster Bazooka
- Voir le profil du membre Sympa
- Inscrit le : 23/08/2018
- Site internet
Répondre
Vous n'êtes pas autorisé à écrire dans cette catégorie