How to Create a Blog on Carrd

Ana Ana
5 minute read

In this guide, we'll show you how to add a full-featured blog to your Carrd website by simply adding a few lines of code.

Carrd is a great tool for creating elegant one-page websites, but what if you want to add a blog to your site? Carrd comes with a good selection of elements for adding static content, and by integrating DropInBlog, you can extend your website functionality with a full-featured blog.

Prerequisites

You'll need to create a DropInBlog account, which you can do for free with a 14-day trial. You'll also need an existing Carrd Pro Standard (or higher) account and website.

Another prerequisite is adding your blog to the homepage of your Carrd site. This is due to how Carrd renders sub-pages, which aren't compatible.

Check out our video below to get a better overview of the process before you begin.

[video]

Adding an Embed Element

Navigate to the Carrd dashboard and select the website you'd like to edit. Choose a place for your blog section to appear and select the element immediately above by clicking directly on it. 

Use the plus icon to add a new element and choose Embed from the dropdown list.

Adding an embed element - How to create a blog on Carrd

Embedding Your Blog

Once the Embed element has been added, a sidebar will appear with options for editing the new element. Ensure the type has been set to Code and scroll down the sidebar to the Code textarea. Here is where we'll be adding the DropInBlog script.

Open a new browser window and head on over to your DropInBlog account. Select Code & Layout from the main navigation

In the Blog Code steps, copy the code shown in Step 1 and Step 2, which looks something like this:

<div id="dib-posts"></div>

<script>

var dib_id = 'XXXXXXXXXXXXXXXXXXX';

</script>

<script src="https://io.dropinblog.com/js/embed.js"></script>

Switch back to your Carrd website and paste the code into the Code text area. Once you've added the code, hit the Done button just underneath the text area.

Embed element options in Carrd, with the code added in the code text area

Next, head back over to DropInBlog again and select Settings from the main navigation. Locate the Blog URL field and add your Carrd website URL. Hit Save all changes in the DropInBlog settings and switch back to your Carrd website.

If you are putting your blog on a "Section" (page) in Carrd, be sure to have your Blog URL formatted with the full URL of that "Section" (page). It should look something like this: https://dropinblog.carrd.co/#blog

If you are using a "Section" (page) for your blog, we also suggest you clear out the "Homepage/Default title" in the SEO Settings section of your DropInBlog Settings.

DropInBlog blog URL field with "https://website.com/blog/" added

Publishing Your Blog-Enriched Website

To publish your website with these new changes, click the save (💾) icon in the top-right corner. Then click Publish Changes in the sidebar when it appears. 

After that, Carrd will publish your website changes and give you a link to view your website. Use the link to check out your shiny new blog! ✨

Final blog page with blog posts showing in the Carrd website

FAQs

Yes, it’s a great idea to create a blog on Carrd because it’s a pretty easy way to take your Carrd site to the next level.

Carrd is known for allowing you to create one-page websites that are pretty good looking but also pretty simple. Therefore, adding a blog functionality like DropInBlog can really elevate your site and give you more space to communicate with readers and bring in traffic.

Of course! Just the action of adding a blog to your site will help you get indexed on Google, but that’s not all. DropInBlog has an intelligent tool called the SEO Analyzer that gives you immediate feedback on how to optimize your content in the form of actionable tips.

For example, these include keyword density, image alt tags, etc. This way, you won’t have to worry or question if your content is optimized enough to appear on SERPs.

You can find more in-depth info on the SEO Analyzer in our article on DropInBlog and search rankings.

Tips for Using Carrd

Due to Carrd's selection of very well-designed themes and starting points, your blog will automatically inherit those styles and look gorgeous right out of the box! 

However, if you want to add some custom styling, you can use standard CSS to adjust the presentation. Just use a new embed element and add CSS within the <style>…</style> tags to begin customizing the design of your blog.

If you'd like any help with the setup of your new Carrd blog or have questions on how to use any of the DropInBlog features, just shoot us a message. We're standing by, waiting to help you get the most out of your new Carrd blog. Enjoy!

Get started embedding a blog into your website right now

Try It For Free