{"id":98685,"date":"2020-11-04T12:52:38","date_gmt":"2020-11-04T17:52:38","guid":{"rendered":"https:\/\/optinmonster.com?p=98685&#038;post_type=optinmonster_docs&#038;preview_id=98685"},"modified":"2025-07-31T14:03:07","modified_gmt":"2025-07-31T18:03:07","slug":"how-to-integrate-optinmonster-with-drupal-8","status":"publish","type":"optinmonster_docs","link":"https:\/\/optinmonster.com\/docs\/how-to-integrate-optinmonster-with-drupal-8\/","title":{"rendered":"How to Integrate OptinMonster with Drupal 8"},"content":{"rendered":"\n<p>OptinMonster works on any website where you can add our embed code, including Drupal 8.<\/p>\n\n\n\n<p>In this article, you\u2019ll learn how to integrate OptinMonster with Drupal 8.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Before You Start<\/h2>\n\n\n\n<p>Here are some things to know before you begin:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>This guide is specifically for <strong>Drupal 8<\/strong>. We also have a <a href=\"https:\/\/optinmonster.com\/docs\/how-to-integrate-optinmonster-with-drupal\/\" target=\"_blank\" rel=\"noopener\" title=\"\">guide for Drupal 7<\/a>.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><span id=\"Embed_SiteWide\" class=\"ez-toc-section\"><\/span>Integrate with Drupal<\/h2>\n\n\n\n<p>After you\u2019ve&nbsp;<a href=\"https:\/\/optinmonster.com\/docs\/creating-your-first-optin\/\" target=\"_blank\" rel=\"noopener\" title=\"\">created a campaign<\/a> in OptinMonster, you\u2019ll want to embed it on your Drupal site.<\/p>\n\n\n\n<p>To add the embed code to your Drupal site, follow these steps:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>In the OptinMonster campaign builder, navigate to the&nbsp;<strong>Publish<\/strong> view and copy the Global Embed code.<br><img decoding=\"async\" width=\"620\" height=\"342\" class=\"alignnone size-full wp-image-151149\" src=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2020\/09\/publish-screen-copy-embed-code.jpg\" alt=\"Copy the embed code for your OptinMonster campaign from the Publish screen of the campaign builder.\" srcset=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2020\/09\/publish-screen-copy-embed-code.jpg 620w, https:\/\/optinmonster.com\/wp-content\/uploads\/2020\/09\/publish-screen-copy-embed-code-300x165.jpg 300w\" sizes=\"(max-width: 620px) 100vw, 620px\" \/><\/li>\n\n\n\n<li>Next, log into your Drupal site and select the&nbsp;<strong>Structure<\/strong> link from the admin menu.<br><img decoding=\"async\" width=\"640\" height=\"288\" class=\"wp-image-98688 size-large alignnone\" src=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_1-1024x461.png\" alt=\"Click on Structure\" srcset=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_1-1024x461.png 1024w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_1-300x135.png 300w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_1-768x345.png 768w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_1.png 1365w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/li>\n\n\n\n<li>Select <strong>Block Layout<\/strong>.<br><img decoding=\"async\" width=\"640\" height=\"296\" class=\"wp-image-98689 size-large alignnone\" src=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_2-1024x474.png\" alt=\"Click Block Layout\" srcset=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_2-1024x474.png 1024w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_2-300x139.png 300w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_2-768x356.png 768w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_2.png 1365w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/li>\n\n\n\n<li>Select the&nbsp;<strong>Custom Block Library<\/strong> tab.<br><img decoding=\"async\" width=\"640\" height=\"293\" class=\"wp-image-98690 size-large alignnone\" src=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_3-1024x469.png\" alt=\"Click Custom Block Library\" srcset=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_3-1024x469.png 1024w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_3-300x137.png 300w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_3-768x352.png 768w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_3.png 1365w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/li>\n\n\n\n<li>Next, select the&nbsp;<strong>Add custom block<\/strong> button.<br><img decoding=\"async\" width=\"640\" height=\"293\" class=\"size-large wp-image-98691 alignnone\" src=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_4-1024x469.png\" alt=\"Click Add Custom Block\" srcset=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_4-1024x469.png 1024w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_4-300x137.png 300w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_4-768x352.png 768w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_4.png 1365w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/li>\n\n\n\n<li>On the Add Custom Block screen you&#8217;ll complete the following steps:\n<ol class=\"wp-block-list\">\n<li>Enter a&nbsp;<strong>Block description<\/strong>&nbsp;to easily identify this campaign&#8217;s block in Drupal.<\/li>\n\n\n\n<li>Select&nbsp;<strong>Full HTML<\/strong> from the text format dropdown.<\/li>\n\n\n\n<li>Select the <strong>Source icon<\/strong> in the Body toolbar.<br><img decoding=\"async\" width=\"640\" height=\"271\" class=\"aligncenter wp-image-98693 size-large\" src=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_5-1024x434.png\" alt=\"Add a title, change the text format, select source and paste your code. Then save your custom block. \" srcset=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_5-1024x434.png 1024w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_5-300x127.png 300w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_5-768x325.png 768w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_5.png 1365w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/li>\n<\/ol>\n<\/li>\n\n\n\n<li>Finally, paste the OptinMonster embed into the body of the custom block.<\/li>\n<\/ol>\n\n\n\n<div class=\"alert-box alert-yellow\">\n<p class=\"alert-box-title\">Important:<\/p>\n\n\n\n<p>Please be careful to follow the steps above in order. If you paste the embed code BEFORE changing the Text Format or without choosing Source, the script itself will display on your live site.<\/p>\n\n\n\n<p class=\"is-style-arrow-link has-link-color\"><\/p>\n<\/div>\n\n\n\n<ol start=\"8\" class=\"wp-block-list\">\n<li>When you&#8217;re finished, click&nbsp;<strong>Save<\/strong>.<\/li>\n\n\n\n<li>You&#8217;ll be returned to the list view of the Custom Block Library. Click the&nbsp;<strong>Block Layout<\/strong> tab.<\/li>\n\n\n\n<li><strong>Locate a Footer region<\/strong> and click the grey&nbsp;<strong>Place Block<\/strong> button.<br><img decoding=\"async\" width=\"640\" height=\"296\" class=\"wp-image-98694 size-large alignnone\" src=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_6-1024x474.png\" alt=\"Place the Custom Block in a Footer region\" srcset=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_6-1024x474.png 1024w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_6-300x139.png 300w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_6-768x355.png 768w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_6.png 1364w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/li>\n<\/ol>\n\n\n\n<div class=\"alert-box alert-yellow\">\n<p class=\"alert-box-title\">Note:<\/p>\n\n\n\n<p>Your theme may have several footer regions, you can choose any one of them.<\/p>\n\n\n\n<p class=\"is-style-arrow-link has-link-color\"><\/p>\n<\/div>\n\n\n\n<ol start=\"11\" class=\"wp-block-list\">\n<li>A modal window will appear, select the <strong>Place Block<\/strong> button next to the custom block you previously created.<br><img decoding=\"async\" width=\"640\" height=\"294\" class=\"size-large wp-image-98695 alignnone\" src=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_7-1024x470.png\" alt=\"Click the grey Place Block button next to the custom block you previously created.\" srcset=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_7-1024x470.png 1024w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_7-300x138.png 300w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_7-768x352.png 768w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_7.png 1360w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/li>\n\n\n\n<li>Add a Title for your custom block so you can easily identify it in the future, then be sure the <strong>Display title<\/strong> option is disabled.<br><img decoding=\"async\" width=\"640\" height=\"293\" class=\"aligncenter size-large wp-image-98696\" src=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_8-1024x469.png\" alt=\"Give the custom block a title, and do not display the title. Click Save.\" srcset=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_8-1024x469.png 1024w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_8-300x137.png 300w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_8-768x352.png 768w, https:\/\/optinmonster.com\/wp-content\/uploads\/2016\/09\/OM_Drupal_8.png 1364w\" sizes=\"(max-width: 640px) 100vw, 640px\" \/><\/li>\n\n\n\n<li>When you&#8217;re finished, click&nbsp;<strong>Save Block<\/strong>.<\/li>\n<\/ol>\n\n\n\n\n\n<h2 class=\"wp-block-heading\" id=\"faq\">Troubleshooting<\/h2>\n\n\n\n<h5 class=\"wp-block-heading\">What domain do I enter when creating my campaign?<\/h5>\n\n\n\n<p>You&#8217;ll want to add the domain that appears in the address bar when you view your website.<\/p>\n\n\n\n<p>If you haven&#8217;t registered the domain you want to use in your OptinMonster account yet, you can&nbsp;add the site through the&nbsp;<strong>Publish<\/strong> screen in the campaign builder, or through the&nbsp;<strong>Account &gt; Sites<\/strong> screen. Learn more about <a href=\"https:\/\/optinmonster.com\/docs\/how-to-add-edit-or-delete-a-website-in-optinmonster\/\" target=\"_blank\" rel=\"noopener\" title=\"\">how to register your domain in OptinMonster<\/a>.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>In the <strong>Publish<\/strong> view of the campaign builder, be sure the domain is listed under the&nbsp;<strong>Websites<\/strong> section. Click&nbsp;<strong>Add a website<\/strong> if your domain isn&#8217;t already assigned to the campaign to select and add it.<br><img decoding=\"async\" width=\"850\" height=\"653\" class=\"alignnone size-full wp-image-151150\" src=\"https:\/\/optinmonster.com\/wp-content\/uploads\/2020\/09\/5f6cf6500e9be381063831.gif\" alt=\"Add site to the Publish screen for your OptinMonster campaign.\"><\/li>\n\n\n\n<li>When you&#8217;re finished, click <strong>Save<\/strong>.<\/li>\n<\/ol>\n","protected":false},"excerpt":{"rendered":"<p>OptinMonster works on any website where you can add our embed code, including Drupal 8. In this article, you\u2019ll learn how to integrate OptinMonster with Drupal 8. Before You Start Here are some things to know before you begin: Integrate with Drupal After you\u2019ve&nbsp;created a campaign in OptinMonster, you\u2019ll want to embed it on your&nbsp;&hellip;<\/p>\n","protected":false},"author":4657,"comment_status":"open","ping_status":"closed","template":"","documentation\/categories":[210],"documentation\/tags":[31399,31430,31411,31418],"class_list":["post-98685","optinmonster_docs","type-optinmonster_docs","status-publish","hentry","categories-platforms"],"acf":[],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/98685","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\/4657"}],"replies":[{"embeddable":true,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/comments?post=98685"}],"version-history":[{"count":9,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/98685\/revisions"}],"predecessor-version":[{"id":205904,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/98685\/revisions\/205904"}],"wp:attachment":[{"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/media?parent=98685"}],"wp:term":[{"taxonomy":"categories","embeddable":true,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/categories?post=98685"},{"taxonomy":"internal_tags","embeddable":true,"href":"https:\/\/optinmonster.com\/wp-json\/wp\/v2\/documentation\/tags?post=98685"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}