How to display featured image on post [metro theme]

Community Forums Forums Design Tips and Tricks How to display featured image on post [metro theme]

This topic is: not resolved

This topic contains 4 replies, has 2 voices, and was last updated by  anitac 11 months, 1 week ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #40376

    ratracegrad
    Participant
    Post count: 10

    Hello you wonderful people that are about to help me out,

    I am using the metro theme. I have a featured image on all of my posts. On my home page the featured image shows as a thumbnail for all the posts. When I open a post I want the full size featured image to show centered above the first line of text in the post. But alas when I open the post I get no image displayed. Since a picture is worth a thousand words, any way to get the featured image to display on my posts when they are opened up?

    http://www.ratracegrad.com

    • This topic was modified 11 months, 1 week ago by  ratracegrad.
    • This topic was modified 11 months, 1 week ago by  ratracegrad.
    https://www.ratracegrad.com
    #40395

    anitac
    Participant
    Post count: 6402

    Brad Dalton shared a code on here somewhere. I copied it to Notepad. try this:

    add_action( 'genesis_before_post_content', 'wpsites_before_post_content_image', 5 );
    function wpsites_before_post_content_image() {
     
    if ( is_page() ) return;
     
    if ( $image = genesis_get_image( 'format=url&size=post-image' ) ) {
    printf( '<a href="%s" rel="bookmark"><img class="post-photo" src="%s" alt="%s" /></a>', get_permalink(), $image, the_title_attribute( 'echo=0' ) );
    }
     
    }

    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #40402

    ratracegrad
    Participant
    Post count: 10

    Anita,

     

    Thanks for sharing. That did show the featured image on the posts but then it introduced a new problem. On my home page that has a list of all my posts as excerpts, it now shows the featured image as a thumbnail and now the full size.  I don’t want the featured image shown full size on home page that lists all my posts. Any suggestions on some magic code that will remove it from the home page?

    While I wait for your magic code I am removing the previous code.

    Thanks kindly.

     

    Jennifer

    #40404

    anitac
    Participant
    Post count: 6402

    Ok, I hadn’t tried Brad’s before. Remove that. I have another code I’ve personally use. I’ll post the text link here in a few minutes. I need to find it.


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #40407

    anitac
    Participant
    Post count: 6402

    The source of the follow instructions came from this link – Source: http://webonanza.com/how-to-add-featured-images-to-blog-posts-in-the-genesis-framework-wordpress/ – however, the link hasn’t work in over 6 months. Good thing I copied it!

    This is how you do it:

    1. Navigate towards your “functions.php” file under the Appearance – Editor menu in the left hand menu.
    2. Make a local copy of the text in your functions.php file. Just copy and paste all of the text in the file and put it into a local text file on your computer.
    3. Add this piece of code onto the end of your functions.php file to add support for thumbnails (the “100, 100,” part sets the default size):

    add_theme_support( 'post-thumbnails' );
    /** Add new image sizes **/
    add_image_size('grid-thumbnail', 100, 100, TRUE);

    There are several different ways to display the featured image within the post. You can choose to show a smaller thumbnail and have the text float around the image, or you may want to display a more “full-sized” version of your image with it’s width matching your post column width.

    First option: how to display a “full-size” version in a blog post:

    Add this piece of code to the end of your functions.php.file:

    /** Add Featured Image to Posts  */
    add_action( 'genesis_after_post_title', 'child_do_single_post_image' );
    function child_do_single_post_image() {
    
        if( is_single() )
            genesis_image( array( 'size' => 'single-post', 'attr' => array( 'class' => 'alignleft' ) ) );
    }

    If the image width is less than your post width the image will automatically position itself within your text box. If you choose to add images of the same width (or larger) as your blog column width the image will display itself above the text area, after being automatically resized to fit that width.

    Now, if you’re more inclined to only show thumbnails then add this slightly altered code:

    /** Add Featured Image to Posts - the Webonanza style  */
    add_action( 'genesis_after_post_title', 'child_do_single_post_image' );
    function child_do_single_post_image() {
    
        if( is_single() )
            genesis_image( array( 'size' => 'post-thumbnail', 'attr' => array( 'class' => 'alignleft' ) ) );
    }

    Also, check your Settings – Media menu item, to set image sizes.

    You may have to re-upload the featured image on the post in question to have it display properly, or you can install the “regenerate thumbnails plugin“.


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.