Elementor Pro vous permet d’insérer dynamiquement les données des champs personnalisés ACF directement dans vos champs Elementor. WPML vous permet de rendre tous les contenus multilingues.
Sur un site existant avec ACF, Elementor Pro et WPML, l’option Expert sera sélectionnée pour vos groupes de champs existants.
Il est important de noter que vous devez définir les options de traduction par groupe de champs. Pour ce faire, vous devez éditer chaque groupe de champs et sélectionner une option de traduction pour les champs qu’il contient. Si vous ne définissez pas d’option de traduction pour un groupe de champs, vous ne pourrez pas traduire les champs qui en font partie.
Traduisez les choix des champs de type sélection, case à cocher et bouton radio.
WPML vous permet de traduire et d’afficher les choix que vous ajoutez aux champs de type Select, Checkbox et RadioButton sur le front-office.
Cependant, Elementor n’affiche que les valeurs des champs. Ainsi, lorsque vous ajoutez ces types de champs dans les champs personnalisés, vous devez saisir chaque choix sur une nouvelle ligne dans la section Choix.
Entrée de chaque choix sur une nouvelle ligne
Utilisation de l’option de traduction « Mêmes champs dans toutes les langues ».
Une fois que vous avez sélectionné l’option Mêmes champs dans toutes les langues, vous pouvez rendre vos champs personnalisés multilingues en suivant une procédure en deux étapes :
Ici, nous allons rapidement vous montrer comment traduire un Article et les valeurs des champs par vous-même :
Modifiez l’Article que vous souhaitez traduire. Dans la zone Langue, cliquez sur l’icône plus à côté de la langue dans laquelle vous souhaitez traduire l’Article.
Cliquer sur l’icône plus pour traduire l’Article
Vous accédez à l’ Advanced Translation Editor. Si vous avez des crédits de traduction, vous verrez les traductions automatiques remplies. Vous pouvez les relire et les accepter. Si vous n’avez pas de crédits et que vous traduisez votre Contenu manuellement, cliquez sur les icônes plus et entrez les traductions pour chaque ligne. Une fois que vous avez terminé, cliquez sur le bouton Terminer.
Traduire un article avec des champs personnalisés dans l’Advanced Translation Editor
Traduire le modèle Elementor
Une fois que vous avez inséré dynamiquement les données du champ personnalisé ACF dans un modèle d’Article unique, vous pouvez le traduire dans les langues secondaires de votre site. Pour en savoir plus, consultez notre guide sur la traduction des modèles Elementor.
Utilisation de l’option de traduction « Champs différents d’une langue à l’autre
Lorsque vous utilisez Elementor et ACF avec WPML, vous pouvez avoir le même nombre de champs à travers chacune des langues de votre site tout en ayant des valeurs de champs différentes.
Prenons l’exemple d’un blog sur le cinéma. Le Contenu de votre site est disponible en deux langues – anglais et espagnol. Vous souhaitez publier un Article sur le meilleur film de l’année. Cependant, vos publics anglophone et hispanophone ont voté pour deux films différents.
Vous souhaitez utiliser les mêmes champs personnalisés, comme le titre du film, la description du film, l’image du film et le genre du film dans les deux langues. Mais vous voulez que les valeurs soient différentes. Vous souhaitez également que les deux articles utilisent des modèles Elementor différents.
Dans ce cas, vous ne pouvez pas utiliser la traduction automatique ou l’Advanced Translation Editor, car cela vous oblige à traduire directement le Contenu de l’Article et les valeurs des champs. Toutefois, vous pouvez choisir l’option de traduction Différents champs à travers les langues pour votre groupe de champs et :
Dans les sections ci-dessous, nous vous guiderons à travers le processus de traduction de tous les différents éléments.
Traduire des images à l’aide de la traduction des médias
Si vous disposez d’un champ de type ACF Image, il se peut que vous souhaitiez utiliser des images différentes pour des articles rédigés dans des langues différentes.
Pour commencer, installez et activez le module complémentaire WPML Traduction des médias.
Ensuite, suivez les étapes ci-dessous :
Allez à WPML → Traduction des médias.
Localisez l’image que vous souhaitez « traduire » et cliquez sur l’icône du crayon sous la langue pour laquelle vous souhaitez utiliser une image différente.
Téléchargez une autre image et cliquez sur le bouton Enregistrer la traduction des médias.
Téléchargement d’une autre image et enregistrement de la traduction des médias
Traduire les valeurs des champs Article et ACF dans l’éditeur de WordPress
Désormais, vous pouvez traduire les valeurs de vos articles et de vos champs dans l’option de traduction Différents champs à travers les langues. Gardez à l’esprit que pour cette option de traduction, vous ne pouvez utiliser que l’éditeur WordPress pour traduire votre Contenu.
Modifiez l’article sur la langue par défaut. Dans la zone Langue, cliquez sur l’icône plus à côté de la langue dans laquelle vous souhaitez traduire l’Article.
Cliquez sur l’icône plus dans la case Langue
Vous devriez voir des champs personnalisés vierges et l’image que vous avez déjà traduite à l’aide de Traduction des médias. Il ne reste plus qu’à entrer manuellement le Contenu de l’Article et les valeurs des champs dans la langue secondaire du site, puis à cliquer sur Publier.
Entrez manuellement les valeurs des champs dans la langue secondaire de votre site.
Traduisez les choix pour les champs de type sélection, case à cocher et bouton radio.
Dans l’option de traduction Différents champs à travers les langues, vous devez traduire les types de champs Choix pour sélectionner à l’aide de la Traduction chaine.
Pour ce faire :
Allez à WPML → Traduction de chaînes.
Utilisez le filtre d’affichage en haut de la page Traduction de chaînes pour déterminer les chaînes à afficher. Vous pouvez rechercher des chaînes de texte dans le domaine acf-field-group , ou rechercher les textes exacts.
Déterminer les chaînes de texte à afficher
Une fois que vous avez localisé le texte à traduire, cliquez sur l’icône plus située sous la langue dans laquelle vous souhaitez le traduire. Entrée pour enregistrer la traduction.
Cliquez sur l’icône plus pour traduire les chaînes de texte.
Créer des modèles Elementor différents pour les articles en langue par défaut et en langue secondaire.
Une fois que vous avez fini de traduire tout le Contenu de l’Article et les valeurs des champs, vous pouvez créer des modèles différents pour chacun des Articles et insérer dynamiquement les valeurs des champs.
Traduire et afficher les libellés des champs personnalisés de l’ACF
Il peut arriver que vous souhaitiez afficher à la fois le libellé du champ et les valeurs de vos champs personnalisés ACF.
Prenons l’exemple de notre Article sur les films. Nous voulons afficher le libellé du champ, Genre de film, et la valeur du champ, Action, sur le Front-office.
WPML vous permet de traduire les libellés des champs ACF, mais Elementor n’offre pas de moyen d’afficher dynamiquement les libellés des champs sur le front-office. Par défaut, Elementor ne peut qu’afficher dynamiquement les valeurs des champs. Pour afficher dynamiquement des libellés, vous devez utiliser les options de l’onglet Avancé et ajouter manuellement le texte de votre choix Avant ou Après les valeurs du champ.
Ajout manuel de texte avant la valeur du champ dans l’onglet Avancé
Pour traduire le texte que vous avez ajouté Avant ou Après la valeur du champ personnalisé, il vous suffit de traduire le modèle Elementor. Si vous traduisez le modèle vous-même, vous verrez le texte dans l’Advanced Translation Editor.
Traduire le texte ajouté au modèle dans l’Advanced Translation Editor
Une fois que vous avez traduit l’Article et le modèle, vous verrez les traductions au bon endroit sur le Front-office.
Le texte ajouté avant la traduction du champ personnalisé sur le Front-office.
