As part of purchasing the Elemin theme I get support from Themify and I asked for CSS help on their forum. It’s a good benefit and part of the package.

I was able to get two full posts on the home page and leave the rest as excerpts but the CSS was baffling me. I couldn’t work out how to set the post-meta to format as I wanted it to.

My CSS is at best “not too good” and I was messing up some inherited properties.

The response was good: why not just wrap the posts in divs with the correct class and let the default style.css do the rest? That way the generated output would look kind of like this:

<div class="list-post">
 [post 1]
 [post 2]
</div>
<div class="grid2">
 [post 3]
 [post 4]
 [post 5]
 [post 6]
 [post 7]
 [post 8]
</div>

That was a real light bulb moment for me. I know I can do that by making a copy of the elemin/index.php file into my child theme directory and making modifications.

So that’s exactly what I did and replaced the regular get_template_part() line with this code:

<!-- child mods -->
<?php if( is_home() and $post_layout == "grid2" and $paged < 2 ) {
   $mh_post_count++;
   switch($mh_post_count) {
      case 1: ?>
         </div><!--/loops-wrapper list-post-->
         <div class="loops-wrapper">
         <div class="list-post">
         <?php get_template_part( 'includes/loop','index');
         break;
      case 3: ?>
         </div><!-- /list-post -->
         <div class="grid2">
         <?php get_template_part( 'includes/loop','index');
         break;
      case get_option('posts_per_page'):
         get_template_part( 'includes/loop','index'); ?>
         </div><!-- /grid2 -->
         <?php break;
      default:
         get_template_part( 'includes/loop','index');
   }
} else {
   get_template_part( 'includes/loop','index');
} ?>
<!-- /child mods -->

I also had to put in a conditional right before get_sidebar() to properly close off the last div. Changing the excerpt to the post content is still handled in the child theme functions.php file.

It all works and I’m now using it my child theme. This only gets applied when I select the two column excerpts page format. Switching to anything else restores the default Elemin formatting.

But you copied and edited a theme file!

Yes, I did and I’m thoroughly ashamed of myself.

There are hooks into different parts of the WordPress loop so that I should be able to put into my child theme’s functions.php file the logic to figure out where in the loop we are and insert the HTML as needed.

The logic is dependent on if we’re at post #1, post #3, and the last post defined by the posts_per_page option. So all I need to do is add the appropriate add_filter() or add_action() to my functions.php file. I already add to the_content using a filter for before and after.

But I’m not quite there yet. I’m pretty sure that I can pull it off with something like add_action( ‘the_post’, ‘insert_before_posts’ ) but I’m still doping it out.

I’m also having a great time doing it too which is really the point of all this effort. Now if only that WordPress Bible would get here sooner…