Embed OptinMonster<\/h2>\n\n\n\n
To locate and embed your OptinMonster Global Embed code, follow these steps:<\/p>\n\n\n\n
- \n
- From the OptinMonster dashboard, navigate to the Account<\/strong> page<\/a>. You can access this page by clicking on your Account Name<\/strong> in the top right corner, then select My Account<\/strong> from the dropdown menu.
![\"\"](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2022\/05\/dashboard-account-name-my-account-1024x622.png\")
<\/li>\n\n\n\n- Scroll down to the Account-wide Embed Code area. Copy the code in the box.
![\"\"](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2022\/05\/account-copy-embed-code-1024x328.png\")
<\/li>\n<\/ol>\n\n\n\n\n<\/p>\n\n\n\n
If you have already created a campaign<\/a> in OptinMonster, you can also find your account-wide (aka Global) embed code on the Publish<\/strong> view of the campaign builder, under Platform > Any Site.
![\"\"](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2022\/05\/publish-copy-embed-code-1024x741.png\")
<\/p>\n\n\n\n<\/p>\n<\/div>\n\n\n\n
- \n
- Next, log into your Webflow<\/a> account. Navigate to the Dashboard > All Sites<\/strong> and click on the ellipsis icon (…) on the card for your site.<\/li>\n<\/ol>\n\n\n\n
![\"Webflow](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/webflow-dashboard-settings-e1678873252895.png\")
<\/figure>\n\n\n\n4. Next, select Settings<\/strong> from the dropdown menu.<\/p>\n\n\n\n
![\"Webflow](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/Webflow-Site-Settings-e1678874357830.png\")
<\/figure>\n\n\n\n5. Next, click on Custom Code<\/strong>.<\/p>\n\n\n\n
![\"Webflow](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/Webflow-Custom-Code.png\")
<\/figure>\n\n\n\n6. Scroll down to the Footer Code<\/strong> section and paste your OptinMonster Global Embed Code there. Then, click Save Changes<\/strong>.
![\"Webflow](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/Webflow-Footer-Code-e1678874721772.png\")
<\/p>\n\n\n\n7. When you’re finished, click Publish<\/strong>.
![\"Webflow](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/Webflow-Publish-After-Footer-Code.png\")
<\/p>\n\n\n\nYou can find more information about this process in Webflow’s documentation here<\/a>.<\/p>\n\n\n\n
Embed a Campaign on Specific Page<\/h2>\n\n\n\n
To add the embed code to a specific page of your site, follow these steps:<\/p>\n\n\n\n
- \n
- In the campaign builder, navigate to the Publish <\/strong>tab and copy the Campaign Embed code.
![\"Copy](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2020\/09\/publish-screen-copy-embed-code.jpg\")
<\/li>\n\n\n\n- Next, log into your Webflow account and open your site in the Designer<\/strong> view.<\/li>\n\n\n\n
- Click on the Pages<\/strong> icon in the left sidebar.
![\"Webflow](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/Webflow-Pages.png\")
<\/li>\n\n\n\n- Hover your cursor over the page where you would like to add your campaign. Then click on the Edit Page Settings<\/strong> icon.
![\"Webflow](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/Webflow-Page-Settings-e1678876230853.png\")
<\/li>\n\n\n\n- Scroll down to the Custom Code<\/strong> area and paste your OptinMonster campaign embed code<\/strong> there. Then, click Save<\/strong>.
![\"Webflow](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/Webflow-Page-Code.png\")
<\/li>\n\n\n\n- When you’re finished, click Publish<\/strong>.
![\"Webflow](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/Webflow-Publish-Page.png\")
<\/li>\n<\/ol>\n\n\n\nEmbed Inline Campaigns<\/h2>\n\n\n\n
After adding the Global Embed Code to the Site OR the Campaign Embed code to the page, for adding an Inline campaign, you must place the HTML Placeholder<\/a> of the campaign on the specific page within the content where it should visually appear.<\/p>\n\n\n\n
To add the HTML Placeholder code to a specific part of your page, follow these steps:<\/p>\n\n\n\n
- \n
- Click on Add Elements<\/strong> and drag the Embed<\/strong> element on the page where you want to show your Inline Campaign.
![\"Webflow](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/Webflow-Embed-Element-e1678877372538.png\")
<\/li>\n\n\n\n- Paste your HTML Placeholder code<\/strong> click on Save & Close<\/strong>.
![\"Add](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2023\/03\/Add-the-HTML-Placeholder-and-Save-e1678877472466.png\")
<\/li>\n\n\n\n- When you’re finished, click Publish<\/strong>.
<\/li>\n<\/ol>\n\n\n\n\n\nTroubleshooting<\/h2>\n\n\n\n
What domain do I enter when creating my campaign?<\/h5>\n\n\n\n
When creating your campaign you can add the domain provided by Webflow in your Dashboard (for example the one we used for testing is,
optinmonsters-fantastic-site.webflow.io<\/code>) for your campaign to load on. This will allow you to view the campaign when previewing your site.<\/p>\n\n\n\n\n<\/p>\n\n\n\n
If your site uses a custom domain with Webflow, you must also add the domain that appears in the address bar when you view your website.
If you haven’t registered the domain you want to use in your OptinMonster account yet, you can add the site through the Publish<\/strong> screen in the campaign builder, or through the Account > Sites<\/strong> screen. Learn more about how to register your domain in OptinMonster<\/a>.
In the Publish<\/strong> view of the campaign builder, be sure the domain is listed under the Websites<\/strong> section. Click Add a website<\/strong> if your domain isn’t already assigned to the campaign to select and add it.![\"Add](\"https:\/\/optinmonster.com\/wp-content\/uploads\/2020\/09\/5f6cf6500e9be381063831.gif\")
When you’re finished, click Save<\/strong>.<\/p>\n\n\n\n<\/p>\n<\/div>\n\n\n\n
<\/p>\n","protected":false},"excerpt":{"rendered":"
OptinMonster works on any website where you can add our embed code, including Webflow. In this article, you’ll learn how to integrate OptinMonster with your Webflow site. Before You Start Here are some things to know before you begin: Embed OptinMonster To locate and embed your OptinMonster Global Embed code, follow these steps: 4. Next, …<\/p>\n","protected":false},"author":7337,"comment_status":"open","ping_status":"closed","template":"","documentation\/categories":[210],"documentation\/tags":[31399,31430,31411,31418],"class_list":["post-176902","optinmonster_docs","type-optinmonster_docs","status-publish","hentry","categories-platforms"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/176902","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation"}],"about":[{"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/types\/optinmonster_docs"}],"author":[{"embeddable":true,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/users\/7337"}],"replies":[{"embeddable":true,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/comments?post=176902"}],"version-history":[{"count":29,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/176902\/revisions"}],"predecessor-version":[{"id":206349,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/176902\/revisions\/206349"}],"wp:attachment":[{"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/media?parent=176902"}],"wp:term":[{"taxonomy":"categories","embeddable":true,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/categories?post=176902"},{"taxonomy":"internal_tags","embeddable":true,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/tags?post=176902"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
- Paste your HTML Placeholder code<\/strong> click on Save & Close<\/strong>.
- Next, log into your Webflow account and open your site in the Designer<\/strong> view.<\/li>\n\n\n\n
- In the campaign builder, navigate to the Publish <\/strong>tab and copy the Campaign Embed code.
- Scroll down to the Account-wide Embed Code area. Copy the code in the box.