How to Display Magazine Pro Featured Image

[eluviis]

Hi, I just purchased Magazine Pro to update my website from the non-HTML5 Minimum 2. I must say, I'm thoroughly impressed. I love how 80% of my content, widgets and even custom items fell nicely in place on the new theme - which I'm busy editing locally on a development server.

I can edit this thing so quick that I'm not even going to bother with a migration from my development server. I'm simply going to manually do the edits on the live site again once I finish locally - based on what I did on the local development site. Since I can get the site 95% completed like this, I'll then I'll fine tune the CSS and other bits live after the fact.

Anyway, on to the main topic. I just have one small issue I need to resolve:

In Minimum 2.0 the featured image was automatically displayed at the top of the posts, thus it was never inserted inline with the body content itself. In Magazine Pro, the featured image is there, fine, but it doesn't display automatically at the top of posts. So right now I'm sitting with tons of posts with featured images that are NOT displayed on the posts themselves.

One solution would be to insert them into the body of posts one by one. But I don't want to have to do that manually to hundreds of posts. So, how can I get the featured image to display at the top of posts in the content column?

[DTHkelly]

This works with Magazine Pro!
http://wpsites.net/web-design/display-featured-image-before-or-after-entry-title-on-single-posts-pages/

[eluviis]

Hi @Kellylise - That was helpful thanks. I couldn't get the image size settings to work, but for the moment, I'm happy displaying a slightly shrunken down version of the full image (looks better on retina displays anyway) - but later I might want to figure out how to display a smaller version as it weighs less. I tried a few of the codes there and they all work, but I still don't have much control over the image size displayed.

Anyways, I ended up using this version of the code:

add_action( 'genesis_entry_header', 'single_post_featured_image', 15 );

function single_post_featured_image() {
if ( ! is_singular() )
		return;
$img = genesis_get_image( array( 'format' => 'html', 'size' => 'large', 'attr' => array( 'class' => 'post-image' ) ) );
printf( '<a href="%s" title="%s">%s</a>', get_permalink(), the_title_attribute( 'echo=0' ), $img );
	
}

[eluviis]

Yes, I tried to replace 'large' with full, medium and thumbnail just to see, but regardless, it always displays the full version.

[jengabbard]

I don't know if the image sizes are different between those two themes - if they are did you try regenerating thumbnails?

---

Puppy Leaks I love the Metro theme

[eluviis]

The image sizes are indeed different. What I did to test is I created a bunch of new test posts on my development site and added new images so that the new theme would resize them accordingly. The results I'm stating are based on that.

But, now that you mention it. That's pretty interesting. How do I regenerate thumbnails on older posts? @jengabbard - I had never heard of such thing being possible. But if so, that would be VERY useful.

[DTHkelly]

Free plugins can regenerate thumbnails. Example:
https://wordpress.org/plugins/force-regenerate-thumbnails/

[eluviis]

@Kellyise - Oh sweet. I try that on my development site and see who it works. Hadn't heard of this before. This is my 3rd redesign for this site in 3-4 years, and thumbnail sizes have always been a bit of a problem.

[eluviis]

@Kellylise - I found another plugin that I'm using the regenerate the thumbnails. It's great because I don't have to delete the old size if I don't want to. So far it's working flawlessly: https://wordpress.org/plugins/image-regenerate-select-crop/ - I'm planning on deleting the plugin once I do the regeneration. I'm testing it on a local installation first.

However, I do need help with one small thing:

After going through this thread and making a few changes to the code, I ended up with the code below:

/** Custom - Add the featured image section */
add_action( 'genesis_before_entry_content', 'magazine_featured_image' );
function magazine_featured_image() {
	if ( is_singular( array( 'post', 'page', 'specialty', 'event', 'quickblog', 'portfolio' ) ) && has_post_thumbnail() ){
		echo '<div id="featured-image">';
		echo get_the_post_thumbnail($thumbnail->ID, 'header');
		echo '</div>';
	}
}

It works great. However, there is one caveat. I use large images for the main image uploaded (1140px). That image gets resized down to the other sizes my theme uses.

However, while I want to keep that large image size in the files (1140px) as I use it for zooming, I don’t want to display said 1140px as the main image on the post. I want the featured image to display in my medium size of 750px wide. Currently, the 1140px image is just getting squished down to fit the main body. While that helps it look great in a retina display for example, it also makes the page heavier.

Is there any way to modify the code above to have it display the “medium” image instead of the largest image in the set?

[DTHkelly]

Some reference:
http://sridharkatakam.com/how-to-display-featured-image-in-single-posts-in-genesis/
https://surefirewebservices.com/using-the-genesis-featured-image/

[DTHkelly]

This tutorial from http://www.studiopress.community/topic/how-to-display-magazine-pro-featured-image/#post-136433
also has code to change the image size:
https://gist.githubusercontent.com/braddalton/416c4d97b2b17863732d/raw/functions.php from
http://wpsites.net/web-design/display-featured-image-before-or-after-entry-title-on-single-posts-pages/

[eluviis]

@Kellylise - Heh! Thanks for those. But, meh, I can't get them to work right. The code for those tutorials is much different then the the one I'm using with the "echo" calls.

I still tried and I replaced my original code with the one here: https://gist.githubusercontent.com/braddalton/416c4d97b2b17863732d/raw/functions.php and I added the array of custom post types I use.

That worked, and the featured images were displaying in "medium" size. But then I ended up with a problem I had originally where those featured images would be linked to the post itself. I had managed to remove that from the code I was using originally, but I can't get it to work with this new one.

Eh, I've spent way too much time on this. I'll stick with the large image scaled down. An extra 100kb per featured image on posts is not going to ruin my day. Plus it looks better on retina displays anyway. On archives, the thumbnails are displayed, so I'm good there. It's only the image above the posts, in the post themselves were the issue is. I'll leave it as is.

[Author]

Posts