Adding the "Figure" code to the top of pages and posts

Hi there,

Just on the off chance you are bored and looking for something to think about on Christmas Day…

The web site I am using your excellent theme on is :

I’ve found myself with some time at work to come back to our site and try and improve the sites content etc… cos I’m lazy I haven’t put much nice/useful content into the site… :slight_smile:

Anyway, I’m going to try and work out how to add the “figure” code that you have at the top of the posts when they are listed.

To the top of a regular page and an open post.


For a page…
<div id=“primary” class=“no-margin-left”>
<div id=“content”><section id=“post-7986” class=“post-7986 page type-page status-publish hentry en-US”>
<header class=“entry-header”>
<h2 class=“entry-title”>Fukuoka </h2><!-- .entry-title --></header>

Between <article> and <header class=“entry-header”> I’d like to have each page or posts featured image be at the top of each page and post. Like the way you use the <figure> code below.

<figure class=“post-featured-image”></figure>

Just so as I can stop using sliders and have a better looking image at the top of each page/post.

If you are at a loose end please help me out! :slight_smile:
I’m going to try and figure it out, but it’ll take me a while. If I get anywhere with it I’ll post it back here as it might be useful to someone else.

I’m thinking that the code that needs to be changed is in the “travelify_main_container” function.

Speaking to myself as all other sensible people are on holiday on Christmas day.

So I’ve found the functions file content_extensions.php

There are 7 different functions:








Do you know which of the above functions is run on this page?
(I’m guessing travelify_theloop_for_template_blog_image_large)
(I’m guessing travelify_theloop_for_template_blog_full_content)
(Not sure…)

I’m kindof answering my own questions as I go along.
By the way, your code is very easy to follow, well done. :slight_smile:


This is code used for featured images in blog page:

if( has_post_thumbnail() ) {
$image = '';
		$title_attribute = apply_filters( 'the_title', get_the_title( $post->ID ) );
		$image .= '<figure class="post-featured-image">';
	$image .= '<a href="' . get_permalink() . '" title="'.the_title( '', '', false ).'">';
	$image .= get_the_post_thumbnail( $post->ID, 'featured', array( 'title' => esc_attr( $title_attribute ), 'alt' => esc_attr( $title_attribute ) ) ).'</a>';
	$image .= '</figure>';
	echo $image;

You can add it anywhere you want, even on your static pages. For this you need to add above mentioned code inside travelify_theloop_for_page function on the same content-extensions.php file. I think you might want to add featured images above this code

			<header class="entry-header">
    			<h2 class="entry-title">
    				<?php the_title(); ?>
    			</h2><!-- .entry-title -->

Just play around to see what works for you.

Let me know if this is what you were looking for.