Divi blog post meta data

The Divi theme is a popular WordPress theme that allows you to create beautiful and customizable websites. One of the key elements of a blog post is the meta data, which includes information such as the author, date, and categories. In this response, I will explain how you can display the Divi blog post meta data using WordPress functions and the Divi theme’s built-in hooks.

To display the Divi blog post meta data, you can use the et_divi_post_meta_wrapper() function provided by the Divi theme. This function outputs the meta data in a styled wrapper div. You can call this function within the WordPress loop to display the meta data for each blog post.

Here’s an example code snippet that demonstrates how to display the Divi blog post meta data:

<?php
// Inside the WordPress loop
if ( have_posts() ) {
    while ( have_posts() ) {
        the_post();
        // Output the post content
        the_content();

        // Display the Divi blog post meta data
        if ( function_exists( 'et_divi_post_meta_wrapper' ) ) {
            echo et_divi_post_meta_wrapper();
        }
    }
}
?>

In the above code, we first check if there are any posts available using the have_posts() function. Then, within the loop, we call the the_post() function to set up the current post. After that, we output the post content using the the_content() function.

Finally, we check if the et_divi_post_meta_wrapper() function exists (to ensure the Divi theme is active) and then call it to display the blog post meta data.

By using this code snippet, you can easily display the Divi blog post meta data on your WordPress website.

Examples

Example 1: Displaying the Author Name in Divi Blog Post Meta Data

This use case demonstrates how to display the author name in the Divi blog post meta data section.

function wpsnippets_display_author_name() {
    $author_name = get_the_author();
    echo '<span class="meta-author">' . $author_name . '</span>';
}
add_action( 'et_pb_post_meta', 'wpsnippets_display_author_name', 10, 1 );

The code example above creates a custom function wpsnippets_display_author_name() that retrieves the author name using the get_the_author() WordPress function. It then echoes the author name wrapped in a <span> element with a CSS class of meta-author. The function is hooked to the et_pb_post_meta action in Divi, ensuring it is displayed in the blog post meta data section.

Example 2: Adding the Date to Divi Blog Post Meta Data

This use case demonstrates how to add the date to the Divi blog post meta data section.

function wpsnippets_add_date_to_meta() {
    $post_date = get_the_date();
    echo '<span class="meta-date">' . $post_date . '</span>';
}
add_action( 'et_pb_post_meta', 'wpsnippets_add_date_to_meta', 20, 1 );

In this code example, the custom function wpsnippets_add_date_to_meta() retrieves the post date using the get_the_date() WordPress function. It then echoes the date wrapped in a <span> element with a CSS class of meta-date. The function is hooked to the et_pb_post_meta action, ensuring it is added to the blog post meta data section in Divi.

Example 3: Including Categories in Divi Blog Post Meta Data

This use case demonstrates how to include categories in the Divi blog post meta data section.

function wpsnippets_include_categories_in_meta() {
    $categories = get_the_category();
    if ( ! empty( $categories ) ) {
        echo '<span class="meta-categories">';
        foreach ( $categories as $category ) {
            echo '<a href="' . esc_url( get_category_link( $category->term_id ) ) . '">' . esc_html( $category->name ) . '</a>';
        }
        echo '</span>';
    }
}
add_action( 'et_pb_post_meta', 'wpsnippets_include_categories_in_meta', 30, 1 );

In this code example, the custom function wpsnippets_include_categories_in_meta() retrieves the categories associated with the current post using the get_the_category() WordPress function. It then loops through each category and echoes a link to the category archive page, using esc_url() and esc_html() for proper sanitization. The categories are wrapped in a <span> element with a CSS class of meta-categories. The function is hooked to the et_pb_post_meta action, ensuring the categories are included in the blog post meta data section in Divi.