This article explains how to embed the French version of your Zeffy form directly on your website.
When embedding a Zeffy form on your website, you can control which language version (English or French) appears to your visitors. The form can either automatically detect the visitor's browser language or be set to display specifically in French.
Steps to Embed the French Version
1. Get the Embed Code
- Log into your Zeffy dashboard
- Go to "My forms"
- Click "Edit" next to the form you want to embed
- Click the "Share my form" button at the top of the page
- Select "Embed on your website" to access the HTML embed code
2. Modify the Code for French Language
By default, your embed code doesn’t include any language settings. It will automatically adapt to the language of the viewer’s browser — for example, it will display in French if the browser is set to French, and in English if the browser is set to English.
If you'd prefer to force the form to display in a specific language, you can modify the embed code accordingly. To display the form in French, add the component "fr-CA/" in the iframe URL. Here’s your original code:
If you'd prefer to force the form to display in a specific language, you can modify the embed code accordingly. To display the form in French, add the component "fr-CA/" in the iframe URL. Here’s your original code:
<div style="position:relative;overflow:hidden;height:1200px;width:100%;">
<iframe title='Donation form powered by Zeffy'
style='position: absolute; border: 0; top:0;left:0;bottom:0;right:0;width:100%;height:100%'
src='https://www.zeffy.com/embed/donation-form/YOUR-FORM-ID'
allowpaymentrequest allowTransparency="true">
</iframe></div>
<iframe title='Donation form powered by Zeffy'
style='position: absolute; border: 0; top:0;left:0;bottom:0;right:0;width:100%;height:100%'
src='https://www.zeffy.com/embed/donation-form/YOUR-FORM-ID'
allowpaymentrequest allowTransparency="true">
</iframe></div>
Here’s where you can update the code to force the form to display in your preferred language. Below is an example of what the updated embed code would look like:
<div style="position:relative;overflow:hidden;height:1200px;width:100%;">
<iframe title='Donation form powered by Zeffy'
style='position: absolute; border: 0; top:0;left:0;bottom:0;right:0;width:100%;height:100%'
src='https://www.zeffy.com/fr-CA/embed/donation-form/YOUR-FORM-ID'
allowpaymentrequest allowTransparency="true">
</iframe></div>
<iframe title='Donation form powered by Zeffy'
style='position: absolute; border: 0; top:0;left:0;bottom:0;right:0;width:100%;height:100%'
src='https://www.zeffy.com/fr-CA/embed/donation-form/YOUR-FORM-ID'
allowpaymentrequest allowTransparency="true">
</iframe></div>
<div style="position:relative;overflow:hidden;height:1200px;width:100%;">
<iframe title='Donation form powered by Zeffy'
style='position: absolute; border: 0; top:0;left:0;bottom:0;right:0;width:100%;height:100%'
src='https://www.zeffy.com/en-CA/embed/donation-form/YOUR-FORM-ID'
allowpaymentrequest allowTransparency="true">
</iframe></div>
<iframe title='Donation form powered by Zeffy'
style='position: absolute; border: 0; top:0;left:0;bottom:0;right:0;width:100%;height:100%'
src='https://www.zeffy.com/en-CA/embed/donation-form/YOUR-FORM-ID'
allowpaymentrequest allowTransparency="true">
</iframe></div>
3. Add the Code to Your Website
- Copy the modified embed code
- Add it to your website using your platform's custom HTML or embed code feature
💡 Platform-specific guides:
- WordPress: Adding Code to Headers
- Wix: Embedding Custom Code
- Squarespace: Using Code Injection
Important Notes
- The embedded version will only show donation/payment information, not the description, images, logo, or organization name.
- If you need to display additional information, add it directly on your website above the embedded form.
- Make sure your form is translated before embedding it.