0Days
0Hours
0Mins
0Secs

Only First 100 Sales

Grab LIFETIME Access To 10 Divi PRO Plugins
Grab the deal

Divi Post Grid

Divi Post Grid module for Divi Builder allows you to display your WordPress posts in a grid layout, giving you options to customize the post types, layout, and appearance. You can control which posts are displayed, and how they’re arranged, and adjust various design aspects like the number of columns, post titles, categories, and more. This module is ideal for showcasing blog posts or custom post types in an organized and visually appealing way.

Content

This tab manages what content is displayed in the post grid, including post type, categories, sorting options, and the number of posts shown.

General

  1. Card Layout – Configures the appearance of each post within the grid.
  2. Layout – Determines how the posts are displayed on the page, either in a structured grid or a free-flowing masonry style.
  3. Posts Per Page – Sets the number of posts displayed on each page of the grid.
  4. Columns – Specifies the number of columns in which the posts are arranged.
  5. Post Gap – Adjusts the spacing between individual posts in the grid.
  6. Show New Badge – Enables a badge for newly published posts.

Query

  1. Post Type – Select the type of content to include in the query results.
  2. Include By – Defines the criteria for including posts, such as by parent post or author.
  3. Categories Filter Rule – Determines whether to filter the results by matching or excluding specified categories.
  4. Categories Filter – Allows the selection of one or more categories to filter the displayed content.
  5. Ignore Sticky Posts – Excludes sticky posts from the results if enabled.
  6. Offset – Skips a specified number of posts before starting the display of results.
  7. Exclude Current Post – Prevents the current post from being included in the results.
  8. Order – Specifies the order in which the results are displayed (ascending or descending).
  9. Order by – Chooses the criterion by which to sort the results, eg. Meta Value and ID.

Filters

  1. Show Filters – If this toggle button is enabled, a categories or tags bar will display on the post grid, allowing users to filter the displayed posts accordingly.
  2. Filter By – Allows selection of the filtering method, specifying whether to filter the results by categories or tags.
  3. All Text – Specifies the text to display for the “All” option in the filter bar, typically used to reset the filter and show all posts.

Pagination

  • Pagination – Specifies the pagination method for the post grid, with options to display no pagination, use numbered pagination, or implement infinite scrolling for continuous content loading.

Image

  1. Image Position – Determines the placement of the image within the post grid item, with options for positioning at the top, as a background, or not displaying an image.
  2. Image Size – Select the display size of the image from available options, including thumbnail, medium, medium large, large, or full size.

Title

  1. Show Title – Enables or disables the display of the post title within the grid items.
  2. Link Title – Allows the post title to be clickable, linking to the respective post or page.
  3. Open in New Tab – When enabled, this option opens the linked post title in a new browser tab.

Meta

  1. Show Meta – Enables or disables the display of metadata (like author, date, comments) for each post in the grid.
  2. Show Separator – This allows you to include a separator line between different meta items for better visual distinction.
  3. Show Post Author – Displays the name of the post’s author within the grid item.
  4. Show Post Date – Displays the publication date of the post within the grid item.
  5. Show Post Comments – Indicates whether to display the number of comments associated with the post.
  6. Show Categories – Displays the categories assigned to the post within the grid item.
  7. Show Tags – Displays the tags associated with the post within the grid item.

Excerpt

  1. Show Excerpt – Enables or disables the display of the post excerpt within the grid item.
  2. Excerpt Length – Specifies the maximum number of words or characters to be shown in the post excerpt.

Taxonomy

  1. Taxonomy Position – Determines the placement of the taxonomy terms in relation to the post content within the grid item.
  2. Select Taxonomy – This allows you to choose which taxonomy (such as categories or tags) to display for the posts in the grid.
  3. Display Max Terms – Sets the maximum number of taxonomy terms to be displayed for each post in the grid.

Readmore

  1. Show Readmore – Enables the option to display a “Readmore” link or button for posts in the grid.
  2. Readmore Text – Allows you to customize the text that appears on the “Readmore” link or button.
  3. Readmore Icon – Provides the option to select an icon to display alongside the “Readmore” text.
  4. Open in New Tab – Specifies whether the “Read More” link should open in a new browser tab when clicked.

Design

This tab allows you to customize the appearance of the grid, including the layout, spacing, styling of the post elements like title, image, categories, and other visual settings.

Content

Customizes the overall look and feel of the post grid’s content area, including the layout and arrangement of posts. This toggle allows for adjustments to be made to the individual elements within the grid, ensuring they align with the site’s design aesthetic.

Filter

Adjust the design elements related to category or tag filters displayed above the post grid. This feature provides users with an intuitive way to narrow down displayed posts based on selected categories or tags, enhancing user experience.

Pagination

Styles the pagination controls for navigating between pages of posts in the grid. Options here allow for the customization of pagination buttons, ensuring they are easily identifiable and match the site’s design.

Image

Configures the appearance of post images, including size, spacing, and alignment. This toggle ensures that images are visually appealing, contributing to a better overall layout.

Title

Designs the title of each post, allowing for customization of font, color, and size. This ensures that post titles stand out and are easy to read, which can encourage users to click through to read more.

Meta

Styles the meta information such as author, date, and comment count displayed with each post. Customization options help ensure that this information is clear and visually harmonious with the overall design.

Excerpt

Adjusts the design of the excerpt text shown for each post, including font, spacing, and length. This toggle helps in presenting snippets of content effectively, enticing users to read further.

Taxonomy

Customizes the appearance of taxonomy terms like categories or tags linked to each post. This feature allows users to quickly identify relevant topics and navigate the content more effectively.

Readmore

Styles the “Readmore” link or button, allowing for customization of color, font, and size. A well-designed “Readmore” button can significantly enhance user engagement by encouraging clicks to view full posts.

Loading...