Comment configurer le diaporama de la page d’accueil | Prestashop 1.6 et 1.7

Aujourd’hui, nous allons voir comment configurer le diaporama de votre page d’accueil sur votre boutique en ligne sur Prestashop 1.6 &Prestashop 1.7

————————————————————————————————————————

Tutorial pour Prestashop 1.6

A noter la taille de l’image pour le diaporama est de 779px de large pour 448px de haut.

Etape 1: Tout d’abord, connectez-vous au back-office de votre site Prestashop puis, allez dans Modules & Services >  Modules & Services

Comment configurer le diaporama de la page d’accueil | Prestashop 1.6 & 1.7


Etape 2: 
Dans le champ recherche, tapez « diaporama » (le module s’appelle « Diaporama pour votre page d’accueil ») puis cliquez sur « configurer »

Comment configurer le diaporama de la page d’accueil | Prestashop 1.6 & 1.7


Etape 3:
Configurer les paramètres du diaporama

Comment configurer le diaporama de la page d’accueil | Prestashop 1.6 & 1.7

  • Largeur maximale de l’image: correspond à la largeur maximum de vos images à l’intérieur du diaparoma
  • Vitesse: correspond à la vitesse à laquelle vous désirez que vos images défilent.
  • Pause: correspond au temps d’arrêt entre chaque image.
  • Lecture automatique: si vous activez cette option, les images défileront automatiquement, sinon le client devra cliquer sur les flèches pour visualiser les autres images de votre diaporama.


Etape 4:
Ajouter ou modifier les images sur votre diaporama

– pour ajouter une image: cliquez sur le bouton + en haut à droite
– pour modifier une image:  cliquez sur le bouton « modifier » à côte de l’image que vous désirez modifier

Comment configurer le diaporama de la page d’accueil | Prestashop 1.6 & 1.7

Puis insérez les informations de votre image

Comment configurer le diaporama de la page d’accueil | Prestashop 1.6 & 1.7

  • Sélectionner le fichier: permet d’uploader votre image.
  • Le titre de la diapositive: correspond au nom donné à votre image (n’apparaît pas sur le front-office de votre boutique).
  • URL cible: permet d’insérer un lien sur votre image. Ainsi lorsque le client clique sur l’image il sera renvoyé sur la page du lien.  Si vous ne désirez pas insérer un lien, il suffit de mettre #.
  • Légende: si votre image ne se charge pas, le texte de légende apparaitra. Ce champ est important pour l’accessibilité et permet aussi le référencement de votre image.
  • Description: permet de mettre une description sur votre image, attention le texte apparaît pas sur le front-office de votre boutique.
  • Actif. permet d’activer ou de désactiver l’image.

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

Tutorial pour Prestashop 1.7

A noter la taille de l’image pour le diaporama est de 1110px de large pour 340px de haut.

Etape 1: Tout d’abord, connectez-vous au back-office de votre site Prestashop puis, allez dans Modules  >  Modules & Services

Comment configurer le diaporama de la page d’accueil | Prestashop 1.6 et 1.7


Etape 2: 
Dans le champ recherche, tapez « carrousel » (le module s’appelle « Carrousel ») puis cliquez sur « configurer »

Comment configurer le diaporama de la page d’accueil | Prestashop 1.6 et 1.7


Etape 3:
Configurer les paramètres du diaporama

Comment configurer le diaporama de la page d’accueil | Prestashop 1.6 et 1.7

  • Vitesse: correspond à la vitesse à laquelle vous désirez que vos images défilent.
  • Pause au survol: si vous activez cette option les images arrêteront de défiler lorsque la souris passe au dessus du carrousel
  • Répéter les images: si vous activez cette option, les images se répéteront à l’infini, sinon le carrousel s’arrêtera à la fin de la dernière image.


Etape 4:
Ajouter ou modifier les images sur votre diaporama

– pour ajouter une image: cliquez sur le bouton + en haut à droite
– pour modifier une image:  cliquez sur le bouton « modifier » à côte de l’image que vous désirez modifier

5-prestashop1_7-diaporama

Puis insérez les informations de votre image

4-prestashop1_7-diaporama

  • Image: permet d’uploader votre image.
  • Titre: correspond au nom donné à votre image (n’apparaît pas sur le front-office de votre boutique).
  • URL cible: permet d’insérer un lien sur votre image. Ainsi lorsque le client clique sur l’image il sera renvoyé sur la page du lien.  Si vous ne désirez pas insérer un lien, il suffit de mettre #.
  • Légende: si votre image ne se charge pas, le texte de légende apparaitra. Ce champ est important pour l’accessibilité et permet aussi le référencement de votre image.
  • Description: permet de mettre une description sur votre image, attention le texte apparaît pas sur le front-office de votre boutique.
  • Activé. permet d’activer ou de désactiver l’image.

Articles similaires

Braintree – Une solution de Paiement sans VAD | Prestashop
views 3249
Qu'est-ce que Braintree ?  Braintree offre une solution complète de paiement pour les e-marchands sur mobile, tablette et bureau. C'est une entrepris...
Insérer un favicon dans votre boutique Prestashop
views 1467
A) Qu'est ce qu'un favicon ?  Le favicon est l'icône qui se situe à  gauche de l'URL dans la barre d'adresse de votre navigateur B) Quelle est l...
Insérer une page CMS sur votre formulaire de contact | PrestaShop 1.6
views 709
Vous désirez insérer une page cms à l'intérieur de votre formulaire de contact de votre boutique PrestaShop Rien de plus simple avec ce petit tuto ...
Insérer une page cms sur une page produit | Astuce Prestashop 1.6
views 1721
Je vais vous montrer comment insérer une page cms sur une page produit. Astuce Prestashop 1.6 1) Si on désire que le contenu soit affiché sur ...
Petit aperçu du thème Classic de prestashop 1.7
views 3136
Prestashop vient de sortir la version  1.7.0.0 RC0. A noter, par rapport à la version Prestashop 1.6, le thème a été totalement repensé afin d'être...
Ajouter un accordéon dans une page cms | Astuce Prestashop 1.6
views 1968
Grâce à ce tuto très simple, vous pourrez ajouter un accordéon dans votre page CMS Astuce Prestashop 1.6 ---------------------------------------...
Greffer le menu haut horizontal dans displayNav | Astuce Prestashop 1.6
views 2473
Ce tutoriel va vous permettre de greffer le module "menu haut horizontal" dans displayNav Cette astuce Prestashop est valable pour la version 1.6 ...
Mettre sa boutique en maintenance et accéder à sa boutique  | Prestashop 1.6 et 1.7
views 1141
Lorsque vous désirez effectuer de grands changements sur votre boutique, je vous conseille de mettre votre boutique en maintenance c'est à dire de sig...
3 produits achetés le 2ème gratuit | Astuce Prestashop
views 1345
Vous désirez mettre en place une campagne de promotion : x produits achetés, 1 offert. Il est très facile de configurer ce cas de figure dans Prest...
Supprimer le nom de la boutique de la balise Meta Title| Astuce Prestashop 1.6
views 1611
Grâce à ce tuto, vous allez pouvoir supprimer le nom de votre boutique de la balise Meta Title de vos pages sur votre site e-commerce Astuce Presta...

Laisser un commentaire

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