Ajout de code personnalisé au Site Instantané
Le code personnalisé vous permet de vérifier la propriété d'un Site instantané et d'ajouter une grande variété de nouveaux éléments et de nouveaux contenus tels que les widgets de chat ou un formulaire de contact à votre site Web. Vous pouvez également intégrer des services tiers (par ex. : réservation) au Site instantané de cette façon.
Il y a deux endroits sur le Site instantané où vous pouvez ajouter du code : la section d'en-tête et la section du corps. De plus, vous pouvez ajouter des sections dédiées avec du code personnalisé aux pages individuelles du site instantané.
Choisir où ajouter du code
L'ajout de code à l'en-tête ou au corps du site instantané vous permet d'appliquer du code à toutes les pages du site. Coller du code dans une section du site instantané vous permet d'ajouter du code personnalisé à une page particulière du site à laquelle cette section appartient.
Lorsque vous choisissez entre l'en-tête du Site instantané et le corps comme un endroit pour ajouter votre code personnalisé, considérez le code lui-même et votre cas d'utilisation.
Généralement, l'implémentation de JavaScript dans le corps du site est recommandée car elle est meilleure en termes de vitesse de page. Cependant, il y a des cas (par exemple, la vérification de propriété de domaine) où votre code doit être ajouté à la section d'en-tête.
Assurez-vous de lire les instructions pour le code/widget tiers que vous souhaitez ajouter à votre Site instantané pour des conseils sur où il est préférable d'ajouter cet élément de code particulier.
Ajouter du code à la section d'en-tête de votre Site Instantané
L'insertion de code dans l'en-tête du Site instantané est la bonne option si vous avez besoin de vérifier la propriété du site ou du domaine (par ex., lorsque vous vendez ou faites de la publicité sur Facebook). Vous pouvez ajouter plusieurs codes à la section d'en-tête.
Pour ajouter un code personnalisé à la section d'en-tête du Site instantané :
- Depuis votre interface d'administration de votre boutique, allez dans Site Web (ou dans Aperçu → Gérer le Site instantané).
- Faites défiler jusqu'à la section « Paramètres de référencement » et cliquez sur Ajouter un code sous « Balises méta de l'en-tête et vérification du site » :
- Dans le champ qui apparaît, saisissez votre code.
- Enregistrez les modifications.
Actualisez la page du Site instantané dans votre navigateur pour voir les changements.
Ajouter du code à la section de corps votre Site Instantané
Insérer du code dans le corps du Site instantané est la solution si vous avez besoin d'implémenter un script personnalisé. Par exemple, vous voulez avoir une fenêtre de discussion Zendesk ou un widget de contact sur votre site Web. Vous pouvez ajouter autant de codes dans la section du corps que vous souhaitez.
Pour ajouter un code personnalisé à la section de corps du Site instantané :
- Depuis votre interface d'administration de votre boutique, allez dans Site Web (ou dans Aperçu → Gérer le Site instantané).
- Faites défiler vers le bas jusqu'à la section « Paramètres avancés du site Web » et cliquez sur Ajouter du code sous Code JavaScript personnalisé :
- Dans le champ qui apparaît, saisissez votre code (pas plus de 4000 symboles).
- Enregistrez les modifications.
Actualisez la page du Site instantané dans votre navigateur pour voir les changements.
Ajouter des sections de code personnalisé aux pages individuelles du site
Vous pouvez ajouter une section de site dédiée avec du code personnalisé (HTML, CSS ou JavaScript) à toute page du site instantané que vous souhaitez. Par exemple, si vous avez besoin d'un widget Google Calendar sur votre page d'accueil pour que les clients puissent réserver vos cours de musique, ou si vous voulez montrer une vue 3D de votre magasin physique aux acheteurs sur la page Contacts.
Pour ajouter une section de site avec du code personnalisé :
- Depuis votre interface d'administration de votre boutique, accédez à Site Web → Modifier le site.
- (si vous avez ajouté plusieurs pages à votre site) Dans la liste déroulante Page : Page d'accueil dans le coin supérieur gauche, choisissez la page sur laquelle vous souhaitez ajouter votre code.
- Cliquez sur Ajouter une section, puis faites défiler jusqu'à Solutions avancées.
- Dans le bloc Intégrer et code personnalisé, cliquez sur Ajouter une section de code personnalisé :
- Collez votre code dans le champ.
- Cliquez sur Retour et glissez-déposez la section dans la liste des sections pour modifier son positionnement sur la page du site.
- Une fois que vous avez fini d'éditer votre site Web, cliquez sur le bouton Publier dans le coin supérieur droit de l'éditeur.
C'est tout ! Vous avez ajouté votre code personnalisé à une section du site instantané sur une page. Actualisez la page dans votre navigateur pour voir les modifications.