Intégrer un widget sur Webself

Après avoir configuré votre widget, vous arrivez à la dernière étape où vous devez copier le code d’intégration dans l’administration de votre site Webself, soit en PHP soit en Javascript. Webself permet d’intégrer un widget aussi bien avec le code Javascript qu’avec le code PHP. Nous vous conseillons néanmoins de faire l’intégration en JavaScript. Voici quelques explications qui vous permettront d’arriver à vos fins facilement :

Intégrer avec le code Javascript

Etape 1 : Récupérer le code d’intégration

Cas 1: Vous souhaitez intégrer un widget Itinéraires (pro.cirkwi.com)

  1. Sur pro.cirkwi.com, dans l’étape du code d’insertion, cliquez sur « Le code d’insertion en JavaScript ».
  2. Sélectionnez et copiez le code (ctrl C ou édition/coller):

Cas 2: Vous souhaitez intégrer un widget Storyguide (admin.wim.cirkwi.com)

  • Dans le Menu vous trouverez la section « Mes widgets » et vous pourrez ainsi directement accéder aux codes d’intégration en JavaScript en cliquant sur  » Intégrer </> » à droite de votre écran
  • Copier le code
Étape 2 : sur Webself
  1. Maintenant, allez sur le tableau de bord puis dans la section Mes Sites appuyez sur « modifier le site ».
  2. Vous allez être redirigé sur l’administration de votre site Webself (une adresse qui ressemblerai à www.monsite.webself.net).
  3. En haut, dans la rubrique « Page », sélectionnez la page sur laquelle vous voulez intégrer le widget. Dans l’exemple nous sommes dans la page « Aux alentours ».
  4. Cliquez sur le bouton « Ajouter », puis allez sur « Script ».
  5. Insérez votre code JavaScript dans « Contenu du code »:
  6. Cliquez sur « Mettre à jour », puis sur « Sauvegarder ». La carte apparaîtra dans une petite fenêtre comme suit:
  7. Voici le résultat que vous devriez obtenir. Vous pouvez agrandir la carte en cliquant sur les bords et en les faisant glissez vers le bas de la page:

Une fois les bords ajustés, vous avez un rendu comme suit:

Vous pouvez aller consulter la page de votre site internet. Le widget est maintenant affiché 🙂
Si quelque chose ne fonctionne pas ou que le widget s’affiche mal, contactez notre support en ligne en bas à droite de cette page.