> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://docs.dropinblog.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# DropInBlog integration guide for Instapage

To add DropInBlog to your Instapage site, you’ll need to create a blank page in Instapage first, then add the blog code from your DropInBlog account. After you’ve verified the integration, you can start adding new content to your Instapage blog, which you’ll do from DropInBlog.
## Prerequisites
Before you start the integration process, make sure you have the following:
* A paid Instapage account (Create plan or higher)
* A paid DropInBlog account 
## Integration steps
With DropInBlog, you can add a blog to Instapage by following these steps:
1. [Create a new page in Instapage](#3-step-1-create-a-new-page-in-instapage).
2. [Add the HTML block to your page](#3-step-2-add-the-html-block-to-your-page).
3. [Add your blog code from DropInBlog](#3-step-3-add-your-blog-code-from-dropinblog).
4. [Publish your new page](#3-step-4-publish-your-new-page).
5. [Verify the integration](#3-step-5-verify-the-integration).
### Step 1: Create a new page in Instapage
To create a new page from your Instapage account, select the **Landing Pages** tab from the menu on the left, then click on the **Create Page** button at the top right.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/create-landing-page-in-instapa_1ky78k3.png)
On the following screen, select the option to start with a blank page.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/start-from-blank-page-instapag_10lc5i.png)
Optionally, you can use Instablocks to add navigation to your new page. That way, your blog visitors will be able to easily view other site pages. To add navigation, select one of the menus from the **Top Bar** section and customize its design and links.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/top-bar-sections-instapage_yp30dl.png)
### Step 2: Add the HTML block to your page
Your next step is to add the HTML block to your page by dragging and dropping the **HTML icon** inside the block container.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/add-html-block-to-instapage-pa_1rn0842.png)
Then resize the block to match the container width, as shown in the screenshot below.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/resize-html-block_1ecej3v.png)
### Step 3: Add your blog code from DropInBlog
Next, go to the **Code & Layout** page of your DropInBlog account and **copy** the **code** under **Blog Script**.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/copy-blog-script-code-from-dro_p1lv4m.png)
Return to Instapage, double-click the HTML element to edit it, and **paste** the **code** you just copied.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/paste-blog-script-code-inside-_ugiyof.png)
You’ll need to return to DropInBlog again to copy the second line of code under **Blog Container**. You’ll do that by clicking on the **Copy** button to the right of the blog container code.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/copy-blog-container-code-from-_qp2hsq.png)
After that, go back to the Instapage editor, hit Enter to start a new line, and **paste** the **blog container** **code**.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/add-blog-container-code-to-ins_27ajh6.png)
Click anywhere outside of the HTML block, and while you’re still in the page editor, click on the **pencil icon** to change the default “My new page” title to “Blog” or something similar.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/edit-page-title-in-instapage_qy2kzs.png)
### Step 4: Publish your new page
To publish your changes, click on the **Publish** button in the top-right of the page editor.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/publish-changes-in-instapage_vl2b80.png)
This will take you outside the page builder and open a slide-out menu with **Publishing** options. Demo pages are intended for testing purposes only and will eventually be unpublished. If you plan to add a blog to your Instapage site permanently, choose one of the other three options. We’ll select **Custom Domain**.

Choose your domain from the dropdown (1), then type “blog” (or whatever you want to call this page) under directory (2). Lastly, click on the **Publish** button (3) to save the changes.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/custom-domain-publish-instapag_1b5w00v.png)
Before you proceed to the final step of the integration, use the **link** or the **View Page** button to visit your new Instapage blog.
### Step 5: Verify the integration
The last step of the integration happens inside your DropInBlog account. Open the Code & Layout page, click on the **Verify Integration** button, and if prompted, paste the link to your Instapage blog page into DropInBlog.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/verify-instapage-dropinblog-in_o2e7dc.png)
If everything is set up properly, you’ll see a green box with a message that your blog is live.
![](https://storage.crisp.chat/users/helpdesk/website/-/1/3/f/1/13f179d913687a00/blog-integration-successful-me_1dzao59.png)
Now you can start adding new content from the **Posts** tab in your DropInBlog account.
## Troubleshooting
Your Instapage blog should be live at this point. If you don’t see it for some reason, check the common reasons why your blog may not show up properly on your site:
* You’ve pasted only the blog script or the blog container code to the HTML block in Instapage. You need both lines of code for the integration to work.
* You didn’t publish your blog page after adding your blog code.
* You’ve set HTML block visibility to hidden.
## Next steps
Once you add a blog to your Instapage site, we recommend that you explore DropInBlog’s features and learn how to:
* [__Get clean URLs with the Cloudflare integration__](https://docs.dropinblog.com/en/article/connecting-cloudflare-1sa3ffg/)
* [__Generate blog post title ideas and outlines with Blog Pilot™__](https://docs.dropinblog.com/en/article/how-to-use-blog-pilot-to-generate-blog-topics-and-outlines-2lc0jm/)
* [__Create reusable pieces of content using Smart Snippets™__](https://docs.dropinblog.com/en/article/how-to-use-smart-snippets-on-your-blog-1gu66ab/)
* [__Enable the text-to-speech option for your blog with Blog Voice AI™__](https://docs.dropinblog.com/en/article/using-the-blog-voice-ai-feature-1dbgixp/)
* [__Customize your blog’s design__](https://docs.dropinblog.com/en/article/changing-your-blogs-font-colors-and-layout-z2z3jr/)