PageFly est un Page Builder (constructeur de page) qui permet de créer des pages sur mesure. C’est un outil flexible qui donne beaucoup de possibilité de personnalisations.
L’argument de vente PageFly est de vous dire que vous pourrez construire votre site e-commerce facilement et en quelques jours. C’est vrai mais ça demande quand même une certaine maîtrise de l’outil et des notions en codage.
La flexibilité de PageFly est assez bonne et donne beaucoup possibilité de personnalisations. Vous pouvez facilement agencer les sections, colonnes et blocs de votre page. De plus, il est très facile d’ajouter du contenu (titres, images…).
Prérequis PageFly
Il est bien d’avoir quelques notions en CSS pour pouvoir utiliser efficacement PageFly, notamment sur les notions de responsive design si vous souhaitez que votre site soit adapté à tous les écrans (ordinateur, tablette et mobiles).
Construisez toutes les pages d’un site e-commerce:
Avec PageFly vous pourrez créer toutes les pages de votre site: page d’accueil, page produit, page catégorie, page contact, page FAQ, page de blog….
Templates PageFly
PageFly dispose d’une liste de templates très pratiques qui vous permettront de vous donner des idées et de vous faire gagner du temps!
Fonctionnement de PageFly
Sélection d’un élément
Quand vous sélectionnez un élément, vous avez accès à différentes options:
- Déplacer l’élément
- Le dupliquer
- Le supprimer
- Copier le style si vous voulez intégrer les paramètres de cet élément sur un autre
- Coller le style d’un élément que vous avez copié.
- Si vous sélectionnez une section, vous aurez en plus la possibilité de la sauvegarder pour la réutiliser ailleurs. En revanche, le point faible est que si vous faites des modifications d’une section sauvegardée, elles ne seront pas répercutées.
Tout en haut -Barre de menu horizontale
Vous pourrez changer le layout de votre page, voir les différentes vues mobile/tablette/ordinateur, sauvegarder et visualiser votre site.
En haut à gauche – Barre de menu Verticale
Vous pourrez choisir les éléments que vous souhaitez ajouter (sections, blocs, titres, onglets, images, vidéos…), intégrer les élément spécifiques aux produits (image, prix, quantité, variante, ajouter au panier) et catégories, intégrer des applications externes et ajouter les sections que vous avez sauvegardé.
En bas à gauche – Barre de menu Verticale
Vous y trouverez les différentes version du site si vous souhaitez revenir sur ancienne version, naviguer dans les différentes sections du site que vous avez créé (vous pouvez les re-nommer) et ajouter du code CSS et JavaScript.
En haut à gauche – Sections de la page
Vous aurez accès aux différents niveau de vos sections. Très utile quand vous souhaitez sélectionner, changer le style de vos blocs, colonnes, titres….
A droite – Barre verticale
Vous avez les fonctionnalités et le style du bloc. Dans le cas ci-dessous, il s’agit d’une image.
Dans l’onglet « General » vous pourrez:
- Gérer les fonctionnalisés de l’élément. Ici, vous pouvez ajouter une image, mettre un titre/un texte alternatif (si l’image ne s’affiche pas) et changer la taille.
- Mettre en place un « tracker » pour le pixel Facebook et Google Analytics.
- Ajouter une Class et un ID, si vous souhaitez faire une personnalisation CSS ou JS un peu plus poussée.
- Gérer la visibilité de l’élément en fonction du type de support (ordinateur, tablette et mobile).
- Mettre en place des animations.
Dans l’onglet » Styling » vous pourrez gérer la mise en forme de l’élément:
- L’espacement de l’élément : les marges internes (Padding) et marges externes (Margin).
- Les bordures : vous y trouverez différents styles de bordures et dans « more settings », vous pourrez changer l’épaisseur des bordures (px).
- « display style »: c’est un élément important qui demande des notions en code car c’est là que vous pourrez gérer le positionnement de vos éléments et la partie responsive.
- « Custom Css »: vous pourrez ajouter votre code si PageFly est trop limitée.
Les éléments PageFly de Shopify
A gauche dans la barre de menu verticale, vous avez accès à tous les éléments e-commerce de Shopify. Par exemple, si vous créez une fiche produit, vous pourrez choisir quels éléments y intégrer (image, titre, prix, variantes, quantité…). Vous avez aussi la possibilité d’intégrer vos pages les différentes « collections » (catégories) produits que vous avez créé.
Le slider PageFly
Le slider est élément important d’un site internet. C’est pourquoi je souhaitais vous expliquer les avantages et les limites du slider PageFly:
- ll permet de faire des slides assez rapidement et adaptés à tout type d’écran.
- Au niveau du fond (background), vous pouvez y intégrer facilement une image ou changer la couleur.
- Intégrer facilement du contenu (titres et paragraphes) et images. On vous donne aussi la possibilité de gérer la hauteur.
- Gérer la hauteur en pixel.
- Gérer le temps de transition entre chaque slide. En revanche, vous ne pourrez pas gérer la vitesse de transition (à voir dans les prochaines version). Ce point est assez dérangeant car la vitesse de transition est trop rapide. J’ai contacté l’équipe et il y aura peut-être possibilité de la gérer dans les prochaine versions.
- Vous ne pourrez mettre des animations que sur la première Slide. C’est un autre point faible de pageFly. Si vous mettez des animations sur chaque slide, elles s’activeront qu’au chargement de la page (vous ne les verrez donc pas) et non au changement de slide.
PageFly dispose d’une liste de templates très pratiques qui vous permettront de vous donner des idées et de vous faire gagner du temps!
Intégration de PageFly à d’autres applications
Google Analytics, Facebook Pixel, Facebook Ads, Loox – application d’examen de produits, Judge.me, Yotpo….
Référencement naturel de PageFly
En terme de SEO, vous avez la possibilité de choisir les balises de vos titres (h1, h2, h3…) et mettre un titre et texte alternatif pour vos images.
Les Prix de PageFly
La version gratuite est plus que correcte et donne accès à suffisamment de fonctionnalités. Si vous vous prenez la version payante, vous pourrez sauvegarder plus de sections et ajouter plus de pages par type de page (page produit, page catégorie….). Consulter les tarifs.
Service client PageFly
Je les ai contacté pour des questions techniques sur le slider et ils ont été très réactifs.
Documentation PageFly
Il est bien fournie. Vous y trouverez pas mal d’articles détaillés et de vidéos sur l’utilisation de PageFly.
Qualité du code et Performance PageFly
Au niveau du code PageFly est assez propre. Il n’y pas trop de code Superflus comme on peut le retrouver dans d’autres Page Builder comme Elementor.
Si vous cherchez un développeur pour vous créer un site sur-mesure sur PageFly, je peux vous aider dans cette démarche. Je connais aussi très bien Shopify donc je pourrais vous aiguiller sur les différentes solutions et applications à utiliser.
