Insertion de deux logos et d'une image tout en haut du Thème Ocean Mist
-
Bonjour à tous,
Je cherche à ajouter deux logos ainsi qu’un portrait tout en haut de mon blog.
Savez vous ce que je dois écrire dans la feuille CSS pour ces deux commandes ?
Pour sûr j’aimerais glisser mes deux logos tout en haut à droite de l’écran dans des tout petits rectangles.Merci beaucoup pour votre aide !
x M x
L’adresse du blog concerné est (visible uniquement pour les utilisateurs connectés).
-
Pour insérer une image ou un logo voici le code :
<img src="http://ADRESSEdelimage.gif">Exemple concret :
<img src="http://exemple.fr/images/monbeaulogo.jpg" alt="c mon beau logo"> -
Ah j’allais oublié !
Dans un premier temps il faut uploader l’image/le logo si ce n’est pas déjà fait via ton dashboradDans Médias > Ajouter fichiers
Et là il faut copier/coller l’adresse du logo/image.
-
Merci beaucoup.
Mais je dois mettre cette formule magique dans quelle partie de ma feuille CSS ?
N’importe où ? dans « #header » ? J’aimerais le mettre à côté du nom de Malika Benarab-Attou, Députée…Merci tout plein,
x Marie x
-
Alors ce n’est pas dans le fichier style.css qu’il faut le mettre mais dans un fichier en .php ou directement dans un widget.
Pour le haut de ton blog, il faudrait le placer dans le header.php
-
@splouch : Nous n’avons pas accès aux fichiers .php ici. Vous confondez probablement WordPress.com et WordPress.org.
https://fr.forums.wordpress.com/topic/wordpresscom-ou-wordpressorg?replies=1Remarque générale : pourriez-vous SVP vérifier vos renseignements avant de les donner aux autres utilisateurs, afin d’éviter de les induire en erreur?
-
-
@malikabenarabattou : Je vous aiderais bien, mais… voir ma réponse de l’autre sujet.
https://fr.forums.wordpress.com/topic/mettre-couleurs-differentes-entre-textes-du-blog-et-exterieur-du-blog?replies=4#post-17883 -
-
(Re)bonjour,
Je n’ai rien trouvé de plus proche de votre souhait que d’ajoutervos images déjà dimensionnées (*) dans les parties « h1 » (titre) et « description » (sous-titre) de votre en-tête :
H1Votre code ressemble à ça :
h1 {
-x-system-font: none;
color: #FFFFFF;
font-family: Tahoma,Verdana,Arial,sans-serif;
font-size: 2.2em;
font-size-adjust: none;
font-stretch: normal;
font-style: normal;
font-variant: normal;
font-weight: normal;
letter-spacing: -1px;
line-height: normal;
margin-bottom: -5px;
margin-left: 0;
margin-right: 0;
margin-top: 0;
padding-bottom: 0;
padding-left: 37px;
padding-right: 37px;
padding-top: 45px;
}Mais attention, vous êtes déjà intervenue : ne copiez-collez pas cette partie, mais recherchez-là dans votre CSS modifiée et ajoutez-y ces lignes :
background-image: url(« URL DE VOTRE LOGO »);
background-repeat: no-repeat;
background-position: left;(« background-repeat: no-repeat; » c’est pour que votre logo ne se répète pas sur toute la largeur de l’en-tête)
Avec cela, il faut décaler le titre de votre blog vers la droite pour éviter la superposition, en intervenant sur la ligne :
padding-left: 37px;
Description :
.description {
color: #9CC932;
margin-bottom: 25px;
margin-left: 37px;
margin-right: 37px;
margin-top: 0;
}Mêmes recommandations et même méthode que pour h1, mais avec :
background-position: right;
Il y a sûrement mieux et plus propre au niveau du code, mais je ne sais pas faire…
maltepe(*) Normalement, la taille de l’image devrait pouvoir se réglere avec une ligne « background-size: XXpx XXpx; » (largeur et hauteur), mais curieusement ça ne fonctionne pas…
-
Alors voyons voir ce que donne cette partie bricolage… je vous tiens au courant…
Vous pensez qu’il vaut mieux que je fasse un jpeg avec le nom du blog et les logos ? Comme cela ça fait un seul doc à insérer ? -
-
Merci beaucoup Maltepe.
J’ai finalement copié votre formule en mettant l’image à droite, donc je n’ai pas bousculé la formule « description ».
C’est TB !
x Merci x,Marie
-
J’ai oublié de cocher la case « Avertissez-moi par email des derniers développements » et je ne découvre vos questions que maintenant…
Bon, la question semble résolue, mais au bénéfice du doute :Vous pensez qu’il vaut mieux que je fasse un jpeg avec le nom du blog et les logos ? Comme cela ça fait un seul doc à insérer ?
Non, parce que le nom du blog ne serait plus cliquable ; hors, un clic dessus est le moyen de revenir à la page d’accueil rapidement.
Associer vos deux logos dans une seule image est une solution (que vous avez visiblement adoptée) ; ça rend plutôt bien. :-)Ok je vous l’idée mais pourquoi la partie « descritpion » ensuite ?
Parce que vous étiez partie sur l’idée de deux logos dans l’en-tête, dont l’un à côté du titre de votre blog :
je vous ai donc donné une piste pour insérer les logos dans cet en-tête, qui se décompose en deux parties : le titre (= »h1) et le sous-titre (« .description » en CSS) ; comme je ne voyais pas comment insérer deux logos dans le même segment, je vous ai proposé d’en insérer un dans l’espace h1 et l’autre dans l’espace .description.
C’est tout… :-)J’ai finalement copié votre formule en mettant l’image à droite, donc je n’ai pas bousculé la formule « description ».
C’est TB !
Tout est pour le mieux dans le meilleur des mondes possibles, alors…
Tant mieux ! :-)x Merci x,
Avec plaisir,
maltepe
-
@emmaltepe : Désolé de l’interruption, mais si vous avez un moment, pourriez-vous jeter un oeil sur ce sujet?
https://fr.forums.wordpress.com/topic/modifier-la-hauteur-du-titre-et-du-menu?replies=3 -
Bonsoir Airodyssey :-)
J’ai vu le sujet, et ai commencé à regarder, mais c’est assez compliqué, mes essais n’ont pour le moment rien donné.
Je m’apprêtais à y répondre, juste pour que l’auteur ne se sente pas abandonné, quand j’ai reçu votre message….
maltepe
- Le sujet ‘Insertion de deux logos et d'une image tout en haut du Thème Ocean Mist’ est fermé aux nouvelles réponses.
Forums WordPress.com en français 