Post title below featured image (Icon)

[dbrinda]

I’d like to move the Post title and date below the featured image (using Icon theme). I’ve seen a few semi-related topics in the forum but usually a different Stack and trying to do the opposite of what’s I’m trying to do. As it looks like a .PHP modification, I’m hesitant to try a change without checking.

[ruenel]

Hello Dave,

Thanks for writing in!

PHP modification would require several templates in your child theme. I can give you an alternate solution instead. please add this JS code in the X > Theme Options > Global JS (http://prntscr.com/evswzb)

(function($){
  $('.archive .hentry, .blog .hentry, .single-post .hentry').each(function(){
  	var element = $(this);
  	var Entryheader = $(this).find('.entry-header');
  	var EntryFeatured = $(this).find('.entry-featured')
  	$(this).find(Entryheader).insertAfter(EntryFeatured);
  });
})(jQuery);

And then please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.archive .entry-featured,
.blog .entry-featured,
.single-post .entry-featured {
    margin-bottom: 30px;
}

We would loved to know if this has work for you. Thank you.

[dbrinda]

Thanks for the alternate solution. I got it working, but when the pages load you briefly see the title at the top before it jumps down below. Is there a way to avoid this?

[ruenel]

Hello Dave,

Because the elements were loaded first before the JS script can be run, you will see the titles before it jumps to its final position. You cannot avoid this. Remember that this is just an alternative solution. If you would like to avoid any of this, it is best that you go with the custom modifications of the templates in your child theme.

Please let us know how it goes.