Articles on: Advanced Customization

Display recent, specific, or category posts with Widget Code

Your blog isn’t the only place where you can display your posts. With DropInBlog’s Widget Code, you can automatically show recent posts, specific posts, or posts from selected categories on other pages of your website, such as your homepage or About page. Here, you’ll learn where to find the widget code and how to add it to your site.


Locating the Widget Code

The Widget Code section is located on the Code & Layout page of your DropInBlog admin account under the expandable Advanced Options menu.

Widget Code options

This section contains three different code options, each with two variations on how your blog content is displayed: in a card or list view.


Here’s how these widget codes work:

  • Recent Posts: This code displays the most recent posts from your blog. By default, this code is set to show three posts, but you can change that to any number of posts you want to show on your site.
  • Specific Posts: This code works like the Recent Posts code, but instead of recent posts, it displays the posts you select manually.
  • Category Posts: This code displays the most recent posts from a specific blog category.


The standard widget codes (Recent Posts, Specific Posts, Category Posts) use a card view and show the post fields you’ve set in the Output Control section (featured image, title, post info), while the list widget codes (Recent Post List, Specific Post List, Category Post List) display your posts in a list view as a list of links.


You can always change which fields are shown in both views in the Output Control section on the Settings page.

Adding the posts code to your website

In this tutorial, we’ll show you how to add the code for showing recent or specific posts on a Carrd website, but the process is similar across platforms: you add an HTML/embed code element, and paste the DropInBlog widget code into it.


Go to the platform where your site was built and, using the page editor, open the page where you want to show your DropInBlog blog posts. The image below shows a homepage of a website created with Carrd.

Next, find the option to add an element or block to the selected page, and look for the HTML/embed code option.

After you’ve added an embed section to your page, move it to where you want your blog posts to show, and in the settings of the embed section, find the option that allows you to paste code.


From here, the process of adding widget code is the same for Recent, Specific, and Category posts. You need to copy the two blocks of code from DropInBlog and paste them into the HTML/embed code element on your website.


This is how the process looks for Recent Posts.

Recent Posts widget code

Find the Recent Posts code (1) in the Widget Code section and copy the first block of code by clicking on Copy (2).

Return to your website, and paste the code into the Embed code section that you previously added.

Go back to your DropInBlog account, and copy the second block of code.

Return to your website, and paste the code into the embed section right after the first block of code you pasted earlier.

Save your changes, and open the page you edited to view the recent posts section.


This is how it looks on our Carrd website.

Recent Posts List widget code

To add a list of your recent posts, you’ll follow the steps we previously explained. The only difference is where the two code blocks are located in your DropInBlog account. Go to the Widget Code section on the Code & Layout page and copy the two code blocks (2), (3) under Recent Posts List (1).

After you save the changes, your blog posts will be shown as a list similar to the image below.

Specific Posts and Specific Posts List code

DropInBlog also allows you to choose which posts you want to show on your site. For that, you will copy the two code blocks under Specific Posts or Specific Posts List and paste them into your website.


However, unlike with recent posts, you’ll also need to add the ID of the posts you want to show on your site to your code. If you look at the image of the Specific Posts code, you’ll notice that the first block of code includes the numbers 1 and 3, which are post IDs.

You’ll find your post ID in the DropInBlog post editor. Open one of the blog posts and expand the Advanced section on the right side of the page.


At the very bottom of the section, you’ll see Post ID with the number assigned to that particular post.

To add the Specific Posts code to your website, copy the first block of code (2) under Specific Posts (1).

Return to your main website, and paste that code into the embed element. Before you copy the second block of code, change the default post IDs to the ones you selected.

Then, return to your DropInBlog account and copy the second block of code.

Paste that code into the embed element on your main website, and save your changes.


The process is the same for the Specific Posts List widget code. Just be sure to copy the code under the Specific Posts Lists section, and replace the default post IDs with the ones from your blog.

Category Posts and Category Post List

Apart from displaying recent or specific blog posts on your website, you can also use DropInBlog’s widget code to show blog posts from different categories. For this, you’ll use two blocks of code under the Category Posts and Category Posts List sections under the Widget Code section of the Code & Layout page.

The first line of code contains a default category slug: company-news. When you paste that code into your website builder, be sure to replace “company-news” with the actual slug of your blog’s category.

You’ll find the category slug on the Categories page of your DropInBlog account. Click on the kebab menu next to the category of your choice, then select Copy Slug.

After you've pasted the first block of code and adjusted the category slug, copy and paste the second block of code into your website builder. When you save and publish your changes, the blog posts from the selected category will be shown on your site in a card view.


To display your posts as a list, follow the same steps using the Category Posts List code.


You can add posts from multiple categories by adding a comma between category slugs.


That’s it! Now you can show your blog posts anywhere on your site.


For platform-specific guides, read our resources on how to display recent posts on BigCommerce, Shopify, and Thinkific.


Happy blogging!

Updated on: 21/08/2026