Communauté francophone - Jimdo
Bienvenue sur le nouveau forum de discussion officiel de la communauté francophone des utilisateurs de Jimdo.

Ce forum annule et remplace le précédent forum Jimdo, qui a malheureusement dû être fermé pour raisons techniques.

Vous avez un ou plusieurs sites Jimdo ? Enregistrez vous sur le forum, posez vos questions et prenez part aux discussions !

Vous êtes simple visiteur ? Vous pouvez consulter nos pages, mais vous ne pourrez pas laisser de message.

Titres illisibles sur la version mobile suite passage à nouveau design

Voir le sujet précédent Voir le sujet suivant Aller en bas

Titres illisibles sur la version mobile suite passage à nouveau design

Message par Pascale68 le Mar 23 Aoû 2016 - 16:40

Bonjour à tous,

J'ai modifié l'ancien design de mon site en choisissant le design "HELSINKI".
Je viens juste de regarder la version mobile sous Android 5.1 et c'est la cata ! affraid Pourtant sur mon PC, tout paraît OK Smile

Sur la version mobile, le titre principal (celui tout en haut en vert) ainsi que les Titres 1 sont bizarrement illisibles ou d'une taille disproportionnée.  Crying or Very sad

A noter que lors du passage vers le site Helsinki, les hauteurs et espaces étaient démesurées, j'ai voulu trouver la solution moi-même  scratch pour réduire ces espaces et afficher mon site sur environ une page écran. J'ai cherché sur le net, j'ai lu les différentes interventions des experts du forum sur le sujet. Je m'en suis donc inspiré, j'ai utilisé Firefox ("examiner l'élément") et j'ai modifié à mon tour le HEAD de mon site avec les données suivantes :

<style type="text/css">
/*<![CDATA[*/  
.jtpl-section__gutter {margin-top: 0px;}
.jtpl-header {line-height: 0;}
.jtpl-content__container.cc-content-parent {margin-top: 0px;}
/*]]>*/
</style>


Tout me paraissait bien (la version sur mon PC) jusqu'à ce que je regarde la version mobile.
Quelqu'un a une idée pour remédier à la situation ou a eu pareil mésaventure Question  Merci par avance.


Pascale
P.S: Non informaticienne, je suis arrivée aux limites de mes compétences... Embarassed

Pascale68

Messages : 4
Date d'inscription : 12/04/2015

http://www.sophrologue-mulhouse-68.fr

Revenir en haut Aller en bas

Re: Titres illisibles sur la version mobile suite passage à nouveau design

Message par FredVig le Jeu 25 Aoû 2016 - 14:11

Bonjour.
C'est la bonne méthode (votre code). Toutefois, il faut vérifier que les codes fonctionnent aussi lorsque la fenêtre du navigateur est plus étroite, ce qui doit intervenir sur la version mobile. Dans votre cas, le line-height:0 force les deux lignes du titre à s'afficher sur lui-même, le rendant illisible. supprimez cette propriété et cela devrait revenir dans l'ordre.
Les titres ne devraient pas changer sur une version mobile. Une fois que vous leur donnez un aspect (couleur, dimension) ils devraient la conserver, en tout cas proportionnellement, sur mobile. Mais Jimdo propose des alternatives mobiles de tailles pour les titres qui sont parfois surprenantes (et difficile à modifier avec du code).
Essayez d'utiliser la version 2 ou 3 des titres plutôt que la 1, et vérifiez qu'elle ne change pas trop en version mobile.

_________________
Les codes de ce forum ne sont valables que pour UN site précis, à une date précise. Inutile de les essayer sans comprendre comment cela fonctionne.
Si vous avez apprécié mon aide, aidez en retour.
Acupuncture Bordeaux - Tailam (école Arts Martiaux) - MTC Tours - Maison des arts martiaux Tours L'étape à pâtes (Restaurant)Association Bohaires de Gasconha
avatar
FredVig

Messages : 1824
Date d'inscription : 07/10/2014

http://fredvig.com

Revenir en haut Aller en bas

Re: Titres illisibles sur la version mobile suite passage à nouveau design

Message par Pascale68 le Ven 26 Aoû 2016 - 10:24

Bonjour FredVig,

Merci pour cette réponse très pertinente. J'ai modifié la ligne avec le line-height:0 dans le HEAD en le passant à 0.5. afin d'agrandir l'espace.

En supprimant complètement la ligne, l'espace au-dessus de la sidebar et autour du header était de plusieurs centimètres, ce n'était pas possible à garder en l'état.
N'ayant pas de logo, j'ai également supprimé la ligne de 1px que j'avais mis à la place du logo pour rogner de la place. Ca pouvait peut-être également joué sur le problème...
Je vais ajuster tout ça ce week-end pour voir le rendu sur téléphone portable.

Merci encore pour ta réponse, elle m'a beaucoup aidée.

Pascale.

Pascale68

Messages : 4
Date d'inscription : 12/04/2015

http://www.sophrologue-mulhouse-68.fr

Revenir en haut Aller en bas

Re: Titres illisibles sur la version mobile suite passage à nouveau design

Message par FredVig le Ven 26 Aoû 2016 - 13:56

à 0.5, le titre continue de se chevaucher. Essayez au moins 1px.
Vous pouvez aussi modifier ça :
.jtpl-header__container {
padding: 1.8rem 0;
}

_________________
Les codes de ce forum ne sont valables que pour UN site précis, à une date précise. Inutile de les essayer sans comprendre comment cela fonctionne.
Si vous avez apprécié mon aide, aidez en retour.
Acupuncture Bordeaux - Tailam (école Arts Martiaux) - MTC Tours - Maison des arts martiaux Tours L'étape à pâtes (Restaurant)Association Bohaires de Gasconha
avatar
FredVig

Messages : 1824
Date d'inscription : 07/10/2014

http://fredvig.com

Revenir en haut Aller en bas

Re: Titres illisibles sur la version mobile suite passage à nouveau design

Message par Pascale68 le Mar 30 Aoû 2016 - 20:29

Merci infiniment FredVig. Ca doit être bon maintenant.  Very Happy

Le code final (à placer dans le HEAD) pour ceux intéressés de s'en inspirer :

<style type="text/css">
/*<![CDATA[*/  
.jtpl-section__gutter {margin-top: 0px;}
.jtpl-header {line-height: 1;}
.jtpl-content__container.cc-content-parent {margin-top: 0px;}
.jtpl-header__container {padding: 1.8rem 0;}
/*]]>*/
</style>

Pascale68

Messages : 4
Date d'inscription : 12/04/2015

http://www.sophrologue-mulhouse-68.fr

Revenir en haut Aller en bas

Re: Titres illisibles sur la version mobile suite passage à nouveau design

Message par FredVig le Mer 31 Aoû 2016 - 12:56

Les codes ne conviennent qu'à un seul site précis, sauf exception.

Vous avez toujours le problème du changement de taille de la police de titre, malgré l'option h2…

Essayez de rajouter ce code :
Code:
@media(max-width:767px) { .j-module h2, .j-module h1 {
   font-size: 15px !important;
  }
}

_________________
Les codes de ce forum ne sont valables que pour UN site précis, à une date précise. Inutile de les essayer sans comprendre comment cela fonctionne.
Si vous avez apprécié mon aide, aidez en retour.
Acupuncture Bordeaux - Tailam (école Arts Martiaux) - MTC Tours - Maison des arts martiaux Tours L'étape à pâtes (Restaurant)Association Bohaires de Gasconha
avatar
FredVig

Messages : 1824
Date d'inscription : 07/10/2014

http://fredvig.com

Revenir en haut Aller en bas

Re: Titres illisibles sur la version mobile suite passage à nouveau design

Message par Pascale68 le Mer 31 Aoû 2016 - 23:01

Merci mille fois FredVig. J'ai l'impression que maintenant c'est parfait !  Very Happy

Là vraiment il fallait écrire du code... Impossible de trouver cette dernière modification si on ne sait pas programmer en html...  Wink

Pascale.

Pascale68

Messages : 4
Date d'inscription : 12/04/2015

http://www.sophrologue-mulhouse-68.fr

Revenir en haut Aller en bas

Re: Titres illisibles sur la version mobile suite passage à nouveau design

Message par FredVig le Jeu 1 Sep 2016 - 11:45

C'est pour ça qu'il y a des "experts Jimdo", nous nous occupons des détails spécifiques auxquels Jimdo ne peut pas penser à l'avance.

_________________
Les codes de ce forum ne sont valables que pour UN site précis, à une date précise. Inutile de les essayer sans comprendre comment cela fonctionne.
Si vous avez apprécié mon aide, aidez en retour.
Acupuncture Bordeaux - Tailam (école Arts Martiaux) - MTC Tours - Maison des arts martiaux Tours L'étape à pâtes (Restaurant)Association Bohaires de Gasconha
avatar
FredVig

Messages : 1824
Date d'inscription : 07/10/2014

http://fredvig.com

Revenir en haut Aller en bas

Re: Titres illisibles sur la version mobile suite passage à nouveau design

Message par Contenu sponsorisé


Contenu sponsorisé


Revenir en haut Aller en bas

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

 
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum