Once you've created a Form, Survey, Subscription Page, or Landing Page you'll want to embed it in an email or on your website in some way. Click offers several embedding options for every Web Content type.
Goals
- Learn about the different methods for embedding web content records
- Compare and contrast different embedding options
- Click's CRM
Embedding Options
Press the Embed Button on the Web Content you created.
Then you'll see this window with your different options:
Custom URL: allows the URL text to be customized so that its purpose can be made clearer to the user who clicks it. Otherwise this functions the same way as the Embed as Link option.
Embed As Link: This will take you straight to the form on its own page. Use this in an email or on your website. From this tab you can also click
Download file to download the Web Content record's HTML, allowing you to place it directly on your website or make modifications beyond what is allowed within the editor.
NOTE: If you download the form's HTML and modify it outside of the Web Content editor, we will not be able to provide technical assistance for any changes made.
Embed As Iframe: Allows the Web Content to be placed within a page on your website. The iframe code should be placed on your website within the <body> tags.
Embed As Widget: Also allows the Web Content to be placed within a page on your website, but additionally allows it to take on any relevant CSS properties from the parent page. Place this code on your website within the <body> tags.
HTTP vs HTTPS Considerations
When branding your Web Content URLs with a Web Content CNAME, the URLs will be http. If your website is https, this could cause a Mixed Content error when embedding the record onto your website. There are a couple things you can do:
1) To use a Web Content CNAME and have the URLs be https, you can setup an SSL Certificate for the CNAME.
2) The default Click URL in the embed code is https, so this error can be circumvented by manually updating the URL in the embed code to https by typing an 's' after the existing http, and by replacing the Web Content CNAME with the default Click value.
For example, this iframe code for a form:
<iframe src="http://web.mycompany.com/clickdimensionscom-ak7l5/pages/
bvybyrm8eeontww75.html" allowtransparency="true" width="100%" height="500px"
type="text/html" frameborder="0" style="border:0"></iframe>
would need to be changed to:
<iframe src="https://analytics.clickdimensions.com/clickdimensionscom-ak7l5/pages/
bvybyrm8eeontww75.html" allowtransparency="true" width="100%" height="500px"
type="text/html" frameborder="0" style="border:0"></iframe>
NOTE: Be sure to use the version of the analytics.clickdimensions.com URL that matches your data center:
| US Data Center | analytics.clickdimensions.com |
| EU Data Center | analytics-eu.clickdimensions.com |
| AU Data Center | analytics-au.clickdimensions.com |
| CAN Data Center | analytics-ca.clickdimensions.com |
Linking Content in a Click Email
View our article here on how to properly hyperlink your Web Content in a Click email via the Link Manager's buttons or options.
Inserting the Code on your Page
If you choose to use the iFrame or Widget embed options, place the embed code on your site by embedding it in the HTML of the web page. If you are using the Widget, please keep in mind that the Widget uses JavaScript, so you may need to make sure that your website supports JavaScript.
If you're needing to embed the form into a page using your CMS system, see our article here.
You can then see your web content in action on your website.
Test the web content and you will see your confirmation message.
Embedding Options Comparison
NOTE: A link to a form must be added through an Email Template editor's link manager for the form to pre-populate. Pasting in the embed link from the Form Builder will not cause the form to pre-populate.
Testing Your Forms
Click uses two methods to identify a visitor: the visitor’s ID which is set in a cookie that is cached in their browser; and the email address the visitor submits in a form. If you have filled in a form with an email address and it resulted in creating/updating a Contact, and then you return to that form to test it again with a different email address, you may be identified as the first Contact when you return to the form, since there will be a Click cookie and a visitor ID associated with that cookie, that was created on your first visit. This could result in your second form being associated with the original Contact. To avoid this behavior while testing an embedded form, clear your browser’s cache to remove the cookie between submissions.
| Feature Added: 2023.07 |
| Feature Updated: 2023.07 |
| Click Version Needed: Any |
Additional Training: Check out the Click Academy for more on this topic!