Titre du Head et taille police différente

[neojulio82]

Bonjour,

Je suis débutant sur Jimdo
J'ai regardé les quelques tutos pour modifier le head dans paramètres mais je n'ai pas trouvé d'infos concernant mon problème.
J'aimerais faire 1 titre en 2 lignes avec des polices différentes sur les 2 lignes.
Savez-vous si c'est possible facilement avec un code ?
Merci

[FredVig]

Bonjour
Ce n'est pas très simple avec du texte.
Il est préférable de réaliser une image avec le texte incrusté dessus et de la monter en fond d'écran

[neojulio82]

ok merci.
J'avais envisagé cela de toute manière.
Vous proposez de le monter en fond d'ecran ou en logo ?

[FredVig]

dans le logo c'est mieux, car il passe "devant" les autres éléments
Mais ça dépend de votre design.
Certains ne permettent pas de grands logos.

[FredVig]

Attention, il manque une }
Dans votre "modifier le head" :
#cc-website-logo{width:800px;height:44px; (ici)

[neojulio82]

Merci en effet...
Mais bon de toute manière, pour l'instant je vais refaire le titre dans le logo sur Photoshop
On verra ce que ça donne avec la problématique de résolution de l'image pour que ça se cale bien au bandeau.

[neojulio82]

J'ai essayé de créer un "logo bandeau" en zone supérieur en fond d'écran mais c'est quand même très compliqué car c'est tributaire de la résolution d’écran et du navigateur. L'affichage est souvent complètement décalé...Je ne parle même pas de la version mobile où le bandeau disparaît complètement....

Bref, je ne vois pas comment m'affranchir de le mettre en logo mais il va falloir que je change de design.

Je ne comprends pas pourquoi Jimdo a fait disparaître depuis novembre la barre d'outils pour modifier le Header et faire bouger les éléments à l'intérieur. Surtout que sur l'aide du site, on a l'impression que c'est encore possible !

Si vous avez d'autres solutions...
Merci

[FilmsdeLover]

La possibilité de modifier de façon extensive le header est fonction des designs. Tous ne permettent pas de telles modifications, il me semble.

[FredVig]

L'aide ancienne est encore en ligne car des sites basés sur les anciens designs sont encore en service.

Si vous tenez à un titre en deux couleurs réalisé en CSS, voici une démarche à étudier :

- Créez un bloc texte avec votre titre bicolore et placez-le dans la sidebar
- Déplacez votre bloc à l'aide d'une feuille de style (modifier le Head)
- Inscrivez un titre unicolore dans la zone dédiée (Pour les navigateurs qui suppriment les feuilles de style)
- Indiquez que la zone de titre dédiée doit être en opacité nulle

[FredVig]

… et si vous voulez profiter du beau bandeau que vous avez réalisé
(et que je n'avais pas vu !)
Ajoutez juste ces modifications en modifier le head :
.body
{background-position: center 100px!important;
background-attachment: fixed!important;}

[neojulio82]

Merci c'est super ! J'ai un peu honte quand même...si peu de code...
Bon je vais m'atteler à la suite maintenant. Il y a du boulot.
@+

[FredVig]

Votre design est beau et clair, et ça rattrape tout.
Il y aura toujours un technicien pour pondre du code plus vite et plus clair, mais un artiste qui sait dessiner élégamment, c'est plus rare !

[neojulio82]

C'est gentil de votre part
Je sais aussi que je peux compter sur vous pour la suite du développement du site.
Merci encore

[neojulio82]

Bonjour et encore merci pour votre aide sur le post.
Je me pose la question de l'adaptation de mon bandeau sur les mobiles et tablettes.
En effet, sur plusieurs téléphones, mon bandeau est coupe aux 2 extrémités et mon nom avec...
Faut-il que je réduise la largeur du bandeau tout simplement ?

[FredVig]

Oui, il faut re-penser tout le design d'un site pour les mobiles.
Sur certains mobiles, votre bandeau va simplement disparaître, puisqu'il est en fond de body.
Jimdo propose un design par défaut que l'on peut "designer" dans l'onglet paramètres.
Mais dès que l'on rajoute des modifications de CSS ou du javascript, cela n'est plus pris en compte de façon fiable.
L'adaptation aux différents navigateurs des mobiles et aux fenêtres de diverses largeurs est appelé le "responsive".
Il existe diverses techniques pour y parvenir.
Chrome offre une prévisualisation partielle du comportement de votre site sur diverses configurations (developper tool>emulation)
Ce qui fonctionne sur Jimdo, sans trop de complexité, est la balise @media.
Le principe est d'indiquer une modification de design (par exemple, largeur d'un élément), mais qui ne sera prise en compte QUE si on se trouve dans une condition précise (par exemple, une largeur de fenêtre inférieure à …)
La terminologie est :

Code:

@media (max-width:480px) {
#élément à modifier {width:200px!important;}
#autre élément à modifier{…;}
#autre élément à modifier{…;}
}

Vous en avez des exemples sur les sites comme acupuncture Bordeaux, CBE37 (Firefox : faire clic-droit "examiner l'élément", et allez dans "éditeur de styles" > "styles embarqués")
Si vous réduisez la fenêtre de ces sites, vous verrez que leur aspect change.
une partie de ce comportement responsive est obtenu avec du javascript, une autre avec des feuilles de style, une autre en appliquant des valeurs de pourcentage dans plutôt que des valeurs absolues.
Voilà pour mes principes en général.

[Contenu sponsorisé]