Avec les versions de thème et de plugin, Divi est l’un des moyens les plus populaires et les plus flexibles de créer un site WordPress. Bien que Divi vous offre une grande flexibilité de conception, il n’existe pas de moyen intégré de traduire les sites Divi. C’est pourquoi vous lisez probablement cet article ici.

Ce tutoriel vous montrera comment traduire un site Divi en utilisant la version gratuite du plugin TranslatePress.

S’il y a une chose Deux Les utilisateurs adorent sa conception visuelle et TraduirePress apporte la même approche visuelle pour créer un site multilingue avec Divi.

À la fin de cet article, vous pouvez utiliser une interface visuelle pour traduire tout votre contenu Divi, y compris les images, les formulaires, les boutons, etc., en pointant et en cliquant simplement sur un aperçu en direct de votre site Web:

Comment créer un site multilingue avec Divi

Prêt à apprendre à traduire un site Internet Divi? Plongeons-nous dans …

* Cette méthode fonctionne à la fois pour le thème et la version plugin de Divi.

Comment traduire des sites Divi avec TranslatePress: étape par étape

Voici une vue d’ensemble du processus de création d’un site multilingue avec Divi:

  1. Concevez votre contenu avec le Divi Builder
  2. Configurer les paramètres de base de TranslatePress
  3. Utilisez l’interface de l’éditeur de traduction visuelle TranslatePress
  4. Ajoutez un sélecteur de langue frontal à votre site Divi multilingue

1. Créez votre contenu avec Divi

Divi est disponible dans les versions de thème et de plugin Divi Page Builder. Dans tous les cas, vous pouvez utiliser une interface visuelle glisser-déposer pour concevoir votre contenu. Vous pouvez également utiliser une interface backend abstraite si vous préférez cette approche.

Tout d’abord, utilisez Divi pour créer tout le contenu que vous souhaitez utiliser sur votre site Web. Maintenant, ne vous inquiétez pas de la langue – créez simplement le contenu dans la langue par défaut de votre site Web que vous souhaitez.

Pour ce tutoriel, nous choisirons l’une des nombreuses mises en page prêtes à l’emploi de Divi car elle offre de nombreux exemples de contenu à traduire. Cependant, vous pouvez également créer votre contenu à partir de zéro – c’est entièrement à vous:

Deux modèles

Divi comprend plus d’un millier de modèles prédéfinis ainsi que 137 «packs de mise en page» dédiés, qui sont essentiellement des modèles thématiques pour une niche de site Web spécifique.

Après avoir importé le modèle de page d’accueil à partir de l’un des packages de mise en page du site Web du restaurant, notre site Divi ressemblera à ceci:

Exemple de site Divi

Vous pouvez ajuster le contenu à tout moment et le réorganiser selon vos besoins à l’aide de l’interface glisser-déposer de Divi. Quels que soient les éléments que vous ajoutez avec Divi, les prochaines étapes vous permettront de tout traduire avec TranslatePress.

Vous pouvez modifier n’importe quel texte, changer la conception, ajouter des formulaires, des curseurs, etc.

2. Configurez les paramètres de base de TranslatePress

Une fois que vous avez terminé avec votre contenu Divi, vous pouvez le traduire à l’aide de TranslatePress.

Avant de faire cela, cependant, vous devez effectuer quelques étapes de nettoyage de base, telles que: Sélectionnez les langues que vous souhaitez proposer Votre contenu Divi au format.

Tout d’abord, installez et activez le plugin gratuit TranslatePress. Une fois que vous avez activé le plugin, allez à Paramètres → TranslatePress pour configurer les paramètres de base.

Votre premier choix est les langues à utiliser sur votre site Web. Utilisez le Langue standard Liste déroulante pour sélectionner la langue dans laquelle votre site existe actuellement (par exemple anglais). Ensuite, utilisez le Toutes les langues Section pour ajouter autant de nouvelles langues que nécessaire.

Cependant, vous pouvez ajouter une autre langue avec la version gratuite de TranslatePress Vous pouvez mettre à jour à la version payante pour traduire votre contenu Divi dans de nouvelles langues illimitées:

Sélectionnez les langues de traduction dans le plugin TranslatePress

Une autre option importante est de savoir si vous souhaitez ou non utiliser la traduction automatique, que vous pouvez configurer via le traduction automatique Languette.

Si vous souhaitez gagner du temps, vous pouvez utiliser l’API Google Translate pour traduire automatiquement 100% du contenu de votre site Web, y compris tout votre contenu Divi. Ensuite, vous pouvez revenir en arrière et affiner manuellement vos traductions si nécessaire:

Fonction de traduction automatique dans TranslatePress

La version premium de TranslatePress offre également un support pour le Traduction automatique DeepL un service.

Vérifiez également les autres paramètres car vous pouvez trouver quelque chose de pertinent pour votre site Divi. Une fois que vous avez enregistré vos modifications, vous êtes prêt à commencer à traduire le contenu Divi.

3. Utilisez TranslatePress Visual Editor pour traduire les sites Divi

Pour traduire votre site Divi, utilisez l’éditeur de traduction frontal visuel de TranslatePress.

Pour accéder à cet éditeur, ouvrez la page Divi que vous souhaitez traduire dans le front-end de votre site. Cliquez ensuite sur Traduire la page Bouton dans la barre d’outils WordPress:

Accédez à l'éditeur de traduction pour traduire le site Divi

Cela ouvrira l’éditeur de traduction visuelle qui vous permettra de traduire 100% du contenu de votre site Web.

Pour traduire un contenu spécifique, placez le pointeur de votre souris dessus et cliquez sur l’icône en forme de crayon bleu ou vert. Cela ouvrira la traduction de ce contenu dans la barre latérale, où vous pourrez apporter vos modifications:

Comment sélectionner une chaîne de texte pour traduire le site Divi

Une fois que vous avez enregistré votre traduction, le texte traduit apparaîtra dans l’éditeur en temps réel lorsque vous afficherez cette langue. Voici comment vous assurer que la mise en page de votre site Web est toujours parfaite:

Traduire du texte dans Divi

Vous pouvez rapidement basculer entre différentes traductions Utilisez les raccourcis clavier de TranslatePress.

Le pouvoir de cette approche est que vous pouvez l’utiliser pour vous-même tout le contenu de votre site Web, y compris les images, les liens de boutons, les éléments de menu, Popups…tout!

Passons en revue quelques exemples …

Traduire des boutons / liens dans Divi

Comme vous l’avez vu ci-dessus, notre site Divi comporte deux boutons / liens:

  • Afficher le menu – passe à une page interne sur laquelle le menu est affiché.
  • Réservation – Dirige les visiteurs vers un site Web tiers pour effectuer une réservation (OpenTable).

Pour traduire un bouton, placez le pointeur de la souris dessus et cliquez sur l’icône en forme de crayon bleu.

Ce qui est différent, cependant, c’est que vous pouvez traduire tous les deux le texte du bouton et le lien du bouton. Dans notre exemple de restaurant, cela signifie que vous pouvez envoyer des visiteurs hispanophones directement vers la version espagnole d’OpenTable:

Traduire les liens dans Divi

TranslatePress modifie automatiquement les liens internes pour accéder à la version linguistique correcte. Vous n’êtes pas obligé de modifier les liens internes manuellement.

Traduire les éléments de menu, widgets, pieds de page de Divi, etc.

TranslatePress ne fonctionne pas seulement pour le contenu Dans The Divi Builder – Vous pouvez également traduire le contenu du thème Divi (ou de tout autre thème WordPress). Cela inclut le vôtre Menus de navigation et tous les widgets que vous utilisez dans votre barre latérale ou pied de page. Il reconnaît et vous permet aussi Édition / traduction de chaînes gettext ajouté par le plugin Divi Theme ou Page Builder.

Une fois que vous avez traduit le texte, TranslatePress utilisera automatiquement cette traduction sur l’ensemble de votre site Web:

Traduire les éléments du menu Divi

Traduire des images

En plus du contenu textuel, vous pouvez également utiliser TranslatePress « Traduire » les images. Cela signifie que vous pouvez utiliser différentes images en fonction de la langue dans laquelle un visiteur surfe.

Par exemple, vous pouvez utiliser un logo différent pour différentes langues. Vous pouvez également traduire une image qui sera utilisée dans votre contenu pour une meilleure localisation.

Pour traduire une image, vous pouvez utiliser la même approche: survolez-la et cliquez sur l’icône en forme de crayon bleu. Vous pouvez ensuite sélectionner une nouvelle image de votre médiathèque WordPress dans la barre latérale ou entrer l’URL d’une image externe.

Voici à quoi cela ressemble lorsque vous traduisez le logo dans le thème Divi:

Traduire le logo Divi

Et cela fonctionne de la même manière pour les images de votre contenu, ou même Images dans un curseur que vous avez créé avec le module Divis Slider:

Comment traduire des images sur le site Divi

Traduire les formulaires

Enfin, regardons un exemple spécifique pertinent lors de la construction d’un site multilingue avec Divi – vos formulaires.

Presque tous les sites Web de Divi utilisent le formulaire de contact de Divi ou les modules de connexion par e-mail. Par conséquent, la traduction de ces modules est une considération importante lors de la traduction d’un site Web Divi.

Comme vous pouvez probablement le deviner maintenant, vous pouvez utiliser la même approche pointer-cliquer avec TranslatePress traduire vos formulaires, également.

Vous pouvez même traduire le texte de l’espace réservé affiché Dans Champs de formulaire:

Comment traduire les formulaires Divi

Et voila! Que vous traduisiez du texte, des boutons, des liens, des éléments de menu, des widgets ou autre chose, traduire votre site Divi est aussi simple que de pointer et de cliquer avec TranslatePress.

4. Configurez votre sélecteur de langue frontal

Par défaut, TranslatePress ajoute un flottant Changeur de voix dans le coin inférieur droit de votre site, que vous avez probablement vu dans les exemples de captures d’écran ci-dessus.

Cependant, si vous souhaitez modifier ce comportement par défaut, TranslatePress vous propose également quelques autres options qui vous permettent d’ajouter le sélecteur de langue à votre site Web Divi multilingue.

Une façon est de l’ajouter en tant qu’élément du menu de navigation en ajoutant que Changeur de voix Éléments de menu (Apparence → Menus):

Ajouter le sélecteur de langue dans le menu Divi

Voici à quoi cela ressemble dans le front-end de votre site Web:

Sélecteur de langue du menu frontal pour Divi-Site

Vous pouvez également afficher un sélecteur de langue avec le [language-switcher] Shortcode que vous pouvez ajouter dans n’importe quel widget, éditeur WordPress natif ou directement à votre contenu Divi.

Créez un site multilingue avec Divi dès aujourd’hui

Divi vous permet de créer un magnifique site WordPress avec un éditeur visuel par glisser-déposer.

TranslatePress vous permet de traduire ce beau design dans de nouvelles langues avec une expérience de traduction visuelle tout aussi simple.

Lorsque vous combinez les deux, vous pouvez vraiment créer des sites WordPress personnalisés auxquels les visiteurs du monde entier peuvent accéder.

Tout ce que vous avez vu ci-dessus peut être fait avec ça version gratuite de TranslatePress sur WordPress.org. Pour plus de flexibilité, cependant, vous pouvez envisager Passez à la version premium de TranslatePressqui offre …

  • Prise en charge des champs dynamiques (super si vous utilisez Fonction de contenu dynamique de Divi)
  • Assistance plus détaillée pour SEO multilingue
  • Prise en charge de langues de traduction illimitées
  • Intégration avec DeepL pour la traduction automatique
  • Comptes traducteurs dédiés
  • La possibilité de parcourir votre site Web en tant que différents rôles d’utilisateur (idéal pour les sites Web avec un contenu restreint)

TranslatePress multilingue

TranslatePress est le moyen le plus simple de traduire votre site WordPress. Il est rapide, ne ralentira pas votre site Web, fonctionne avec N’IMPORTE QUEL thème ou plugin et est convivial pour le référencement.

Obtenez le plugin

Pour en savoir plus sur les fonctionnalités premium, Aller à la page de tarification.





Source link

Recent Posts