J’ai perdu l’habitude de faire des critiques de slider. Mais aujourd’hui, je renoue avec mes anciennes habitudes en vous proposant une critique du plugin Slider Smart 3.
Il est non seulement le meilleur plugin pour slider, mais il est aussi un exemple que doivent suivre tous les autres plugins du même type. Donc, nous allons jeter un coup d’œil et vous jugerez s’il en vaut la peine ou non.
Vous devez savoir qu’il s’agit d’un plugin premium, mais une version gratuite est également disponible, avec plus d’options que certains plugins premium.
Ses avantages :
- Interface incroyable
- Version gratuite avec beaucoup de fonctionnalités
- Facile à utiliser
- Tableau de bord agréable à regarder
Ses inconvénients :
- Le bouton supprimer devrait pouvoir servir
- L’apprentissage des animations prend unpeu de temps
En résumé :
Qu’est-ce que Slider Smart 3 ?
Slider Smart 3 est un plugin que vous pouvez utiliser pour créer des slider et les placer partout sur votre site. Vous pouvez mettre ensemble tout ce que vous voulez avec ses animations puissantes, affiné entre les diapositives (version premium), créer des couches d’animations pour faire bouger les choses sur le slider.
Création d’un slider
Dans un premier temps, vous serez accueilli dans vos sliders par les ressources utiles situées sur la gauche. Vous pouvez afficher vos sliders par nom ou par date de création. Vous pouvez également choisir un tas de petites actions pratiques, mais l’action principale est beaucoup plus grande et plus visible avec un design agréable.
Notez comment tous les boutons d’action que vous utilisez pour ajouter un slider sont verts, les boutons d’action secondaires moins importants sont bleus, et le reste des boutons sont gris.
Ajouter un slider
Si vous avez la version gratuite, vous aurez accès à quatre sliders libres. Si vous avez la version pro, vous aurez accès à une bibliothèque de plus de 100 slider préconstruits, ce qui peut vous donner un excellent point de départ.
Slider à partir de rien
Si vous voulez commencer un nouveau projet, vous commencez par sélectionner un modèle. La version gratuite offre quatre modèles tandis que la version premium propose 11 modèles.
Une fois créé, vous pouvez commencer par la définition des options générales et l’ajout des diapositives. Vous aurez probablement envie de modifier les paramètres généraux d’abord, puis les ajuster selon les besoins une fois que vous avez créé quelques sliders.
Les options du slider
Deux sections à onglets vous donnent accès à une multitude d’options. La première section définit les paramètres réels, la deuxième section se concentre sur le visuel.
La première section vous permet de modifier les paramètres généraux, taille, lecture automatique, animation de la couche, optimisation, et d’autres paramètres avancés.
La deuxième section vous permet de contrôler les éléments de l’interface utilisateur créés par le slider. Les flèches, des bulles, le contrôle de la lecture automatique, les vignettes, les ombres et plus encore.
Configuration de diapositives
La plupart de votre temps sera consacré dans l’éditeur de diapositives pour l’assemblage de votre diapositive. Alors que Slider Smart est responsive son interface s’adapte aux résolutions élevées. Vos couches seront listées sur la gauche.
Passez la souris sur un calque pour le voir mis en évidence dans la zone de prévisualisation. Cliquez sur une couche pour faire apparaître les détails dans le tableau ci-dessous où vous serez en mesure de modifier les détails de ce dernier, des animations (version premium) et les paramètres de la couche.
Vous pouvez utiliser l’éditeur visuel pour repositionner la couche par « glisser-déposer ». Vous pouvez obtenir le même résultat en utilisant les options de positionnement dans l’onglet de la couche. Un autre petit détail: Défaire une action avec cmd + z fonctionne très bien.
En cliquant sur un élément va l’ajouter à la liste de la couche et la prévisualisation. Commencez le montage immédiatement et vous verrez tout en temps réel dans l’aperçu. Chaque élément a un tas d’options que vous pouvez modifier. C’est un autre domaine où Slider Smart excelle. Jetez un œil aux paramètres de police pour un élément:
Non seulement vous pouvez définir les couleurs, les hauteurs des lignes, l’espacement et d’autres éléments, vous pouvez prévisualiser, ajouter un CSS supplémentaire et choisir parmi les préréglages sur la droite. Vous pouvez même enregistrer vos paramètres en tant que nouveau paramètre prédéfini, ce qui permettra de minimiser le temps que vous avez besoin de passer sur vos éléments.
Au-dessus de la zone de prévisualisation, vous pouvez trouver les paramètres de la diapositive elle-même. Un nom, une description et un lien, en plus du fond, de l’animation et d’autres options.
Animation des couches
La version pro vous donne des options d’animations avancées pour créer du mouvement sur vos couches. Le résultat est le mieux affiché sur une page d’accueil.
Lors de la création des animations, vous pouvez définir des animations « in/out/loop » et gérer des événements comme clic, lorsque la souris entrer, lorsque la souris sort et plus encore. Vous pouvez placer vos animations sur une frise chronologique qui prend en charge le « glisser-déposer ».
Cela transforme essentiellement Slider Smart en quelque chose de similaire à un éditeur vidéo. Le processus est essentiellement le même, vous placez des événements sur une frise chronologique qui vous indique quand un événement démarre, le temps qu’il faut et quand il se termine.
Une fois cela fait, chaque slider pourra être affiché à l’aide d’un shortcode, en utilisant l’icône Slider Smart dans l’éditeur d’article ou en utilisant le code PHP.
Résumé :
Slider Smart représente ce que tous les plugins du même genre doivent proposer, et ce à quoi chaque doivent aspirer. Vous pouvez vous faire un avis un téléchargeant la version gratuite.
Bonsoir je viens de tester mais sur mobile cela ne marche pas j’airai aimer que sur smartphone il n’y ai pas de slider juste les photos a scroler , comment faire merci beaucoup 🙂
Super tutoriel ! je l’ai suivi à la lettre !!!
Un seul détail que je n’arrive pas à corriger : il y a beaucoup d’espace entre mon texte d’intro et le slider … si vous avez une idée, je suis preneuse !
Bonne continuation !
Bonjour,
J’aime beaucoup de pluggin, il est parfait pour ce que je dois en faire, sauf à un détail pret. Je mets le même slider sur plusieurs fenetre. Quand je clique sur une des photos du slider, cela m’amene à une autre page contenant le même slider. Ce qui me gène, c’est que je ne peux pas choisir l’image qui doit apparaitre en premier sur le slider, il revient automatiquement à la première image du slider. Est il possible de choisir l’image à mettre en avant selon la page? Mon but est de présenter plusieurs produits. Quand je clique sur l’image du produit dans le slider, il y a les informations en dessous, mais comme la page se recharge pour cela, c’est la premiere image du slider qui apparait, et non pas celle du produit concerné.
Bonjour,
Merci pour ces explications très claires.
Je me suis lancée pour réaliser un slider et le mettre dans mon thème Divi.
J’ai mis du texte sur le slider. J’ai donc prévu une typo + petite en fonction des utilisations prévues (mobile, tablette). Malheureusement ces ajustements ne sont pas pris en compte lorsque j’importe mon slider dans Divi, qui intègre la typo version desktop.
Savez-vous comment y remédier?
Merci 🙂
Bonjour Véronique,
Utilisez-vous Layer Slider ?
Hi Blair,
thanks you for your great article to introduce Smart Slider 3 for French WordPress users. Keep up the good work! (I have red it with Google translate.)
Few weeks ago, we just released Smart Slider 3.1, you could check how the new UI looks like: http://nextendweb.com/smart-slider-3-1-supernova/
Hi,
you’re welcome. and thank you for submitting that update. I’ll be reviewing that and make a tutorial update accordingly.