Ajouter des tabs dans une page cms | Astuce Prestashop 1.6

Ce tutorial va vous permettre d’insérer des tabs dans vos pages cms

Astuce Prestashop 1.6

————————————–

1) Insérer une tab horizontal sur la page cms de Prestashop 

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

Ajouter des tabs dans une page cms | Astuce Prestashop

1.2 Insérez le code suivant

1.3 Enregistrer et visualiser

Insérer des tabs dans une page cms | Astuce Prestashop

1.4 Si vos tabs ne fonctionnent pas, il sera nécessaire d’ajouter le code suivant dans ..Ajouter le code suivant  dans ../themes/lenomdevotretheme/js/global.js. Au début ou à la fin peu importe :

2) Insérer une tab sur le côté gauche sur la page cms de Prestashop 

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

Ajouter des tabs dans une page cms | Astuce Prestashop

2.2 Insérez le code suivant

2.3 Ajouter le code suivant dans ../themes/lenomdevotretheme/css/cms.css

2.4 Enregistrer et visualiser

Ajouter des tabs dans une page cms | Astuce Prestashop

2.5Si vos tabs ne fonctionnent pas, il sera nécessaire d’ajouter le code suivant dans ..Ajouter le code suivant  dans ../themes/lenomdevotretheme/js/global.js. Au début ou à la fin peu importe :

3) Insérer une tab sur le côté droite sur la page cms de Prestashop 

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

Ajouter des tabs dans une page cms | Astuce Prestashop

3.2 Insérez le code suivant

3.3 Ajouter le code suivant dans ../themes/lenomdevotretheme/css/cms.css

3.4 Enregistrer et visualiser

Ajouter des tabs dans une page cms | Astuce Prestashop

3.5Si vos tabs ne fonctionnent pas, il sera nécessaire d’ajouter le code suivant dans ..Ajouter le code suivant  dans ../themes/lenomdevotretheme/js/global.js. Au début ou à la fin peu importe :

4) Insérer une tab en bas sur la page cms de Prestashop 

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

Ajouter des tabs dans une page cms | Astuce Prestashop

4.2 Insérez le code suivant

4.3 Ajouter le code suivant dans ../themes/lenomdevotretheme/css/cms.css

4.4 Enregistrer et visualiser

Ajouter des tabs dans une page cms | Astuce Prestashop

4.5Si vos tabs ne fonctionnent pas, il sera nécessaire d’ajouter le code suivant dans ..Ajouter le code suivant  dans ../themes/lenomdevotretheme/js/global.js. Au début ou à la fin peu importe :<script>

———————————–

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

Mettre à jour automatiquement le taux de change | Astuce Prestashop 1.6
views 1818
Vous désirez ouvrir votre boutique à l'international et indiquez le taux de change. Voici un petit tuto qui va vous montrer comment mettre à jour automatiquement le taux de change grâce au service cron. ------------------------------ Avant de commencer, un petit topo : Qu'est que le service cron :  Le principe du service CRON est simple, il permet d'exécuter des tâches de manière réguli...
Supprimer le contenu par défaut de votre boutique | Astuce Prestashop 1.6
views 5303
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...
3 erreurs qui peuvent ruiner votre site e-commerce
views 384
Aujourd’hui de plus en plus d’entreprises décident de se lancer dans l’e-commerce sans pour autant maitriser à 100% les codes du web et du webmarketing. Résultats : de nombreuses erreurs sont commises, pouvant transformer son projet en vrai fiasco. Voici une liste de 3 erreurs classiques à éviter absolument. Erreur n°1 : Faire l’impasse sur votre webmarketing Lors de la réalisation de votre...
Le nouveau menu du back-office de Prestashop 1.7 – Partie 3
views 15527
Pour rappel, le menu du back-office de Prestashop 1.7 est organisé en 3 parties : Vendre qui regroupe les commandes, le catalogue, les clients, le SAV et les statistiques (voir l'article)  Personnaliser qui regroupe les modules, le design, le transport, le paiement et l’international Configurer qui regroupe les préférences et les paramètres avancés. Dans cet article, nous allons ...
Afficher les disponibilités sur la liste de produits | Astuce Prestashop 1.6
views 3159
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...

Laisser un commentaire

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