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.

Personnalisez la version mobile de Jimdo facilement.

Aller en bas

Personnalisez la version mobile de Jimdo facilement.

Message par FilmsdeLover le Mar 16 Juin 2015 - 10:31

En attendant l'arrivée des designs en responsive design, Jimdo a mis au point un petit outil bien pratique pour styler la version mobile de votre site : http://jimdo.github.io/mobile-view-tool/

Vous choisissez les couleurs des différentes parties de votre site mobile, vous copiez le code obtenu et vous le collez dans le "Modifier le head".

Je n'utilise pas la version mobile mais si vous vouliez styler celle-ci plus précisément, c'est l'outil approprié. Wink

_________________
Utilisateur de Jimdo depuis 2009 qui peut être grognon parfois si vous ne cherchez pas dans l'Aide Jimdo avant de poser des questions. Je ne bosse pas pour Jimdo.
A consulter : Tutoriels et guides pour Jimdo.
avatar
FilmsdeLover

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

http://www.filmsdelover.com

Revenir en haut Aller en bas

Re: Personnalisez la version mobile de Jimdo facilement.

Message par Straycat le Jeu 18 Juin 2015 - 20:55

Super, merci Smile

Je vais essayer tout cela rapidement Smile

Straycat

Messages : 3
Date d'inscription : 29/04/2015

http://www.leden-valley.com/

Revenir en haut Aller en bas

Re: Personnalisez la version mobile de Jimdo facilement.

Message par iSteph le Lun 23 Nov 2015 - 15:12

L'idée est intéressante mais ça ne marche pas sur Safari !?! Crying or Very sad
Obligé d'utiliser Firefox ou Chrome. Faut l'savoir !
avatar
iSteph

Messages : 44
Date d'inscription : 19/11/2014
Localisation : Aubenas

http://www.itinerance-graphique.com

Revenir en haut Aller en bas

Re: Personnalisez la version mobile de Jimdo facilement.

Message par mania26 le Jeu 21 Jan 2016 - 20:39

La personnalisation ne marche plus ... Sad

mania26

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

http://www.dronepixel.fr

Revenir en haut Aller en bas

Re: Personnalisez la version mobile de Jimdo facilement.

Message par FredVig le Jeu 21 Jan 2016 - 20:58

Il s'agissait d'une disposition temporaire.
Tous les designs Jimdo sont voués à devenir "rapidement" responsives.
Madrid et malaga le sont déjà.
Pour les cas particuliers, utilisez le code et la balise @media (voir les tutos Hors Forum : media query en particulier Open classroom)


Dernière édition par FredVig le Dim 24 Jan 2016 - 12:01, édité 2 fois

_________________
'Expert' Jimdo affilié, bénévole du forum et indépendant rémunéré par mes clients.
avatar
FredVig

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

http://fredvig.com

Revenir en haut Aller en bas

Re: Personnalisez la version mobile de Jimdo facilement.

Message par mania26 le Jeu 21 Jan 2016 - 21:07

Tu aurais un lien ? je te remercie ! Wink

mania26

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

http://www.dronepixel.fr

Revenir en haut Aller en bas

Re: Personnalisez la version mobile de Jimdo facilement.

Message par ZeTuto le Ven 22 Jan 2016 - 21:06

@mania26 voici une discussion du forum qui en parle http://www.jimdoforum.fr/t425-comment-faire-pour-avoir-son-site-en-mode-responsive

et pour plus de précisions, voici un lien externe sur les medias queries : https://developer.mozilla.org/fr/docs/Web/CSS/Media_queries
avatar
ZeTuto

Messages : 203
Date d'inscription : 08/10/2014

http://www.zetuto.com

Revenir en haut Aller en bas

Re: Personnalisez la version mobile de Jimdo facilement.

Message par Solie le Dim 24 Jan 2016 - 1:53

mania26 a écrit:La personnalisation ne marche plus ... Sad
Peut-être avez-vous déjà suivi les conseils de FredVig et ZeTuto parce que votre site est responsive. Ce serait dommage d'utiliser la version mobile Wink




Pour ceux qui ne sont pas encore en responsive, et en attendant que le bug de ce lien de personnalisation de la version mobile soit réparé, voici le code-modèle d'origine à mettre dans "Modifier le head":

Code:
<style type="text/css">
/*<![CDATA[*/
.mobile{color:#666}.mobile p,.mobile table,.mobile td,.mobile span,.mobile strong,.mobile div{color:#666 !important}.mobile header{background:#fff !important;border:1px solid #fff;border-bottom:2px solid #fff}.mobile header h1{color:#18c5a3 !important}.mobile header.j-blog-meta a{color:#18c5a3 !important}.mobile #cc-website-title{background:#18c5a3}.mobile #cc-website-title h1{color:#fff !important}.mobile h1,.mobile h1 a{color:#18c5a3 !important}.mobile h2{color:#18c5a3 !important}.mobile h3{color:#18c5a3 !important}.mobile h3 p,.mobile h3 span{color:#18c5a3}.mobile h3 p.postmeta,.mobile h3 span.postmeta{color:#18c5a3}.mobile #tp-content{background-color:#fff;margin:0;padding:.7rem}.mobile #tp-content a{text-decoration:underline;color:#18c5a3 !important}.mobile #tp-content .cc-m-download-link,.mobile #tp-content .comment:link,.mobile #tp-content .comment:visited,.mobile #tp-content .blogreadmore:link,.mobile #tp-content .blogreadmore:visited,.mobile #tp-content .j-calltoaction-link,.mobile #tp-content .cc-m-form-view-input-wrapper input[type=submit],.mobile #tp-content .skiptoform a,.mobile #tp-content .zend_form input[type=submit]{background-color:#18c5a3;color:#fff !important}.mobile #tp-content .cc-m-download-link:focus,.mobile #tp-content .comment:link:focus,.mobile #tp-content .comment:visited:focus,.mobile #tp-content .blogreadmore:link:focus,.mobile #tp-content .blogreadmore:visited:focus,.mobile #tp-content .j-calltoaction-link:focus,.mobile #tp-content .cc-m-form-view-input-wrapper input[type=submit]:focus,.mobile #tp-content .skiptoform a:focus,.mobile #tp-content .zend_form input[type=submit]:focus,.mobile #tp-content .cc-m-download-link:active,.mobile #tp-content .comment:link:active,.mobile #tp-content .comment:visited:active,.mobile #tp-content .blogreadmore:link:active,.mobile #tp-content .blogreadmore:visited:active,.mobile #tp-content .j-calltoaction-link:active,.mobile #tp-content .cc-m-form-view-input-wrapper input[type=submit]:active,.mobile #tp-content .skiptoform a:active,.mobile #tp-content .zend_form input[type=submit]:active{color:#18c5a3;background-color:#fff}.mobile .menubtn{background:#fff !important;border:1px solid #18c5a3}.mobile .menubtn:after{border-color:#18c5a3}.mobile nav{border-bottom:1px solid #18c5a3;color:#666}.mobile nav ul li a,.mobile nav ul li a:link,.mobile nav ul li a:visited{color:#18c5a3}.mobile nav #mainNav1 li{background:#fff}.mobile nav #mainNav1 li>a,.mobile nav #mainNav1 li>a:link,.mobile nav #mainNav1 li>a:visited{color:#18c5a3}.mobile nav #mainNav2 li{border-left:2px solid #18c5a3}.mobile nav #mainNav3 li{border-left:2px solid #18c5a3}.mobile .cc-nav-expand>a:after,.mobile .cc-nav-expand-open>a:after,.mobile .cc-nav-expand>a:link:after,.mobile .cc-nav-expand-open>a:link:after,.mobile .cc-nav-expand>a:visited:after,.mobile .cc-nav-expand-open>a:visited:after{border-top-color:rgba(102,102,102,0.6)}.mobile .tp-changeview a{border:1px solid #18c5a3;color:#18c5a3 !important}.mobile footer{background-color:#18c5a3;color:#fff !important}.mobile footer span,.mobile footer a,.mobile footer #contentfooter div{color:#fff !important}.mobile .datetime{color:#666}.mobile .datetime .day-word,.mobile .datetime .day,.mobile .datetime .mon,.mobile .datetime .yr{color:#666}.mobile .j-hr hr{border:0;border-bottom:1px solid #18c5a3}.mobile .cc-m-form-view-sortable input:focus,.mobile .cc-m-form-view-sortable textarea:focus,.mobile .cc-m-form-view-sortable input:hover,.mobile .cc-m-form-view-sortable textarea:hover,.mobile .cc-m-form-view-sortable input:active,.mobile .cc-m-form-view-sortable textarea:active{color:#666}.mobile .cc-price,.mobile .cc-shop-price{color:#18c5a3 !important}.mobile a.j-sidecart-checkout-link,.mobile a.j-sidecart-checkout-button{color:#fff !important}.mobile button.cc-shop-addtocard{background-color:#18c5a3;color:#fff !important}.mobile button.cc-shop-addtocard span{color:#fff !important}.mobile button.cc-shop-addtocard:focus,.mobile button.cc-shop-addtocard:active{color:#18c5a3;background-color:#fff}.mobile button.cc-shop-addtocard a.j-sidecart-checkout-link,.mobile button.cc-shop-addtocard a.j-sidecart-checkout-button{color:#fff !important}.mobile .hproduct span.fn{color:#18c5a3}.mobile .cc-catalog-wrapper .cc-catalog-gutter .cc-webview-product.hlisting .cc-product-title a{color:#18c5a3}.mobile .cc-catalog-wrapper .cc-catalog-gutter .cc-webview-product.hlisting .cc-webview-product-price .cc-catalog-price-old{color:#666}.mobile .cc-shop-product-price-old{color:#666}.mobile a.cc-shop-addtocard,.mobile a.cc-shop-addtocard:visited,.mobile a.cc-sidecart-checkout,.mobile a.cc-sidecart-checkout:visited,.mobile input.cc-checkout-btn{background-color:#18c5a3 !important}.tpl-button{background-color:#18c5a3;color:#fff !important}.tpl-button:focus,.tpl-button:active{color:#18c5a3;background-color:#fff}
/*]]>*/
</style>

Les références couleurs:
#666 (gris)
#fff (blanc)
#18c5a3 (vert)
sont à remplacer selon vos envies.

N'oubliez pas d'activer "Version mobile" dans "Paramètres".
Si l'option "Version mobile" n’apparaît pas dans "Paramètres", c'est que votre design est déja en Jimdo responsive.

avatar
Solie

Messages : 513
Date d'inscription : 06/05/2015

http://www.voixoff.com

Revenir en haut Aller en bas

Re: Personnalisez la version mobile de Jimdo facilement.

Message par Ishimaru Chiaki le Mer 27 Jan 2016 - 9:28

Bonjour,

Merci, ça marche de mon côté (design Chicago)
Du coup, la lisibilité est pas mal mieux !
avatar
Ishimaru Chiaki

Messages : 4
Date d'inscription : 20/01/2016
Localisation : Baie-Comeau, Canada

http://apdvm.jimdo.com

Revenir en haut Aller en bas

Re: Personnalisez la version mobile de Jimdo facilement.

Message par Contenu sponsorisé


Contenu sponsorisé


Revenir en haut Aller en bas

Revenir en haut

- Sujets similaires

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