> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.fotostudio.io/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Comment lier le formulaire de contact de Fotostudio à mon site internet ? (Wordpress, Wix, etc.)

Une fois votre formulaire de contact créé dans Fotostudio, vous allez pouvoir l'insérer sur votre site internet.

# Récupérer le code HTML

Vous devez commencer par récupérer le code HTML de votre formulaire.

Pour cela, éditez votre formulaire de contact dans [Contacts > Formulaires de contact](https://www.fotostudio.io/app/lead_forms?locale=fr) puis cliquez sur le bouton `Obtenir le code`.

Dans la fenêtre qui s'ouvre, vous trouverez le code à insérer sur votre site. Il faut le copier.

![Code à insérer sur votre site](https://storage.crisp.chat/users/helpdesk/website/1106822c7ec6b200/capture-decran-2022-04-15-a-16_g08olw.png)

Le code apparait sous cette forme :

`<iframe width="100%" height="650" src="https://www.fotostudio.io/lead_forms/XXXX" frameborder="0" allowfullscreen></iframe>`

| Vous pouvez modifier la valeur de la hauteur de l'iframe contenant le formulaire ( height="650" ) qui est à 650 par défaut en fonction du nombre de questions que votre formulaire contient. Cela permettra aux visiteurs de votre site d'éviter de devoir scroller pour atteindre le bouton Envoyer. 
Nous vous invitons à tester la valeur qui est adaptée à vos besoins lors de l'intégration sur votre site web.

# L'insérer sur votre site internet

L'intégration du formulaire de contact va varier en fonction de la plateforme utilisée, voici comment faire sur Wordpress et Wix.

### Wordpress

Ajouter un bloc HTML sur votre page :

1. Cliquez sur l'icône *"+"* d'insertion d'un bloc.

2. Sélectionnez le bloc HTML.

3. Collez votre code HTML du formulaire de contact dans la zone de texte.

Source : [Wordpress.com](https://wordpress.com/fr/support/editeur-wordpress/blocs/bloc-html-personnalise/)

### Wix

Ajouter un HTML Widget sur votre page :

1. Cliquez sur `Ajouter` sur le côté gauche de l'Éditeur.

2. Cliquez sur `Intégrer`.

3. Sélectionnez `Intégrer un widget` pour ajouter un iFrame à votre page.

4. Intégrez votre code :
* Cliquez sur `Saisir code`.
* Collez votre le code HTML du formulaire de contact dans la zone de texte.
* Cliquez sur `Appliquer`.

Source : [Wix.com](https://support.wix.com/fr/article/%C3%A9diteur-wix-utiliser-des-iframes-pour-afficher-du-contenu-visible-sur-votre-site)


### Autre hébergeur de site (ex : Hostinger...)

Afin d'ajouter le formulaire Fotostudio sur votre site, il vous faudra procéder d'une de ces deux manières : 

→ Inclure l’URL fournie par Fotostudio dans un composant iFrame,

OU

→ Ajouter un composant HTML personnalisé qui contient le code HTML fourni par Fotostudio


| Nous vous invitons ensuite à bien vérifier que l'intégration a bien fonctionné en complétant votre formulaire de contact sur votre site web. 

||| Selon le nombre de champs présents dans votre formulaire de contact, il se peut qu'en l'intégrant sur votre site internet vous ayez une barre de défilement à côté du formulaire. Pour corriger cela, vous devez modifier la valeur du *"height='650'"* dans le code collé sur votre site. N'hésitez pas à faire des tests pour trouver la valeur qui convient selon la taille de votre formulaire.

Si vous avez des difficultés pour intégrer votre formulaire de contact à votre site internet, n'hésitez pas à nous contacter via le chat en bas à droite.