18 Avr 2023
Creative Element version 2.9 des nouveautés pour votre Prestashop

Creative Element 2.9.14, créez un site Prestashop encore plus facilement

Creative Element sur Prestashop a sorti une nouvelle version de son module fin mars 2023 qui implémente pas moins d’une centaine de nouveautés, de correction de bug et d’amélioration. Je vous liste ici les points les plus importants qui vont changer son utilisation.

Découvrez la mise à jour en vidéo

Ci-dessous une vidéo Youtube sur la mise à jour du module. Vous avez donc accès à la version dans cet article ou vous pouvez regarder ma vidéo qui comporte des chapitres pour regarder un élément précis de la mise à jour du module.

Je vais lister dans cet article les nouveautés qui me semblent très importantes dans l’utilisation du module et qui vont vous aider à construire un site Prestashop avec ce builder basé sur Elementor. Si vous voulez voir toutes les nouveautés, je vous invite à lire le changelog du module.

Creative Element, le meilleur builder sur Prestashop

Si vous ne connaissez pas Creative Element, c’est un constructeur de page qui a été développé sur une base d’Elementor, comme sur WordPress. Si vous êtes déjà utilisateur de ce builder sur ce cms, vous ne serez pas dépaysé en utilisant le module Prestashop.

Creative Element a été le module le plus vendu de la plateforme Prestashop Addons en 2022 et si je ne me trompe pas, en 2021 aussi. Aujourd’hui, il comptabilise pas moins de 22 500 téléchargements et 300 avis positifs. Il est devenu un module incontournable.

Si vous souhaitez en savoir plus sur ce module, je vous conseille d’aller voir ma page et formation à ce sujet : Construisez seul et sans coder votre Prestashop avec le module Creative Element

Compatibilité avec Prestashop 8 et PHP 8.1

Le module est désormais compatible avec la dernière version de Prestashop, la version 8, ainsi qu’avec PHP 8 et 8.1. Cela permettra aux utilisateurs de l’utiliser sans problème lors de la sortie officielle de Prestashop 8.

Introduction du Dark mode dans Creative Element

La grande nouveauté de cette mise à jour est l’introduction du mode sombre pour le back office de Creative Elements. Cette option permet de travailler plus confortablement, surtout pour les utilisateurs qui préfèrent le mode sombre. L’interface a également été repensée pour plus d’ergonomie.

Personnellement, j’utilise beaucoup ce mode, déjà aujourd’hui sur chrome. Grâce à la nouvelle fonctionnalité, vous pouvez faire votre choix facilement pour travailler comme vous le souhaitez.

Activer le mode sombre dans creative element
Dans les préférences du module on peut choisir le mode sombre ou clair

Mise à jour du module Prestashop en un clic

Facile à mettre à jour, même si vous avez une ancienne version de Creative Elements, vous pouvez facilement aller vers la dernière version sans risque de perdre vos données grâce à la compatibilité de la version 2.9.14 avec les anciennes versions.

Conseil, même si la mise à jour est facile, il est toujours conseillé de faire une sauvegarde de votre site avant de la lancer, par sécurité.

Fontawesome 6, des nouvelles icônes pour votre boutique Prestashop

Fontawesome passe de la version 4 à la version 6, et Creative Element a ajouté une option pour désactiver la version 6 en cas de conflits avec d’autres modules ou thèmes. C’est important, si un autre module non natif sur votre boutique utilise une vieille version de Fontawesome, cela peut créer des conflits.

Chargez des icônes personnalisées

Une nouvelle fonctionnalité permet également l’importation d’icônes personnalisées à partir de bibliothèques telles que Fontello, IcoMoon ou Fontastic. Ce qui permet de changer l’apparence des icônes utilisées sur le site.

C’est au même endroit que dans les réglages des polices, vous pouvez importer un zip d’icône qui va être intégrer dans Creative Element.

Une formation Prestashop pour créer sa boutique seul

Un widget breadcrumb (fil d’ariane)

Le module Creative Elements propose maintenant un widget fil d’Ariane de votre site PrestaShop. Il peut-être maintenant être personnalisé entièrement. Les utilisateurs peuvent placer et modifier le widget comme ils le souhaitent, ce qui peut contribuer à améliorer la navigation sur le site. Cependant, pour éviter de charger deux fois le fil d’Ariane dans une page, il est recommandé de le masquer dans les réglages de la page. Une option que j’ai proposée aux développeurs.

Cependant, quand on crée une page on peut utiliser un modèle vierge ou tout construire soit même. Le fil d’ariane peut-être personnalisé aussi depuis la nouvelle interface style guide.

Ajouter des diaporamas à vos sections et colonnes

L’option arrière plan en diaporama permet d’ajouter un défilement d’image de fond à vos sections et colonnes. Cela signifie que vous pouvez mettre en avant du texte, des images, ou même des montages d’image et de les superposer sur un diaporama pour créer un effet visuel dynamique. Avant l’arrivée de ce widget, il était souvent nécessaire d’utiliser le widget carrousel sans trop de personnalisations de contenu. Avec l’option diaporama, cela devient beaucoup plus simple et rapide.

L’option offre une grande flexibilité en termes de personnalisation. Vous pouvez choisir le nombre d’images à afficher, la vitesse de transition entre les diapositives, la taille et la position du background, ainsi que la vitesse de slide. Il est également possible d’ajouter des animations pour donner encore plus de dynamisme à votre diaporama.

diaporama background creative element
Les options du diaporama de fond

Le style guide, personnalisez votre thème Classic Prestashop sans coder

Le style guide permet de personnaliser l’apparence de tout le thème. Cette fonctionnalité est une révolution et elle permet aussi de faire du CSS personnalisé pour tout le thème, sans devoir le faire page par page. Je recommande d’utiliser le thème par défaut Classic pour une meilleure compatibilité, mais il est possible de tester sur un thème premium.

Le style guide se crée depuis la partie “constructeur de thème“, en faisant un nouveau modèle qui va s’appliquer à votre boutique Prestashop. Voici une liste des éléments que vous pouvez éditer :

  • Les couleurs et qu’elles soient pré-cliquable dans le nouveau color picker
  • Les typographies et chaque balise HTML, h1, h2, h3 tc.
  • Les boutons affichez dans le thème et ceux qu’on va utiliser dans Creative Element
  • Les images du site
  • Le fil d’ariane
  • Le style d’une page, largeur du contenu, couleur de fond etc.
  • La taille du texte dans le corps d’une page et la couleur des liens
  • Le style des icônes par defaut (tailles, couleurs…)
  • Le champ des formulaires.
  • etc.

Et pour chaque élément, vous allez avoir plusieurs réglages de style comme par exemple pour les boutons, gérer le survol avec la souris dessus.

Vous avez ma vidéo Youtube en haut de page pour voir en détail le rendu de ces options.

Modèles de style guide creative element
Exemple de modèles de style guide sur Creative Element

Quelques bugs à corriger et des nouveautés à découvrir

Forcément avec autant de nouveautés, j’ai pu constater quelques petits problèmes, qui n’empêchent pas l’utilisation du module. Le style guide ne permet pas encore de modifier les tabs ou les prix en promotion par exemple. Mais cela se corrige si vous utilisez votre propre modèle de fiche produit donc un problème minime.

Dans le changelog du module, vous avez la liste de toutes les modifications. Il y a  beaucoup de choses que je n’ai pas citées dans l’article et que je vous laisse découvrir.

 

Apprenez à maîtriser Creative Element avec + de 7 heures de vidéos !

– Formation en ligne créé en 2020
– Paiement une fois et accessible à vie
– 4 modèles pour votre page d’accueil offerte
– Mise à jour en fonction des nouveautés

Vous pouvez commander directement par mon site internet !