WPBakery est l'un des principaux constructeurs de pages pour WordPress, utilisé sur plus de 5,8 millions de sites dans le monde. Connu pour ses deux éditeurs glisser-déposer et son intégration généralisée aux thèmes, notamment via des plateformes comme ThemeForest, il est un choix privilégié pour les développeurs, les agences et les propriétaires de sites depuis 2011.
Contrairement à d'autres constructeurs, WPBakery est très apprécié par les utilisateurs non techniques en raison de sa facilité d'utilisation, ce qui permet aux agences et aux développeurs de remettre plus facilement des sites à des clients qui souhaitent mettre à jour le contenu par eux-mêmes.
Dans ce tutoriel, nous allons vous montrer comment sites créés avec WPBakery à l'aide de TranslatePress. WPBakery est entièrement compatible avec TranslatePress, et nous allons vous guider à travers les étapes de base pour traduire n'importe quelle page ou n'importe quel article dans son éditeur frontal à l'aide de TranslatePress.
Créer un site web avec WPBakery Page Builder
En tant que constructeur de pages, WPBakery vous permet de contrôler la zone de contenu des articles, des pages et des types d'articles personnalisés. L'en-tête et le pied de page, cependant, dépendent de votre thème WordPress.
WPBakery n'offre pas de version gratuite, mais vous pouvez essayez-le sur un site de démonstration gratuit. Une licence régulière coûte $69 pour un site, qui comprend des mises à jour gratuites à vie et un an d'abonnement à Support Plus. Vous pouvez renouveler votre abonnement au support chaque année, en bénéficiant de remises pouvant aller jusqu'à 50%. Des formules pour les achats en gros et les sites multiples sont également disponibles.
WPBakery a les deux un éditeur frontal et un éditeur dorsal, qui peuvent être utilisés de manière interchangeable.
L'éditeur backend offre un aperçu détaillé de la structure de la page et est idéal pour retrouver les éléments utilisés. Mais dans ce tutoriel, nous utiliserons l'éditeur frontend, car il nous permet de voir à quoi ressemblera la page en direct lors de sa modification, grâce à son interface visuelle.
Créer notre première page avec WPBakery Page Builder
Vous pouvez acheter une licence WPBakery auprès de site officiel. Ensuite, tu peux installer et l'activer juste comme vous le feriez pour n’importe quel autre plugin.
Ensuite, depuis votre tableau de bord WordPress, allez sur créer une nouvelle page. De là, vous pourrez choisir entre l'éditeur backend et frontend.
Une fois l'éditeur ouvert, vous pourrez sélectionner commencez soit à partir de la mise en page par défaut de votre thème WordPress, soit à partir d'une page vierge. Nous commencerons avec une page blanche.
À partir de là, vous serez invité à commencer par ajouter des éléments ou des modèles à votre page.
Pour accélérer les choses, nous utiliserons l'un des modèles préconçus pleine page disponible dans WPBakery. Vous pouvez accéder à la bibliothèque de modèles depuis l'éditeur en cliquant sur “Modèles” icône dans la barre de navigation. Pour télécharger un modèle, survolez-le simplement et cliquez sur le bouton de téléchargement.
Nous avons sélectionné le modèle “ Business Layout Full Page ”. Chaque élément peut être personnalisé, réarrangé et dupliqué (pas seulement d’une page à l’autre, mais aussi d’un site à l’autre).
Vous pouvez aussi enregistrer certains paramètres d'éléments comme présélections ou enregistrer vos propres mises en page comme modèles pour les réutiliser plus tard. Vous pouvez répéter le même processus avec d'autres pages ou publications sur votre site WordPress.
Si vous débutez avec WPBakery et que vous avez besoin de plus de conseils, nous vous recommandons de regarder le tutoriel complet pour débutants, qui couvre les bases de l'utilisation du constructeur de pages :
Traduire un site WPBakery à l'aide de TranslatePress
Maintenant que nous avons créé un site WordPress à l'aide de WPBakery, rendons-le multilingue grâce à TranslatePress.
Ajouter une deuxième langue à votre site WPBakery
Pour ce tutoriel, nous allons traduire le site que nous avons créé avec WPBakery dans une seconde langue. Optons pour l'espagnol, car c'est la deuxième langue la plus parlée au monde.
D'abord, installer et activer le plugin multilingue TranslatePress.
Après avoir activé le plugin, vous verrez “Traduire le site” dans la barre d'administration de votre WordPress.
Survolez-le et cliquez Paramètres ou cliquez sur TranslatePress sous Paramètres dans votre tableau de bord d'administration WordPress).
Ceci vous mènera à la page TranslatePress Paramètres généraux page. Ici, nous pouvons ajouter la deuxième, voire la troisième et la quatrième langue dans laquelle nous voulons que notre page et notre site construits avec WPBakery soient automatiquement traduits. Pour notre site, l'anglais est défini comme notre langue par défaut, nous allons donc ajouter “ espagnol ” (vous pouvez même sélectionner le dialecte).
Choix et personnalisation du sélecteur de langue frontend
Ensuite, choisissons comment nos visiteurs peuvent passer à leur langue préférée.
Dans l'onglet « Sélecteur de langue », TranslatePress propose toute une série d'options de personnalisation pour l'affichage d'un bouton de langue ou d'un menu déroulant. Vous pouvez Regardez cette vidéo Pour tout savoir sur ce personnaliseur, mais pour l'instant, activons simplement le Commutateur flottant et choisissez un design prédéfini.
Cela créera automatiquement un sélecteur de type déroulant qui restera en haut de chaque page de votre site Web. Si vous souhaitez le personnaliser davantage, vous pouvez faire défiler la page et ajuster les couleurs, les bordures, les formes des drapeaux, et bien plus encore.
Traduire automatiquement une page WPBakery
Maintenant que vous avez ajouté vos langues et mis en place le sélecteur, il ne vous reste plus qu'à traduire.
Si vous souhaitez que cela soit fait le plus rapidement possible, TranslatePress AI est la solution idéale. Vous pouvez activer les traductions automatiques en vous rendant sur la page Traduction automatique onglet dans le TranslatePress Paramètres.
Chaque licence TranslatePress donne droit à un nombre défini de mots IA à utiliser pour les traductions automatiques ; vous pourrez suivre votre consommation ici.
Si vous préférez utiliser votre propre API Google Translate ou DeepL, vous pouvez choisir l'une de ces deux options parmi les Moteurs alternatifs section juste en dessous. Cependant, gardez à l'esprit que cela nécessitera une configuration de votre part afin de connecter votre clé d'API à TranslatePress.
Maintenant, nous allons simplement Sauvegarder nos changements en bas de la page et allez tester le tout en visitant n'importe quelle page de notre site.
Dans le coin inférieur droit (si vous avez conservé les paramètres par défaut), vous verrez le sélecteur de langue. Passez simplement le curseur dessus et cliquez sur la langue dans laquelle vous souhaitez traduire la page, et elle sera traduite automatiquement.
Désormais, chaque fois que quelqu'un visitera une page de votre site, il pourra sélectionner sa langue préférée.
Traduire manuellement une page WPBakery
Voyons maintenant comment traduire manuellement une page isolée avec TranslatePress. Cela s'avère utile si vous souhaitez modifier l'une des traductions automatiques, ou si vous préférez simplement opter pour la traduction manuelle dès le départ.
Ouvrez la page que nous avons créée avec WPBakery dans les étapes précédentes dans votre navigateur, et dans la barre d'administration, cliquez Traduire la page.
Cela ouvrira la page dans l'éditeur visuel côté client de TranslatePress, où vous pourrez traduire chaque chaîne de caractères de la page et apporter des corrections aux traductions si nécessaire.
Tout ce que vous avez à faire est de sélectionner la chaîne dans le menu déroulant sur le côté gauche (sous la langue par défaut) ou de la survoler et de cliquer sur l'icône en forme de crayon à côté.
Puis, dans la deuxième fenêtre linguistique (“En espagnol” dans notre cas), apportez les modifications nécessaires. Si des suggestions sont disponibles ci-dessous.
La même chose peut être faite avec tous les éléments WPBakery de la page, qu'il s'agisse d'un bouton, d'un élément de copyright, ou même d'un image.
De plus, TranslatePress peut également vous aider à traduire les articles du menu, formes, et même Produits WooCommerce, qui peut être intégré dans les pages WPBakery.
N'oubliez pas de cliquer “Sauver” après chaque modification.
Transformez votre conception WPBakery en une expérience multilingue
Et voilà, notre tutoriel est terminé. Comme vous pouvez le constater, traduire n’importe quel site, page, article ou élément créé avec WPBakery est désormais plus simple que jamais grâce à TranslatePress. De plus, l’outil est très intuitif et facile à utiliser : votre site WPBakery sera prêt pour le multilinguisme en un clin d’œil !
Apprends aussi comment afficher/masquer des éléments WPBakery multilingues en fonction de la langue.