Ajouter un accordéon dans une page cms | Astuce Prestashop 1.6

Grâce à ce tuto très simple, vous pourrez ajouter un accordéon dans votre page CMS

Astuce Prestashop 1.6

————————————————-

Solution 1 (ne fonctionne pas toujours)

1) Une fois sur la page cms, cliquez sur l’icône source code

Ajouter des tabs dans une page cms | Astuce Prestashop

2. Insérez le code suivant

3 Enregistrer et visualiser

Ajouter un accordéon dans une page cms | Astuce Prestashop

Solution 2

1) Une fois sur la page cms, cliquez sur l’icône source code

Capture d’écran 2016-04-05 à 14.02.35

2. Insérez le code suivant

3) Ajouter le code suivant  dans ../themes/lenomdevotretheme/js/global.js. Au début ou à la fin peu importe :

4) Ajouter le code suivant  dans ../themes/lenomdevotretheme/css/cms.css

5)  Résultat

Ajouter un accordéon dans une page cms | Astuce Prestashop

Attention: lorsque vous touchez les fichiers .tpl .css, si vous ne voyez pas de changements, n’oubliez pas de nettoyer votre cache Prestashop !

Articles similaires

Le nouveau menu du back-office de Prestashop 1.7 – Partie 1
views 4141
La version R.C.0.1 de Prestasho 1.7 est sortie, et grande surprise son back-office a été traduit en français (enfin une grande partie) Par rapport à Prestashop 1.6,  celui-ci a totalement été remodelé. Il se veut plus ergonomique et plus simple d’utilisation. Dans ce tutoriel, nous allons voir comment a été remanié le "menu". Par rapport à Prestashop 1.6, le menu est organisé en 3 parties...
Pourquoi faut-il migrer sur Prestashop 1.6 | Infographie
views 207
Cette infographie, met en avant les différentes raisons pour migrer son site Prestashop sur la version 1.6 En voici quelques-unes : - le thème par défaut de Prestashop est plus esthétique que l'ancien, plus  élégant, souple et permet de mettre en avant des bannières personnalisables. - il est possible de modifier les couleurs, les polices, etc directement depuis le Front Office. - la création ...
SPAM PRESTASHOP FORMULAIRE DE CONTACT
views 3115
Depuis qq temps, des robots de SPAM utilisent le formulaire de contact des boutiques PrestaShop pour envoyer des mails. Voici deux astuces  (les deux versions ont été testées)  pour la version Prestashop 1.6 - astuce 1 : I'm not a robot de google - astuce 2 : captcha invisible ASTUCE 1 1) Allez google Re-capcha : https://www.google.com/recaptcha/intro/invisible.html - En haut à droi...
L’Affichage des colonnes | Astuce Prestashop 1.6
views 1793
La dernière version de Prestashop (1.6) permet de gérer plus facilement l'affichage de la colonne de droite ou de gauche et de choisir sur quelles pages les afficher directement depuis le back-office. Où configure t-on l'affiche des colonnes  dans le back office de Prestashop ?  Allez dans l'onglet Préférences > Thèmes cliquez sur le lien Paramètres avancés du thème actif sur votre boutique. ...
Afficher les disponibilités sur la liste de produits | Astuce Prestashop 1.6
views 2803
Ce tutorial va vous permettre d'afficher les disponibilités (en stock....) sur la liste des produits du bloc Populaire , Nouveaux Produits, Meilleures Ventes ...., Cette astuce Prestashop est valable pour la version 1.6 ------------------------------- 1) Modification du fichier product-list.tpl. Ouvrez le fichier product-list qui se situe à l'intérieur de votre thème est inséré le code...

6 réponses à “Ajouter un accordéon dans une page cms | Astuce Prestashop 1.6”

  1. Adrian dit :

    Hello, et merci pour ces méthodes !
    La première ne fonctionne apparemment pas, par contre la deuxième est parfaite !
    Attention dans le 4) tout à la fin :
    il y a un espace à f147, du coup le symbol ne fonctionne pas.
    Merci à vous 🙂

    }
    .accordion-toggle.minus-cercle:before {
    content: “\f147 “;
    }

  2. Benjamin dit :

    La solution 2 marche pour moi, merci.
    Juste 1 question: lors d’une mise à jour de Prestashop, le fichier global.js est il remplacé?

  3. c_majory dit :

    Bonjour,

    Non, en cas de mise à jour de prestashop, les fichiers qui se situent à l’intérieur du dossier thèmes ne sont pas impactés.

  4. Caroline dit :

    Merci pour ce tuto simple et efficace. J’ai d’office testé la solution 2 qui marche très bien. Sauf que 🙂 j’ai 2 blocs (editeur de page d’accueil et contentbox) sur la même page et dans lesquels j’ai créé pour chacun un effet toggle. J’avais testé d’abord sur le second bloc. Mais depuis que j’ai mis le code dans le premier, le second ne fonctionne plus. Que faut-il faire pour pouvoir utiliser le script à plusieurs endroits de la page ? Merci d’avance

  5. c_majory dit :

    en changeant les classes

  6. Abdelmoula Nami dit :

    Bonjour
    Merci pour le tuto , cela fonctionne avec 1.7?

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *