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.
Before we get started, if you'd like to see how DropInBlog looks on a Carrd website, check out our demo site.
Table of Contents
Prerequisites
You'll need to create a DropInBlog account, which you can do for free with a trial subscription (no credit card required). You'll also need an existing Carrd Pro Standard (or higher) account and website.
Check out our video below to get a better overview of the process before you begin.
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 + icon to add a new element and choose Embed from the dropdown list.
Embedding Your Blog
Once the Embed element has been added, a sidebar will appear with options for editing the new element. At the top of the sidebar, ensure the Type has been set to Code. Then, scroll down the sidebar to the Code text area. Here is where we'll be adding the DropInBlog code snippets.
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:
Step 1:
<script src="https://io.dropinblog.com/embedjs/XXXXXXXXXXXXXXXXXXXX.js"></script>Step 2:
<div id="dib-posts"></div>Switch back to your Carrd website and paste the Step 1 and Step 2 code into the Code text area. Once you've added the code, hit the Done button just underneath the text area.
Next, head back over to DropInBlog again and select Settings from the main navigation. Locate the Blog URL field and paste 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. It should look something like this: https://carrd.dropindemo.com/#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.
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! ✨
FAQs
Is it a good idea to create a blog on Carrd?
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.
Does DropInBlog on Carrd get indexed by Google?
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!
