Shopify - Design - Comment changer la position du bouton mobile?

Dans cet article, vous apprendrez comment ajouter ou modifier une langue Weglot switcher sur la version mobile de votre site web.

Si vous recherchez un commutateur Weglot situé dans une zone spécifique de la version mobile de votre site Web, vous devez suivre ces étapes :

1. Créer un bouton Weglot supplémentaire sur la version mobile

Vous devrez d'abord créer un autre bouton Weglot. Pour ce faire, allez dans votre Shopify admin > Apps > Weglot Translate :

  • Sélectionnez la version mobile au bas de la capture d'écran
  • Cliquez sur 'Ajouter un nouveau bouton de langue'
  • Maintenant, un bouton s'affiche dans la fenêtre de prévisualisation. Vous pouvez le faire glisser et le laisser tomber où vous voulez
  • Une fois que le bouton de langue est tombé là où vous souhaitez qu'il soit situé, enregistrez les modifications

2. Ajouter du code CSS personnalisé (facultatif)

Si vous voulez appliquer du code CSS personnalisé à ce bouton spécifique, vous pouvez l'ajouter à la section Override CSS et utiliser l'id #weglot-switcher-2 :

#weglot-switcher-2 .country-selector {
  left: 30px;
}

Certains thèmes Shopify ont 2 en-têtes : un pour les écrans de bureau et un pour les écrans mobiles et tablettes à des fins réactives. L'ajout d'un commutateur de langue supplémentaire sur la version mobile de votre site Web peut également faire apparaître le 2ème commutateur sur les écrans de bureau.

Pour masquer le 2ème commutateur en fonction de la largeur de l'écran de l'appareil, vous devrez appliquer une règle de requête multimédia CSS, comme la suivante :

@media only screen and (min-width: 600px) {
  #weglot-switcher-2 {   
    display: none!important;  
  }
}

Vous avez encore besoin d’aide? Contactez-nous Contactez-nous