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

SPAM PRESTASHOP FORMULAIRE DE CONTACT
views 3653
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...
Gratuit : Template Mails | Astuce Prestashop 1.6
views 3631
Je vous propose une nouvelle mise en page plus minimaliste pour les mails. Le fichier comprend la version anglaise et française. Vous pouvez télécharger les templates gratuitement. Cette astuce Prestashop est valable pour la version 1.6 et 1.5 1) Exemple de mails   A noter : - Il est possible de modifier le contenu des mails. Pour cela il faut aller dans Localisation > Traductio...
Améliorer les performances de votre boutique Prestashop 1.6
views 5794
A) Connaitre les performances de sa boutique Prestashop Lorsqu'un internaute arrive sur votre site de vente en ligne en général il n'a pas la patience d'attendre le chargement d'une page. Par conséquent, plus le temps de chargement est long, plus le taux d'abandon est important. Aujourd'hui, il existe de nombreux sites pour tester la  performances de son site ecommerce, en ce qui me concern...
Supprimer le contenu par défaut de votre boutique | Astuce Prestashop 1.6
views 6272
Lorsque vous installez Prestashop pour la 1er fois, du contenu par défaut est installé : faux clients, faux produits, fausses commandes.... Si vous désirez les supprimer, il existe une méthode très simple dans Prestashop. 1) Connectez-vous dans le back-office de Prestashop 2) Allez dans Modules & Services > Modules & Services 3)  Recherchez le module qui s'appelle : Nett...
Comment configurer les mails dans PrestaShop 1.6 & PrestaShop 1.7
views 10285
Dans ce tutoriel, nous allons voir comment configurer les mails dans PrestaShop. En effet, votre site en ligne va envoyer de nombreux messages à vous et vos clients : création de compte, confirmation de commande.... il est alors important de bien paramétrer cette partie. Pour Prestashop 1.6 & PrestaShop 1.7  La procédure est identique pour les deux versions A) Accéder aux mails Depui...

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 *