Aides sur les thèmes PHPBoost » Thèmes PHPBoost 5.2 Thème tweetBoost
Bonjour,
Je suis après configurer en local ce qui sera mon futur site. Actuellement le thème est le tweetBoost.
Néanmoins ce derniers a, en haut de page un bandeau noir (comme ne bannière).
J'aimerais remplacer ce bandeau noir par une image (si c'est possible) ou alors en changer la couleur.
je n'ai vu aucune image correspondant à ceci dans le thème et n'etant pas du tout à l'aise avec les TPL et le CSS je ne sais ou chercher ça afin de le modifier.
Pourriez-vous m'indiquer comment faire ça ?
Merci 
Bouh !
Pour remplacer cette couleur il te faut te rendre dans le design.css ligne 64 :
/* --- Partie superieure du header --- */ div#top-header { background:#000000 none repeat scroll 0 0; margin: auto; max-width: 1100px; min-height: 200px; overflow: hidden; }
Et remplacer le background par une image du style :
background: #000000 url(images/MonImage.jpg) no-repeat scroll center center ;
Et penser à mettre l'image dans le dossier : templates\TweetBoost\images.
Swan ^^
Merci beaucoup du retour
je supose au vues des
</p> <p>max-width: 1100px;</p> <p>min-height: 200px;</p> <p>
que la taille de l'image doit-être de 1100*200px ?
Edité par Jester Le 27/02/2023 à 16h48
Bouh !
Merci Swan
Je suis après également faire quelques autres modifications, notamment la bande noir tout en haut avec le logo et noté tweetboost j'ai changé la couleur pour un bleu, changé le logo et le lieu ou l'url pointe pour faire un retour accueil et du coup comme ça rendait bien, j'me suis dit :
"Mais pourquoi ne pas mettre tous mon menu là haut"
J'ai donc copier la ligne initial du TPL, adapté avec la nouvelle image et le nouveau lien, et là cata ! A la place d'être joliment mis côte à côte sur ce petit bandeau, voilà que c'est en vrac et que mon image est grossi (plus que ça taille initial d'ailleurs.) Voici un screen et le code en question :
[img]https://phpboost.com/upload/header1.png[/img]
</p>
<p><div class="sub-container"><br /> <a href="{PATH_TO_ROOT}/" alt="Accueil" ><img src="{PATH_TO_ROOT}/templates/{THEME}/theme/images/home.png" title="Accueil"></a> <a class="sub-tweet" href="{PATH_TO_ROOT}/" alt="Accueil ..." >Accueil</a></p>
<p> <a href="{PATH_TO_ROOT}/articles/1-recettes/" alt="Recettes" ><img src="{PATH_TO_ROOT}/templates/{THEME}/theme/images/cuisine.png" title="Recettes"></a> <a class="sub-tweet" href="{PATH_TO_ROOT}/" alt="Recettes..." >Recettes</a><br /> </div></p>
<p>
à l'origine du code, il y a seulement la première ligne, la seconde est de moi. Le CSS concerné, mais ça je n'y ait pas touché mis à part pour la couleur de la bande
div#sub-header {<br />background: #81c3e9; /* Old browsers */<br />border-bottom: 1px solid #103480;<br />min-height: 35px;<br />text-align: center;<br />box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.8);<br />}
Si quelqu'un est en mesure de m'aider, car je sèche ^^" Merci
Edité par Jester Le 01/03/2023 à 19h14Bouh !
Bonsoir,
J'ai mis un screen du haut du site (ou j'ai le problème). C'est juste un lien car j'ai pas réussi à faire marcher la balise img
https://www.phpboost.com/upload/header1.png
Est-ce qu'il te faut le site en entier ?
Je travaille en local actuellement
Edité par Jester Le 02/03/2023 à 08h19Bouh !
Hello,
Merci du retour.
La solution serait donc de modifier cette taille ?
EDIT :
J'ai trouvé un début de solution, initialement le code est fait comme suit :
</p> <p><div id="sub-header"><br /> <div class="sub-container"><a href="{PATH_TO_ROOT}/" alt="Accueil" class="sub-tweet"><img src="{PATH_TO_ROOT}/templates/{THEME}/theme/images/home.png" title="Accueil"></a> <a class="sub-tweet" href="{PATH_TO_ROOT}/" alt="Accueil ..." >Accueil</a><br /> </div><br /> </div></p> <p>
Sauf que moi j'ai mis l'ensemble de mes liens dans la même div sub-container.
Du coup j'ai séparer à chaque fois de façon à ce que l'architecture soit comme suit
Comme mes images sont pas exactement toute de la même taille c'est le bordel donc j'ai fait le choix de les supprimer, mon code est donc maintenant comme suit :
</p> <p><div id="sub-header"><br /> <div class="sub-container"><br /> <a href="{PATH_TO_ROOT}/" alt="Accueil" class="sub-tweet">Accueil</a><br /> </div></p> <p> <div class="sub-container"><br /> <a href="{PATH_TO_ROOT}/news/" alt="News" class="sub-tweet">News</a><br /> </div></p> <p> <div class="sub-container"><br /> <a href="{PATH_TO_ROOT}/articles/1-recettes/" alt="Recettes" class="sub-tweet">Recettes</a><br /> </div><br /> # IF C_MENUS_SUB_HEADER_CONTENT #<br /> # START menus_sub_header #<br /> {menus_sub_header.MENU}<br /> # END menus_sub_header #<br /> # ENDIF #<br /> </div></p> <p>
Mais du coup, tous mes divers liens étaient collés que ce soit en haut et à gauche. Du coup j'ai viré le margin auto, j'ai rajouter un margin top et left et c'est bon
[img]https://phpboost.com/upload/header2.png[/img]
Edité par Jester Le 04/03/2023 à 16h28Bouh !