How to move the title and meta info above featured image on single posts

[michaelagwunobi]

HI,

On the blog page for each post, is it possible to have the title and post date above the image instead of below?

• This topic was modified 7 years, 7 months ago by Jason Bobich. Reason: Edited title to be more descriptive of issue

Topic

[Jason Bobich]

Hello,

Unfortunately, there is no feature for this, and so it will be a code customization you’ll need to make.

The file that controls this is called content.php, and is in the root directory of the parent theme. The best way to approach this customization would probably be to copy this file to your child theme. Then, within your version of the file in your child theme directory, you can move around the placement of the elements how you want.

Note that the content.php controls the output for an individual post both in the blog and on the single post. If you want your customization to apply just to single posts, you can change the name of the file to content-single.php.

Also, here’s more about template parts:

http://dev.themeblvd.com/tutorial/template-parts-framework-2-5/

[michaelagwunobi]

This is the file do you know what part exactly i need to move about?

<?php
/**
* The default template for displaying content of single posts.
*/
?>
<article id=”post-<?php the_ID(); ?>” <?php post_class(themeblvd_get_att(‘class’)); ?>>

<?php if ( has_post_format(‘gallery’) && ! themeblvd_get_att(‘epic_thumb’) ) : ?>

<div class=”featured-item featured-gallery popout”>
<?php themeblvd_gallery_slider(); ?>
</div><!– .featured-gallery (end) –>

<?php elseif ( has_post_format(‘video’) ) : ?>

<div class=”featured-item featured-video popout”>
<?php themeblvd_content_video(); ?>
</div><!– .featured-video (end) –>

<?php elseif ( has_post_format(‘audio’) && themeblvd_get_att(‘thumbs’) && ! themeblvd_get_att(‘epic_thumb’) ) : ?>

<div class=”featured-item featured-audio popout”>
<?php themeblvd_content_audio(); ?>
</div><!– .featured-audio (end) –>

<?php elseif ( has_post_format(‘quote’) && ! themeblvd_get_att(‘epic_thumb’) ) : ?>

<?php if ( themeblvd_get_att(‘show_meta’) ) : ?>
<header class=”entry-header quote”>
<div class=”meta-wrapper”>
<?php themeblvd_blog_meta(); ?>
</div><!– .meta-wrapper (end) –>
</header><!– .entry-header –>
<?php endif; ?>

<div class=”featured-item featured-quote bg-primary”>
<?php themeblvd_content_quote(); ?>
</div><!– .featured-quote (end) –>

<?php elseif ( has_post_thumbnail() && themeblvd_get_att(‘thumbs’) && ! themeblvd_get_att(‘epic_thumb’) ) : ?>

<div class=”featured-item featured-image popout standard”>
<?php themeblvd_the_post_thumbnail(); ?>
</div><!– .featured-item (end) –>

<?php endif; ?>

<?php if ( ! themeblvd_get_att(‘epic_thumb’) ) : ?>
<header class=”entry-header”>

<?php if ( ! has_post_format(‘aside’) && ! has_post_format(‘quote’) ) : ?>
<h1 class=”entry-title”>
<?php themeblvd_the_title(); ?>
</h1>
<?php endif; ?>

<?php if ( themeblvd_get_att(‘show_meta’) && ! has_post_format(‘quote’) ) : ?>
<div class=”meta-wrapper”>
<?php themeblvd_blog_meta(); ?>
</div><!– .meta-wrapper (end) –>
<?php endif; ?>

</header><!– .entry-header –>
<?php endif; ?>

<div class=”entry-content clearfix”>
<?php the_content(); ?>
<?php edit_post_link( themeblvd_get_local( ‘edit_post’ ), ‘<p class=”edit-link”>’, ‘</p>’ ); ?>
</div><!– .entry-content –>

<?php if ( is_single() ) : ?>
<?php wp_link_pages( array( ‘before’ => ‘<div class=”page-link”>’ . themeblvd_get_local(‘pages’).’: ‘, ‘after’ => ‘</div>’ ) ); ?>
<?php endif; ?>

<?php if ( themeblvd_get_att(‘show_sub_meta’) ) : ?>
<?php themeblvd_blog_sub_meta(); ?>
<?php endif; ?>

</article><!– #post-<?php the_ID(); ?> –>

[Jason Bobich]

If you take a look at the code you’re pasting. Can you see where the title and meta info are? Notice how they are both contained within <header class="entry-header"></header>?

And can you see above that where all the different kinds of media are outputted, depending on the post format, each wrapped in <div class="featured-item"></div>?

So, assuming this is how you want to set things up, you’re going to move <header class="entry-header"></header> so it outputs before any of the featured media items.

Use this as a chance to look at what you’re editing, try to learn what’s going on, and experiment with the code a bit. That’s one thing that’s great about using a child theme; if you mess up something bad, you can just delete the file, re-copy it to your child theme and start again.

[Author]

Replies