~ Sur le blog ~

SiteOrigin Page Builder : conception de sites Web par glisser-déposer avec des modules premium

SiteOrigin Page Builder pour WordPress simplifie la conception en utilisant des outils intuitifs de glisser-déposer, des modules premium et des fonctionnalités avancées pour créer des sites web dynamiques.

Titre: SiteOrigin Page Builder : conception de sites Web par glisser-déposer avec des modules premium

Table des matières

Bonjour lecteurs, bienvenue pour une nouvelle entrée dans notre Créateurs de pages et thèmes série de blogs ! Aujourd'hui, nous explorons SiteOrigin Page Builder, l'un des outils originaux qui ont contribué à façonner le paysage du glisser-déposer pour la conception de sites Web WordPress.

Je jouais avec HTML 4.0 en 1996, alors croyez-moi quand je dis que créer un site Web visuellement époustouflant et fonctionnel n'a jamais été aussi simple. Fini les paradigmes labyrinthiques des tableaux sans fin, remplacés par des div sans fin ? Je me souviens avec tendresse de l'époque des « td » ceci, des « tr » cela et des documents tape-à-l'œil, comme des machines à sous, que nous appelions sites Web. Bing, bing, tout le monde.

Grâce à des outils comme SiteOrigin Page Builder, fermement ancré parmi les pionniers qui ont introduit le modèle glisser-déposer dans WordPress, nous disposons d'un pool toujours croissant d'instruments de qualité qui rendent la conception Web accessible à tous.

Dans notre agence, nous nous appuyions largement sur ce puissant générateur de pages pour concevoir des sites Web dynamiques pour nos clients, dont certains sont encore maintenus aujourd'hui. Bien que l'interface puisse paraître complexe à première vue, que vous soyez un développeur novice ou chevronné, SiteOrigin Page Builder offre une plate-forme polyvalente pour créer des expériences numériques uniques et attrayantes. Et, grâce à sa longévité, il existe également une multitude de thèmes prédéfinis de différents studios, vous offrant de nombreuses options pour l'apparence, la convivialité et les fonctionnalités de votre site.

Dans cet article, nous examinerons SiteOrigin Page Builder, explorerons les avantages de ses modules complémentaires premium et partagerons des exemples concrets de la façon dont ces outils ont transformé nos projets. Commençons !

Remarque:Pour ceux dont la vision est davantage orientée vers le commerce de produits, envisagez de déployer la populaire extension Studiocart pour une approche moderne des ventes axées sur les services. avec WordPress.

Présentation du générateur de pages SiteOrigin

SiteOrigin Page Builder est une offre mature qui se distingue comme l'un des premiers outils WordPress intuitifs pour la création de mises en page personnalisées. Son interface simple par glisser-déposer permet aux utilisateurs de concevoir des pages efficacement. Grâce à un forum d'assistance performant, les utilisateurs peuvent s'adapter rapidement et résoudre les problèmes avec une relative facilité. De plus, le constructeur reste accessible aux débutants tout en offrant une grande flexibilité de configuration aux développeurs, grâce à un équivalent adaptable adapté à un large éventail de cas d'utilisation.

Nous formions auparavant des clients peu expérimentés en codage à cet utilitaire. Je n'arrive pas à imaginer le nombre d'heures que j'ai passées à leur montrer comment modifier les polices, ajouter un widget spécifique ou diviser une ligne en X colonnes. C'était génial. Tout cela pour dire que le générateur de base, associé à la riche bibliothèque de widgets de SiteOrigin, offre une grande flexibilité pour la conception de sites web modernes.

Par exemple, pour créer un blog interne sous-domaine pour un client, nous avons fait appel à SiteOrigin Page Builder afin de créer un centre de ressources alliant fonctionnalité et esthétique. Le client accordait une grande importance à l'apparence et avait des exigences linguistiques spécifiques. C'est pourquoi, en fonction de ses préférences, nous avons opté pour le thème Readable (créé par l'équipe de Proteus Themes) créé avec SiteOrigin Builder. J'avais ce thème en tête car je savais que le constructeur de pages était entièrement compatible avec WPML, et la mise en page en lignes et l'architecture post-modèle nous ont permis de gagner du temps dès le départ (si cela vous intéresse, le thème est mature, mais mérite tout de même d'être étudié). En intégrant minutieusement la catégorisation des produits, les éléments interactifs et une navigation fluide, nous avons fourni une solution qui a amélioré la communication interne et le partage des ressources du client.


Avantages de l'utilisation des modules premium

Attention, nous n'avons utilisé que SiteOrigin Premium. C'est pourquoi la mise à niveau vers SiteOrigin Premium vous permet d'accéder à des fonctionnalités avancées qui optimiseront le design de votre site web. Vous aurez accès à :

  • Outils de conception améliorés : Ajoutez de la profondeur à vos mises en page avec des animations, une navigation avancée et des éléments interactifs.
  • Mises à jour en cours : Gardez une longueur d'avance grâce à des déploiements réguliers de fonctionnalités et à des corrections de bugs, garantissant que votre site reste à la pointe de la technologie.
  • Assistance prioritaire : Relevez les défis en toute simplicité grâce à un support client réactif.

Le package premium améliore les choses en donnant aux utilisateurs l'accès à tous les modules complémentaires actuels et futurs, permettant aux développeurs de créer des expériences utilisateur extraordinaires.

Adjrien Goddard

Adjrien Goddard

Directeur

Profil LinkedIn de Softworks Interactive

Image vedette d'un article de blog | Deux personnes travaillent à une table avec des ordinateurs portables et écrivent sur du papier.
Blog Post Sidebar Nav

Sous le capot

Modules Premium de SiteOrigin : applications concrètes

Voici un aperçu plus détaillé de certains des modules complémentaires premium les plus remarquables et de la manière dont ils ont amélioré notre/nos projet(s) :

Générateur de type de publication personnalisé

Cette fonctionnalité vous permet de créer et de gérer des types de publication uniques sans effort. Pour le blog interne de notre client, nous avons adapté les types de publication en fonction de leurs produits, garantissant ainsi à leurs employés un accès rapide au contenu pertinent.

Widget d'accordéon

Nous avons utilisé le widget Accordion pour organiser les détails du produit en sections réductibles. Cette approche a permis de minimiser l'encombrement visuel tout en offrant un accès facile aux informations essentielles.

ID d'ancrage

La fonction Anchor ID simplifie la création de liens vers des sections spécifiques d'une page, rendant la navigation plus intuitive. Par exemple, lors du déploiement de longues pages de description de produit pour nos clients, nous avons souvent utilisé les éléments « onglets » ou « accordéon » pour améliorer la digestibilité. Pensez à la façon dont des sites comme Amazon ou Samsung organisent les pages de produits avec des onglets tels que « Informations sur le produit », « Installation », « Pilotes », etc.


Les identifiants d'ancrage nous ont permis de guider les utilisateurs directement vers le contenu le plus pertinent dans ces sections. À propos, la « liaison par identifiant » est une fonctionnalité HTML inhérente que les développeurs utilisent pour créer des liens vers des éléments spécifiques d'une page. SiteOrigin apporte cette fonctionnalité au front-end de l'éditeur, la rendant ainsi accessible à tous.


Animations de blocs

Les animations ont apporté une touche dynamique au(x) site(s) web de notre client. Vous bénéficierez de toutes les animations standard, des rebonds aux pulsations en passant par les fondus. Il suffit de cliquer sur une ligne et d'activer l'option « Animations » à droite (et de lancer le processus). Des transitions judicieusement placées entre les sections rendent la navigation plus attrayante et marquent durablement les utilisateurs.

Coffret Auteur

Étant donné notre cas d'utilisation de blog interne, ce module complémentaire a personnalisé les articles de blog (descriptions détaillées des produits) en affichant de manière visible les auteurs, leurs profils d'entreprise et les articles récents. Il a ajouté de la crédibilité et renforcé le lien entre le contenu et son public. De plus, il a permis aux employés et aux invités de reconnaître plus facilement les principales parties prenantes et les autorités en la matière au sein de l'entreprise.

Écran d'ordinateur affichant des lignes de code colorées dans un éditeur de texte avec surlignage de la syntaxe, montrant des éléments HTML et PHP.

Le saviez-vous ? Le pack de widgets de SiteOrigin ne se limite pas au générateur de pages uniquement.

C'est vrai, le Widget Bundle de SiteOrigin est compatible avec n'importe quel thème WordPress. Cela signifie que vous pouvez déployer des widgets SiteOrigin sur site à l'aide de l'éditeur de blocs, de la zone de widgets de votre site ou même avec d'autres créateurs de pages. Cette flexibilité permet aux utilisateurs d'ajouter des widgets tels que des curseurs, des accordéons et des formulaires de contact sans avoir recours à des outils de création de pages spécifiques. C'est une véritable révolution pour les propriétaires de sites et les développeurs qui souhaitent améliorer les fonctionnalités sans s'engager dans un seul écosystème de créateurs.

Remarque:J'espère qu'avant de commencer à modifier votre WordPress (plus loin), vous prenez un moment pour découvrir comment l'utilisation d'un thème enfant peut protéger les personnalisations fait sur votre site Web.

Fonctionnalités améliorées pour la conception de sites Web

Superposition d'images

Le texte interactif au survol des images donne vie aux galeries et aux portfolios. Pour une présentation optimale des produits, nous avons utilisé cette fonctionnalité pour afficher les détails au survol, créant ainsi une expérience de navigation immersive lors de la consultation des descriptions de produits.

Curseurs de parallaxe

Nous avons déployé des curseurs de parallaxe pour créer de la profondeur et du mouvement dans les sections principales. Ces effets subtils mais percutants ont captivé les visiteurs. Grâce à des transitions comme les fondus et les rebonds, nous avons guidé les utilisateurs à travers la mise en page de manière fluide, sans surcharger l'expérience.


C'est assez drôle, la section d'introduction de cet article utilise la parallaxe. Une vieille habitude, j'imagine.


Widgets sociaux

Pour notre blog interne, nous n'avons pas utilisé les widgets sociaux SiteOrigin. Cependant, nous les avons déployés sur d'autres sites clients, connectant ainsi directement les utilisateurs à leurs plateformes de médias sociaux. En peaufinant le design et l'emplacement des boutons sur le site, les utilisateurs peuvent optimiser l'engagement pour générer des interactions pertinentes et obtenir les résultats souhaités. Configurer ces liens sociaux personnalisés est un jeu d'enfant : il suffit de cliquer sur « Modifier », d'activer les réseaux personnalisés, de saisir le nom et l'URL, et de choisir l'icône. En quelques clics, vous obtiendrez un nouveau lien vers votre profil Facebook, LinkedIn (etc.).

Contexte vidéo

Un bon arrière-plan vidéo peut instantanément rehausser l'esthétique d'un site. Cependant, il convient de préciser que vous devez choisir vos moments. Nous avons utilisé des vidéos d'arrière-plan dans une mise en page à deux colonnes en haut des sections de produits du blog. Il s'agissait d'un choix de conception subtil pour aider à distinguer les catégories des articles/pages. Nous avons ensuite superposé du texte pour une présentation visuellement riche et informative.

Articles Similaires

En affichant des articles connexes à la fin de chaque publication, nous avons tenu les utilisateurs informés du contenu associé et les avons encouragés à explorer le site en profondeur. Bien que l'affichage des types d'articles connexes ne soit pas une exclusivité de SiteOrigin, ce module complémentaire simplifie considérablement l'affichage de contenu associé sur toutes les pages, avec un minimum de configuration.


Fonctionnalités et outils avancés

Copier-coller entre domaines

Cette fonctionnalité a rationalisé notre flux de travail, nous permettant de répliquer des mises en page complexes issues de la préparation et des tests A/B sur plusieurs domaines. Il existe deux méthodes pour y parvenir. La première est la méthode « Presse-papiers du navigateur » et la seconde est la méthode « Stockage du navigateur ». Nous n'avons utilisé que la méthode « Presse-papiers du navigateur », qui a toujours bien fonctionné pour nos besoins. Pour toute personne travaillant sur plusieurs domaines ou projets multisites, cette méthode rapide de copier/coller change la donne.

Widget d'appel à l'action

Des boutons placés de manière stratégique ont incité les utilisateurs à effectuer des actions, comme explorer des catégories de produits ou télécharger des ressources. La personnalisation de ces boutons a stimulé les conversions et l'engagement. Chaque créateur de pages a son propre penchant pour les CTA, et j'ai eu l'impression que cette fonctionnalité était complète et répondait à nos besoins. Pour la postérité, je soulignerai que nous avons utilisé assez fréquemment les effets de survol et le JavaScript Onclick pour nos besoins.

Contexte de la page

Les arrière-plans personnalisés nous ont aidés à maintenir une image de marque cohérente sur tous les secteurs du site de blogs interne, améliorant ainsi l'attrait visuel global. À cet égard, SiteOrigin avait quelques atouts dans sa manche. Cette fonctionnalité offre la possibilité de définir des arrière-plans pour des pages spécifiques et à l'échelle mondiale. Cela signifie que nous pouvions afficher un arrière-plan de page global et le modifier pour certaines pages, différenciant ainsi davantage les zones du site.

Témoignages

Il convient de préciser que nous n'avons pas utilisé cette fonctionnalité pour notre blog interne. Cependant, nous avons utilisé l'extension Témoignages pour d'autres projets. La possibilité de présenter les commentaires clients avec des mises en page et des polices personnalisées renforce systématiquement la confiance et la crédibilité, faisant des témoignages un élément essentiel de nombreux sites. Bien qu'applicables en situation, ces sections humanisent les marques en mettant en avant leurs voix les plus authentiques, une approche particulièrement efficace dans les secteurs des services.

Activer/désactiver la visibilité

L'accès au site de blogs internes a été conçu selon une approche hiérarchisée. Plus précisément, il y avait deux groupes d'utilisateurs principaux avec différents rôles personnalisés allant de l'invité à l'administrateur. Cette fonctionnalité nous a permis de contrôler l'accès au contenu en fonction de ces rôles d'utilisateur. Nous avons créé des sections exclusives pour les employés, en adaptant efficacement l'expérience utilisateur tout en conservant les fonctionnalités de base pour les invités.


Gros plan d'un tableau de bord de voiture montrant un bouton de démarrage/arrêt du moteur éclairé et trois cadrans de ventilation ou de commande.

Conçu pour le succès, SiteOrigin Page Builder simplifie la conception de WordPress grâce à son interface intuitive par glisser-déposer. En démystifiant les tâches complexes telles que la personnalisation de la mise en page, l'intégration de widgets et l'accessibilité du contenu, il permet aux utilisateurs de créer des sites Web professionnels et visuellement attrayants, adaptés à leurs besoins uniques.

Assistance et mises à jour de SiteOrigin Premium

Accès à tous les modules

Comme indiqué ci-dessus, SiteOrigin Premium propose une suite complète d'outils vous permettant de créer des sites Web sur mesure. Cette flexibilité est inestimable pour les propriétaires de sites Web et les agences travaillant sur des projets divers.

Mises à jour en cours

Des mises à jour régulières garantissent que votre site Web reste fonctionnel et pertinent. Par exemple, les nouvelles options de mise en page introduites grâce aux mises à jour nous ont permis de maintenir les sites des clients à jour avec l'évolution des tendances en matière de conception sans effort.

Pack de widgets supplémentaires

Personnaliser des formulaires, des widgets sociaux et des éléments interactifs n'a jamais été aussi simple. Ces extras ajoutent de la profondeur aux fonctionnalités de n'importe quel site et ont été au cœur des commentaires pour notre projet de blogging.


Améliorations du thème

Les améliorations du thème Premium permettent un meilleur contrôle de la conception, contribuant ainsi à fournir des sites Web professionnels et soignés qui correspondent à votre image de marque.

Options de tarification et d'abonnement

Le modèle tarifaire de SiteOrigin Premium est flexible et accessible, offrant des options pour les particuliers, les entreprises et les agences :

  • Licence de site unique : Idéal pour les projets individuels, offrant un accès complet aux fonctionnalités à un coût raisonnable.
  • Licence commerciale : Idéal pour gérer jusqu'à cinq sites différents, cette option Premium est idéale pour les petites entreprises.
  • Licence de développeur : L'utilisation illimitée du site en fait le choix incontournable pour les agences gérant plusieurs clients.


Chaque abonnement garantit l'accès à des outils premium, des mises à jour continues et un support exceptionnel, ce qui en fait un investissement rentable.

Problèmes connus avec SiteOrigin Page Builder

Défis courants et comment les relever

Bien que SiteOrigin Page Builder soit un outil fiable et largement utilisé, les utilisateurs rencontrent parfois des problèmes techniques, souvent liés à la compatibilité des plugins, aux conflits de cache et aux widgets manquants. Les méthodes de dépannage suivantes permettent de résoudre ces problèmes.

Problèmes courants et correctifs :
  • Problèmes de compatibilité des plugins – Certains utilisateurs ont signalé des conflits entre des plugins et le Page Builder, notamment après les mises à jour de WordPress. Si certaines fonctionnalités sont défaillantes ou si des widgets cessent de fonctionner, tester en mode sans échec ou désactiver temporairement les plugins en conflit peut aider à identifier les problèmes.
  • Interférence de mise en cache – Les plugins de mise en cache tels que LiteSpeed ​​Cache sont connus pour provoquer des problèmes d'affichage, notamment avec les médias intégrés comme les vidéos. Vider le cache ou ajuster les paramètres de mise en cache résout généralement ces problèmes.
  • Widgets disparaissants – Il arrive que les utilisateurs remarquent que certains widgets disparaissent après la désactivation d'un thème qui les incluait. Vérifier les paramètres des widgets SiteOrigin et réactiver les composants manquants ou annuler les modifications peut restaurer les fonctionnalités.

Malgré ces défis mineurs, SiteOrigin Page Builder reste un outil puissant et adaptable, continuellement affiné grâce aux mises à jour et au soutien de la communauté.

Comme pour tout constructeur, la patience et la maîtrise du métier sont essentielles à l'élaboration d'un flux de travail efficace. Maintenant que les nuances ont été explorées et que certains obstacles courants ont été identifiés, il est temps de se concentrer sur l'essentiel.

Conclusion

Et Grapevine avec un Stomp

SiteOrigin Page Builder continue d'offrir aux utilisateurs une base fiable pour la création de sites WordPress, qu'il s'agisse de créer un simple blog ou d'assembler un intranet complexe et polyvalent. Son interface glisser-déposer répond aux problématiques de mise en page courantes, et les extensions premium introduisent des fonctionnalités adaptables progressivement à l'évolution des besoins. Avant de conclure, revenons sur les principaux points à retenir de cet article :

  • Facilité d'utilisation de Core Builder
  • Une interface intuitive et facile à maîtriser qui convient aussi bien aux nouveaux arrivants qu'aux développeurs expérimentés.
  • Un support communautaire et une documentation robustes pour aplatir la courbe d'apprentissage.
  • Les modules complémentaires premium étendent les capacités
  • Générateur de types de publication personnalisés pour personnaliser les structures de contenu.
  • Widgets d'identification d'accordéon et d'ancre pour améliorer l'organisation du contenu et la navigation.
  • Animations de blocs et curseurs de parallaxe pour un mouvement subtil sans codage supplémentaire.
  • Zone d'auteur et bascule de visibilité pour ajouter du contexte et contrôler l'accès en fonction des rôles des utilisateurs.
  • Flexibilité inter-projets
  • Compatibilité des widgets Bundle entre les thèmes et autres créateurs de pages.
  • Widgets sociaux, arrière-plans vidéo et publications associées pour enrichir l'engagement et la découverte de contenu.
  • Copier et coller entre domaines pour répliquer les dispositions entre les environnements.
  • Assistance et maintenance continues
  • Mises à jour régulières pour suivre le rythme des changements de base de WordPress.
  • Assistance prioritaire et bibliothèque croissante de modules complémentaires sous un seul abonnement Premium.

En gardant ces points à l’esprit, vous pouvez adapter SiteOrigin Page Builder à la portée de votre projet, qu’il s’agisse d’un site de produits destiné aux clients, d’un centre de ressources interne ou de tout autre élément intermédiaire.

Compte tenu de notre cas d'utilisation, nous avons choisi de ne pas utiliser le générateur de modèles WooCommerce, car nous n'avions pas besoin d'une structure e-commerce. La modification des types de publication existants nous a permis de présenter plus directement des descriptions de produits détaillées. La conception modulaire de SiteOrigin nous a permis d'activer ou de désactiver des fonctionnalités sans perturber la mise en page sous-jacente.

Si vous évaluez des outils de création de pages pour votre prochain projet WordPress, réfléchissez à la manière dont la combinaison de l'outil de base de SiteOrigin et de ses extensions premium répond à vos objectifs. Pourquoi ne pas télécharger dès aujourd'hui une version d'essai de SiteOrigin Premium, tester les widgets adaptés à votre flux de travail et découvrir comment une approche progressive peut vous aider à créeret à maintenir vos sites plus efficacement ?

RESTEZ À L'ÉCOUTE DE NOS DERNIÈRES PUBLICATIONS

Vous avez aimé la lecture ? Abonnez-vous et recevez une notification dès la parution des articles

Merci d'avoir pris le temps de lire jusqu'ici. Si vous avez apprécié nos manigances jusqu'ici, pourquoi ne pas vous abonner pour être averti lorsque notre prochain article sera publié ?

Attention ! En vous abonnant, vous acceptez d'être averti par e-mail de la publication d'un nouvel article. Dans le cadre de nos activités, nos envois peuvent inclure des offres de tiers. Pour plus d'informations, n'hésitez pas à consulter notre Politique de confidentialité.

~ Plus sur le blog ~


Image vedette de l'article de blog


Découvrez comment les déclencheurs de vente, les configurations de paiement flexibles et les pages de marque de Studiocart vous aident à créer des processus de paiement WordPress transparents pour de meilleures conversions.

Image vedette de l'article de blog


Découvrez certaines des meilleures plateformes d'images gratuites et apprenez à ajouter des visuels directement sur WordPress avec le plugin Instant Images.

Image vedette de l'article de blog


Le balisage schema aide les moteurs de recherche à interpréter votre contenu, améliorant ainsi la visibilité grâce aux extraits enrichis et favorisant l'engagement pour une meilleure interaction utilisateur.

Image vedette de l'article de blog


Découvrez comment les déclencheurs de vente, les configurations de paiement flexibles et les pages de marque de Studiocart vous aident à créer des processus de paiement WordPress transparents pour de meilleures conversions.

Image vedette de l'article de blog


Découvrez certaines des meilleures plateformes d'images gratuites et apprenez à ajouter des visuels directement sur WordPress avec le plugin Instant Images.


Clause de non-responsabilité:

Le contenu de ce site Web est fourni à titre informatif uniquement et reflète des opinions personnelles basées sur l'expérience. Il ne constitue pas un conseil professionnel et nous ne garantissons pas les résultats spécifiques de l'utilisation des outils ou des stratégies présentés. Bien que nous nous efforcions d'être précis dans nos écrits, les lecteurs doivent comprendre que ces articles représentent un instantané dans le temps : les extensions sont mis à jour, les outils évoluent et les fonctionnalités peuvent changer. Nous encourageons les lecteurs à vérifier les informations de manière indépendante avant leur mise en œuvre.


Veuillez noter:

Notre politique est d'éviter d'afficher des publicités d'affiliation sur les pages publiques de ce site web. Cependant, des publicités d'affiliation et des offres spéciales de nos partenaires peuvent être disponibles sur des pages dédiées du portail client. Bien que certains liens vers ces sites puissent générer des commissions, cela n'influence en rien notre contenu ni nos recommandations. Notre objectif est de partager notre expertise WordPress acquise au fil des années, sans affiliations externes.


Si vous remarquez un contenu qui nécessite une mise à jour, veuillez nous en informer et nous réglerons le problème rapidement. Pour plus de détails, veuillez consulter notre conditions d'utilisation.

SOFTWORKS INTERACTIVE

TOUS DROITS RÉSERVÉS