Search

How to Add Related Posts in Divi

Related posts are a valuable feature commonly found on websites and blogs. By suggesting additional content that is relevant to the current article or topic being viewed, related posts can enhance user engagement and satisfaction. For content creators, this feature helps increase user retention by encouraging visitors to explore more of their site’s content.

If you’re utilizing Divi as your website page builder, integrating related posts into your single-post layout is a breeze. This tutorial demonstrates just how straightforward the process is!

Adding Related Posts in Divi Single Post Template

Get the Single Post Layout Ready

To start, you have the option of either opening your current single post layout or crafting a new one using the Divi Builder editor. If you prefer not to start from scratch, you can download a pre-made single post layout from our website such as “Leuwi Hejo,” “Tumpak Sewu,” and “Grojogan Sewu.”

Screenshot of Leuwi Hejo single post template for Divi.
Leuwi Hejo
Screenshot of Tumpak Sewu single post template for Divi.
Tumpak Sewu
Screenshot of Grojogan Sewu single post template for Divi.
Grojogan Sewu

To load the pre-made layout, follow these steps: after downloading and extracting the file, from your WordPress dashboard, go to Divi → Theme Builder, click the grey plus button, and then assign the template to the posts.

The button to add a new custom template in Divi.

Now, click Add Custom Body → Built Custom Body opening the Divi Builder.

The button to start create the template content.

Once you’re inside the builder, click the Portability icon (up and down arrow) in the builder menu. Then, navigate to the Import tab. Load the template by clicking “No File Selected” to choose the JSON file, and once selected, click the Import Divi Builder Layout bar to complete the process.

The dialog window that shows up when importing a pre-made template in Divi.

Please wait a moment for the importing process to complete. Afterward, you can begin editing the layout.

Alternatively, if you wish to create a single post template from the ground up, you can refer to our previous article which thoroughly explains the process of creating a single post layout in Divi.

Add a Section for the Related Posts

After the single post layout is prepared, proceed by adding a new section and a single-column row. Simply click the blue plus icon located at the bottom of the post layout. This addition will accommodate the related posts section following the content.

Wireframe view in the Divi Builder editor.
Wireframe View

Now, within the newly created row, click the grey plus icon to insert a Blog module. This module will generate related posts for your current post automatically, once you customize its settings.

Customize the Blog Module Settings

Upon selecting the Blog module, the Blog Settings window will promptly open for customization. Begin by changing the blog layout to the Grid layout. Navigate to the Design tab → Layout block, and select Grid from the available options.

The settings panel to customize the Divi Blog module.

Navigate back to the Content tab, and proceed to open the Content block for further adjustments. Customize the settings to display posts with the same category as the current post, and consider reducing the post number and text to optimize space. Below are the recommended settings:

  • Post Type: Posts
  • Post Count: 3
  • Included Categories: Current Category
  • Use Post Excerpts: Yes
  • Excerpt Length: 130
Setting the post type as well as the number of posts to be shown.
Setting the excerpt length.

Save the current layout by clicking the Save button. Remember to also click the Save Changes button on the Theme Builder page after exiting the builder to apply the layout.

Clicking the Save Changes button is required to apply all the changes.

Now, when you open a post and scroll to the bottom, you’ll find three related posts within the same category as the current post.

End results of the tutorial.

Moreover, you can enhance the related posts section by including a heading. Simply add a Text module just before the Blog module displaying the related posts. With this setup, the only remaining task is to unleash your creativity and design the related posts section according to your preferences!

The Bottom Line

Related posts serve as a powerful tool for driving traffic, enhancing user engagement, and improving the overall quality of content consumption on websites and blogs. This tutorial shows you how easy it was to add related posts to your single post layout in Divi.

This page may contain affiliate links, which help support our project. Read our affiliate disclosure.
Hendri Risman

Hendri Risman

Hendri is a WordPress expert and a writer staff at WPPagebuilders. He writes solutions on how to get things fixed in WordPress a lot. Mostly without involving a plugin.
Want to save yearly expense up to $219? why not?

Leave a Comment

Save your Divi assets to the cloud and access them from anywhere.