Comment modifier un fichier média (image, PDF, etc.) sur mon site web traduit ?

Cet article vous guide tout au long du processus de modification de différents types de médias - notamment les images, les PDF, les fichiers DOCX, les archives RAR et les vidéos YouTube - sur les versions traduites de votre site web.

Introduction

Lorsque vous avez un site web multilingue, vous pouvez avoir besoin d'afficher différents fichiers multimédias tels que des images, des PDF ou des vidéos dans différentes versions linguistiques. Ce guide vous guidera à travers le processus de modification des fichiers multimédias dans votre site Web traduit à l'aide de Weglot.

1. Les prérequis

Avant de commencer, assurez-vous d'avoir effectué les opérations suivantes :

a. Téléchargez le fichier multimédia traduit dans l'admin de votre site web et récupérez son URL.

b. Récupérez l'URL du fichier multimédia original sur votre site web.

2. Ajout d'une traduction de média

a. Naviguez versWeglot Dashboard: Ouvrez votre Weglot dashboard et allez dans Traductions > Langues. a. Naviguez dans votre Weglot Dashboard: Ouvrez votre Weglot dashboard et allez dans Translations > Languages.

b. Choisissez la langue: Sélectionnez la langue pour laquelle vous souhaitez ajouter la traduction de média.

c. Ajouter une traduction pour le média: Cliquez sur le bouton "Actions" à côté de la barre de recherche et choisissez "Add media translation" (Ajouter une traduction média).

d. Complétez les détails: Une fenêtre s'affiche, dans laquelle vous devez saisir des informations :

• L'URL du média original
• L'URL du média traduit

e. Finaliser: Cliquez sur le bouton "Add" (Ajouter) pour terminer le processus.

C'est fait ! Vous devriez maintenant voir la traduction du média directement dans votre liste de traductions. Vos médias traduits devraient être affichés sur la version traduite de votre site web.

3. Traduction de l'image

Les images peuvent être chargées de différentes manières sur votre site web. Nous allons voir trois façons dont les images peuvent être chargées, afin que vous puissiez les traduire à l'aide de Weglot.

a. Chargement standard

Les images sont généralement chargées par l'intermédiaire de l'attribut src dans le code HTML. Cliquez avec le bouton droit de la souris sur l'image et sélectionnez "Inspecter" pour trouver l'URL.

Pour trouver l'URL de l'image originale, visitez la page où elle se trouve, puis faites un clic droit sur l'image et sélectionnez "Inspecter" :

Vous devriez voir l'URL de l'image près de l'attribut src et le copier :

b. Lazy loading

Cette méthode charge différentes images en fonction de la taille de la fenêtre du navigateur. Elle permet à votre site web d'afficher des images plus compactes sur des appareils plus petits comme les téléphones portables, ce qui garantit un chargement rapide et constant de votre site.

Si l'image que vous essayez de traduire est téléchargée avec du lazy-loading, copiez toutes les URL dans le fichier data-src ou srcset .

c. Règle CSS "background"

Si une image est définie avec la règle CSS "background", vous devez ajouter un code CSS personnalisé dans votre Weglot Dashboard under Settings > Language Switcher > Custom CSS (voir: Comment ajouter un code CSS personnalisé).

Voici un exemple de scénario illustrant comment modifier l'image de fond d'un élément sur la version traduite de votre site web :

html[lang="fr"] .my-element-class {
    background: url("https://mywebsite.com/path/to/my/translated-image.png") !important;
}

Vous devrez échanger le code de la langue (dans cet exemple, c'est "fr" ; pour une liste complète, consultez la rubrique Langues disponibles), le sélecteur CSS de l'élément dont vous souhaitez modifier l'arrière-plan et l'URL de la nouvelle image que vous souhaitez utiliser à la place de l'image d'origine.

Dépannage

• Actualisez votre site web ou videz le cache de votre navigateur si les changements ne sont pas visibles.
• Veillez à ce qu'il n'y ait pas de requêtes inutiles dans l'URL du média, comme par exemple ?v=randomNumbers à la fin de l'URL.
• Vérifiez que l'URL est correcte et qu'elle existe dans le code source de votre site web. Pour examiner le code source de votre site web, vous pouvez soit faire un clic droit sur n'importe quelle partie de la page web et choisir "Voir la source de la page", soit utiliser le raccourci clavier-Ctrl+Alt+U pour PC ou Cmd+Opt+U pour Mac.

Besoin d'aide ?

Si vous rencontrez des problèmes, n'hésitez pas à contacter le support de Weglot avec les détails nécessaires :

• L'URL de l'endroit où se trouve le média que vous souhaitez traduire.
• L'URL du média original.
• L'URL du média traduit.