How to Create a Blog on Instapage

Instapage is a flexible landing page builder that supports features such as A/B testing and dynamic text replacement. Using its intuitive page builder, you can create highly personalized websites, but not blogs. Instapage doesn’t have a built-in blogging tool, so you’ll need an embeddable solution to create a blog. In this guide, you’ll learn how to create a blog on Instapage by integrating DropInBlog with your Instapage account.

TL;DR: Adding a Blog to Instapage with DropInBlog

• Create a blank page in Instapage.

• Copy the Blog Script and Blog Container code from DropInBlog’s Code & Layout page and paste it into your Instapage page.

• Publish your page.

• Verify the Instapage-DropInBlog integration.

How to Create a Blog on Instapage with DropInBlog

Adding a blog to Instapage with DropInBlog is a three-step process. You’ll create a page, add the blog code from your DropInBlog account, and verify the integration. Once your DropInBlog-powered blog is live, you’ll be adding new blog posts from the Posts page of your DropInBlog account. Everything you create in DropInBlog will automatically show up on your Instapage site.

Now let’s go through the integration steps one by one.

Prerequisites

A DropInBlog account and a subscription to (at least) the Instapage Create plan are all it takes to start building your blog with Instapage. Any level of DropInBlog account will do.

Even if you don’t have a paid DropInBlog account yet, you can still test it: just register for the free trial. 

Step 1: Create a New Page

Click the Landing Pages option in the left sidebar. After that, you’ll see a Create Page button on the right.

Selecting this option will take you to the layout templates screen.

Here, you should select Start from Blank Page and give your page a name.

“Blog” is generally what most people go with. When you check your dashboard, you’ll see your newly created page under the name you’ve given it.

Step 2: Add the Embed Codes

You have your blog page created. Now, it’s time to add the embed code from your DropInBlog account. Although any mention of code may seem daunting if you’re a beginner, don’t worry – it’s as straightforward as it gets.

In the Instapage editor, select the HTML (<>) icon at the bottom of the left menu.

You’ll now see an HTML box has been added to your page. Drag the HTML box to the desired location on the page, and increase its width to match the page. It’ll look something like this:

Double-click the HTML element to edit it.

Now you’re ready to copy the embed codes from DropInBlog. Open a new tab in your browser, log in to your DropInBlog account, and click Code & Layout. This will lead you to the page with your personal blog embed code. You need to copy the code from both Blog Script and Blog Container and paste it into the HTML block you’ve just added to your blog page on Instapage.

Once you paste the blog embed code, you’ll see something like this:

Now, click on Save in the navigation bar at the top-right of the page, then exit the builder.

After you exit the page builder, you’ll see a preview of what your blog looks like: 

Next, you need to click Publish Page, after which you’ll see four available options:

1. Publish through a custom domain. 

2. Publish through WordPress. 

3. Publish through Drupal.

4. Publish via pagedemo.co for testing purposes.

Choose your preferred method, or, if you’re just testing the integration, use the pagedemo option. After you finish up the publishing process, you can head over to your published blog page to see it in its full glory.

Step 3: Verify the Integration

Go to your DropInBlog account and visit the Code & Layout page. Here you’ll find the Verify Integration button.

You may be asked to add the link to your blog page, which you’ll find in the Landing Pages tab in your Instapage account under the page’s name.

The next thing you’ll see in your DropInBlog account is a green box that will inform you that your blog is live.

And voilà! You’re all set to embark on your blogging journey.

Optional: Display Recent Posts on Other Instapage Pages

Your Instapage blog is all set, but in case you want to dive deeper into DropInBlog and make use of the other powerful features it offers, you can head over to the Code & Layout page and add some more functionalities. The ones that we’ll show you here are optional but highly recommended.

To display a preview of your recent blog posts on any of your landing pages, you can simply add the DropInBlog recent posts widget. 

To do that, go to the Code & Layout page in DropInBlog. Under Advanced, you’ll find the Widget Code section. 

Under Recent Posts, you’ll see two lines of code under Script and Container.

You can change the number of recent posts according to your own liking. It can be any number that makes sense to you and best fits your page.

Copy these two snippets of code and go to your Instapage landing page. The procedure is the same as the one we used before; click on your landing page, click Edit Design, scroll down, and choose the HTML block (<>). 

Drag the box and place it wherever you want your recent blog posts to show. Adjust the size of the box to your liking, and paste the two snippets of code from above.

After you’ve pasted the code, click Update, Confirm, and then you can Exit Builder. Open your page to see the changes. There might be some additional adjustments you need to make if your recent blog posts overlap with other elements on your page, but this is all it takes to add the recent posts widget.

If you’re adding the widget while creating a landing page for the first time, the procedure will be the same as what we did earlier when we built our blog page. So, after clicking Done, you’ll need to click Save, Exit Builder, Publish Page, and, lastly, choose to either publish through your custom domain or publish for testing purposes.

Tips for Using DropInBlog with Instapage

While playing around with your new blog, you’ll definitely want to explore the DropInBlog SEO Analyzer, which draws on SEO best practices to evaluate your blog posts before publishing. It also gives you tips on how to improve your SEO score and achieve higher search engine rankings – which is what we all want.

DropInBlog also allows you to automate posting by scheduling your posts for any time in the future. Furthermore, your blog inherits the already existing styles of your landing page template, so it will match your design aesthetic right out of the box. No more endless and time-consuming design tweaking to get the pages to match.

However, if you want, you can customize the design of your blog. One way to do that is, again, by adding a new HTML block and adding your own CSS code between <style></style> tags.

Blogging on Instapage with DropInBlog

In short, there’s a ton you can do with DropInBlog. It effortlessly fills the gaps and gives you the ability to blog like a pro. If you need any help with the integration process or you just have some general questions, please do not hesitate to contact us – we’ll be more than glad to help.