1

I'm working on a Divi site that has two blog grids on the home page. I need to move the title and the date of each blog section to the bottom (below the blog text).

<div class="et_pb_blog_grid_wrapper">

<div class="et_pb_blog_grid clearfix et_pb_module et_pb_bg_layout_light  et_pb_blog_0" data-columns="3">
<div class="column size-1of3">

<article id="post-226" class="et_pb_post et_pb_no_thumb post-226 post type-post status-publish format-standard has-post-thumbnail hentry category-uncategorized">

<h2><a href="link">Blog Title</a></h2>

<p class="post-meta">  19 Jun 2015  </p>

blog text here....

</article></div>

<div class="column size-1of3">
<article id="post-216" class="et_pb_post et_pb_no_thumb post-216 post type-post status-publish format-standard hentry category-uncategorized">

<h2><a href="link2">Blog Title 2</a></h2>

<p class="post-meta">  20 Jun 2015  </p>

blog text here...       
        </article></div>
<div class="column size-1of3"></div></div> 
<!-- .et_pb_posts --></div>

So the header and post-meta needs to go AFTER the blog text.

Here is the site: http://abundancepracticebuilding.com

I know I need to move around PHP somewhere, but I cannot figure out in which file. I tried moving stuff around in single.php, but that only changes the full blog page. I thought index.php was the right file because it contained the header and post-meta tags, but nothing I changed showed. So I think it's in functions.php, but I can't figure out where... could be that I'm still learning detailed PHP.

I thought these sections were it:

<?php
/* Blog Meta */

$et_pb_print_selectors_post_meta = "body.home-posts #left-area .et_pb_post .post-meta, body.archive #left-area .et_pb_post .post-meta, body.search #left-area .et_pb_post .post-meta, body.single #left-area .et_pb_post .post-meta";

    et_pb_print_styles_css( array(
        array(
            'key'      => 'post_meta_height',
            'type'     => 'line-height',
            'default'  => '1',
            'selector' => $et_pb_print_selectors_post_meta,
        ),
        array(
            'key'      => 'post_meta_spacing',
            'type'     => 'letter-spacing',
            'default'  => '0',
            'selector' => $et_pb_print_selectors_post_meta,
        ),
        array(
            'key'      => 'post_meta_style',
            'type'     => 'font-style',
            'default'  => '',
            'selector' => $et_pb_print_selectors_post_meta,
        ),
    ) );

    /* Blog Title */
    $et_pb_print_selectors_post_header = "body.home-posts #left-area .et_pb_post h2, body.archive #left-area .et_pb_post h2, body.search #left-area .et_pb_post h2, body.single .et_post_meta_wrapper h1";

    et_pb_print_styles_css( array(
        array(
            'key'      => 'post_header_height',
            'type'     => 'line-height',
            'default'  => '1',
            'selector' => $et_pb_print_selectors_post_header,
        ),
        array(
            'key'      => 'post_header_spacing',
            'type'     => 'letter-spacing',
            'default'  => '0',
            'selector' => $et_pb_print_selectors_post_header,
        ),
        array(
            'key'      => 'post_header_style',
            'type'     => 'font-style',
            'default'  => '',
            'selector' => $et_pb_print_selectors_post_header,
        ),
    ) );
?>

but moving them does nothing either. Can someone point me in the right direction? I feel like I've tried everything I can think of.

Here is the code in page.php file:

<?php

get_header();

$is_page_builder_used = et_pb_is_pagebuilder_used( get_the_ID() );

?>

<div id="main-content">

<?php if ( ! $is_page_builder_used ) : ?>

<div class="container">
    <div id="content-area" class="clearfix">
        <div id="left-area">

<?php endif; ?>

        <?php while ( have_posts() ) : the_post(); ?>

            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

            <?php if ( ! $is_page_builder_used ) : ?>

                <h1 class="main_title"><?php the_title(); ?></h1>
            <?php
                $thumb = '';

                $width = (int) apply_filters( 'et_pb_index_blog_image_width', 1080 );

                $height = (int) apply_filters( 'et_pb_index_blog_image_height', 675 );
                $classtext = 'et_featured_image';
                $titletext = get_the_title();
                $thumbnail = get_thumbnail( $width, $height, $classtext, $titletext, $titletext, false, 'Blogimage' );
                $thumb = $thumbnail["thumb"];

                if ( 'on' === et_get_option( 'divi_page_thumbnails', 'false' ) && '' !== $thumb )
                print_thumbnail( $thumb, $thumbnail["use_timthumb"], $titletext, $width, $height ); 
            ?>

            <?php endif; ?>

                <div class="entry-content">
                <?php
                    the_content();

                    if ( ! $is_page_builder_used )
                        wp_link_pages( array( 'before' => '<div class="page-links">' . __( 'Pages:', 'Divi' ), 'after' => '</div>' ) );
                ?>
                </div> <!-- .entry-content -->

            <?php
                if ( ! $is_page_builder_used && comments_open() && 'on' === et_get_option( 'divi_show_pagescomments', 'false' ) ) comments_template( '', true );
            ?>

            </article> <!-- .et_pb_post -->

        <?php endwhile; ?>

<?php if ( ! $is_page_builder_used ) : ?>

        </div> <!-- #left-area -->

        <?php get_sidebar(); ?>
    </div> <!-- #content-area -->
</div> <!-- .container -->

<?php endif; ?>

</div> <!-- #main-content -->

<?php get_footer(); ?>

1 Answer 1

1

See Wordpress Template Hierarchy and figure out which page you've to modify.

Wordpress Template Hierarchy

From this figure, it's easy to see that if you want to modify your homepage, you have to modify frong-page.php. It it doesn't exist, check if a custom page template is used to serve the home page and edit that page template. If front-page.php doesn't exist and you are not using page, check home.php. If there is no home.php, the last resort is index.php.

3
  • Thank you so much for your answer, @sakibmoon; that helped me understand better! So the only files of those I have are page.php and index.php, and the only one that makes a different is page (I actually tested by removing it to confirm, and it erases everything including the blog grids). Now, my problem is: what do I actually change? I added the code above. It seems like the code that looks related is more tied to the full blog post page, not the grids. Any advice there?
    – laustewa14
    Jun 20, 2015 at 7:13
  • @laustewa14 Go to Settings -> Reading to check whether you are using static page as front page display. It seems the theme you are using use pagebuilder and I'm not familiar with the theme to give you advice on this. If you are using pagebuilder, you need to figure it out how pagebuilder generates content and modify accordingly.
    – sakibmoon
    Jun 20, 2015 at 7:20
  • Yes, it does use the static page for the front page. The theme also does use page builder. It's definitely made things difficult! Thank you for helping me so far though.
    – laustewa14
    Jun 20, 2015 at 7:29

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.