Blocs de texte personnalisé - est il possible d'en inserer 2 ?

[gilles42]

bonjour à tous,

 

Je m'appelle Gilles,

je suis en train de créer une boutique en presta 1.7

cela fait 9 mois je suis dessus.... (et oui seul avec + de 10 000 articles à rentrer)

 

Je suis maintenant sur l'apparence de cette boutique.

 

J'ai utilisé le Blocs de texte personnalisé en bas de la page d'accueil (ou il s'est installé automatiquement)

et sur la version mobile du site, on ne voit que ce bloc.

Pas de carrousel (même si je l'active...), bref cela ne me dérange pas.

 

Donc ce Blocs de texte personnalisé, je l'ai utilisé pour créer un "menu" ou plutôt une page pour mobile avec tous les liens des catégories avec des images. Çà rend pas mal.

Par contre j'ai été obligé de mettre de petites images, des textes serres, pour que cela passe bien sur l'écran de mon téléphone.

 

Le hic, si je greffe ce bloc en haut de page, le menu vertical tout petit ne correspond pas à la version PC de la boutique.

 

Je voudrais donc

SI C EST POSSIBLE

de greffer un 2ème Blocs de texte personnalisé à la place du carrousel, mais  qui ne s’afficherait que sur la version ordi fixe et non sur les mobiles (pour garder celui existant pour les mobiles).

 

j'espère que je ne suis pas le seul à me comprendre

 

Si quelqu'un a une solution ??

 

merci

Gilles

[SuperManu74]

Bonjour,

Un moyen pour faire cela (qui nécessite de coder un peu) est de créer deux div, avec des id différents, une pour la version mobile avec tout le contenu que vous avez déjà créé, et une deuxième div pour la version ordi avec tout le contenu que vous souhaitez voir sur un ordi. ensuite, il faut aller ajouter au fichier theme.css un code qui gère le côté responsive de la chose.

en gros, dans votre bloc de texte personnalisé, se mettre en mode code <> et utiliser quelque chose comme ceci

<div id="version-mobile">

blabla pour portable

</div>

<div id="version-ordi">

blabla pour ordi

</div>

dans le fichier theme.css que l'on trouve en général dans /themes/classic/assets/css/

il faut un truc du genre

 

/*pour ordi*/
@media screen and (min-width: 1080px) {
 #version-mobile{
 visibility: hidden;
 }
}

/*pour mobile*/
@media screen and (max-width: 1080px) {    
 #version-ordi{
 visibility: hidden;
 }
}

bien sûr, on peut ajouter plein de choses dans le css et jouer avec les dimensions limites, ici 1080px, pour affiner l'apparence.

ATTENTION pour que cela prenne effet, il faut vider le cache depuis le back office de prestashop à chaque modif du css