This article will guide you through how to use our Custom HTML integration. Our Custom HTML form integration is designed to allow you to integrate with services where a direct integration is not yet available, by using their HTML form code inside this integration.
This will allow you to create a form which you can style with our OptimizeBuilder editor and brand with styling to fit the rest of your website, as well as benefiting from our options regarding linking to further pages on your site or funnel.
Please note this integration does require your external service to provide HTML form code - we cannot integrate with javascript codes as these do not provide input fields for us to pull the data from to build the integration.
Before you use the Custom HTML integration:
Remember that we have direct API level integrations with most of the popular email marketing services and CRMs on the market. We always recommend using our direct integration if we have one available.
Due to the way the form codes work from certain email marketing services and CRMs, you will experience issues if you try and use any of the following:
AWeber - use our direct integration
Mailchimp - use our direct integration
Sendlane - use our direct integration
Keap/Infusionsoft - use our direction integration
Klaviyo - their form code is not available HTML version
Firstly, as above, the Custom HTML form integration requires your external service (CRM/ESP) to provide a HTML Form for you to use the code to integrate with this element.
The way our integration works is as follows:
You create a form in your external platform
Ensure you pick the HTML code option (javascript codes will not work). If you are given the option for an unstyled form - that is the best option to pick
When you paste the code into the form code field at the start of our Custom HTML form integration wizard, our system will scan the code and pull out any input fields, as well as form submission URLs and hidden fields and build a custom form which you can then edit inside our OptimizeBuilder
To add your custom form code, just click on the optin form. If you don't see the envelope icon in the "Optin Form" toolbar, just click the "Optin Form" text in the breadcrumbs at the top of the editor like you see here
Then, click the envelope icon and click the "Edit Integration" button
Click "Custom HTML" for the integration and then click "Next Step"
Now, insert your HTML form code and click "Next Step"
The fields from your custom HTML form code will be populated on the next screen. You can choose to use them all, or just some of them (Email is required). In the code I used in this example, we included First name, Last name, Email, and Phone.
After you select your fields, you can choose what happen after the form is submitted:
Now just click "Next Step" to see a summary of the setup.
If you are happy with what you see, just click the "Close" button and you'll be all finished with configuring the optin form.
We will include any useful notes from our testing and from customer feedback regarding this element here which may be useful to you.
Extra fields and GDPR fields are not supported when using the Custom HTML integration
If you are using forms from Drip, ensure that you ONLY select input form fields in the OptimizePress wizard that you have added to your form inside Drip. Sometimes you will see a "Website" field which should be ignored unless you have specifically added this
