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

Afficher le champ adresse sur plusieurs lignes | Bloc contact infos – Astuce Presta...
views 1123
Cette astuce Prestashop est valable pour la version 1.6 Vous l'avez sûrement remarqué, en bas de page, l'adresse de votre magasin est sur une seule ligne. Ce rapide tutoriel va vous permettre d'afficher le champ adresse sur plusieurs lignes Valable pour Prestashop 1.6 et 1.5 ----------------------------------- 1) Pour insérer les informations de votre boutique, il faut aller...
Comment créer une langue manuellement | Prestashop 1.6 / 1.7
views 2617
Vous ne désirez pas utiliser le pack de traduction de Prestashop ? Vous désirez faire vos traductions vous-même ? Prestashop 1.6 et 1.7 permet facilement de créer une nouvelle langue sur une boutique e-commerce. Le paramétrage est identique pour les deux versions, la seule différence est le chemin pour arriver à la page de création de langue. -------------------------------------- Si...
Ajouter gratuitement un live chat sur votre site | Astuce Prestashop 1.6
views 2244
Qu'est qu'un live chat ?  Le terme live chat désigne l'ensemble des moyens qui permet à un internaute de rentrer instantanément en contact  avec un employé du site afin de répondre à ses questions. Comment installer un live chat sur sa boutique Prestashop ?  Pour l'installer sur votre site en ligne, il vous faudra un module et s'enregistrer sur une platform. C'est très rapide et facile ...
Le nouveau menu du back-office de Prestashop 1.7 – Partie 2
views 5588
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 ...
Modifier la police d’écriture avec Google Fonts – PrestaShop 1.7
views 7072
Dans ce tuto nous allons voir comment modifier la police d'écriture avec Google Fonts pour votre site PrestaShop 1.7 A noter: actuellement la police par défaut est Noto Sans, sans-serif Etape 1) Choisir sa police d'écriture  Nous allons choisir notre/nos police(s) d'écriture sur le site de Google Fonts à cette adresse : https://fonts.google.com/ Je vais choisir deux polices d'écriture, 1 ...

Laisser un commentaire

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