• For example I have an image that’s very long but want to show a cropped version of that but when people click my blog post from the homepage they see the longer version.

    I tried doing multiple php functions with “hard crop” but I’m not getting why it wont work. Which is why at this point I just want to make 2 images – 1 for the homepage/ 1 for the blog post. Thanks.

Viewing 15 replies - 1 through 15 (of 41 total)
  • If all of the below has been tried and you’re ready to call it a day and just use two separate images, you could look at a plugin like this. I’ve not used it personally but it looks like a good place to start.

    If you prefer to figure out why your original approach wasn’t working:

    The usual way to achieve this would be to have two different image sizes set in your theme, then single.php displays the larger size image, and index.php or whichever template is generating your home page uses the smaller size.

    add_image_size() is the function for adding a new image size and you would simply change the size parameter of the_post_thumbnail() in your different template files to display different sizes.

    If this is what you’ve already tried and you’re having no luck, have you regenerated your thumbnails? WordPress doesn’t automatically resize existing uploaded images when you change the image size settings, you’ll need to install the Regenerate Thumbnails plugin and use that to quickly resize everything to your new settings.

    Hope some of that is helpful!

    Thread Starter deanmoney

    (@deanmoney)

    Thanks for the help. I tried the plugin but the feature image option doesn’t work for my site hence 2 featured images don’t even show up as an option.

    I don’t do html or css so everything below that was a foreign langue to me. I know basic things like if someone said to add this code in functions and then add another code in my post.

    Does anyone know of a step by step guide on how to do what I originally wanted? Like what code to add where to be more specific.

    What I’m trying to do is post 1 image only but the image is 600X800. I want the homepage post to only show it as 600X350/400 – Ideally a 600X350 section that would look the best like 20/30 pixels down from the top and not directly from the very top. If that’s not possible then just the first 350 height from the top. Also this is just for specific images and not for my entire site as a default.

    Hopefully someone can point to a like with more info that is easy to figure out. Thanks in advance.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    You could use CSS – sorry for the terminology – to create a different crop on a particular page.

    Can you link to the page in question?

    Thread Starter deanmoney

    (@deanmoney)

    Thanks for the reply. My link is:

    http://www.bigbrotherhoh.com/meet-big-brother-17-houseguest-audrey-middleton/

    Thanks for the help.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    If you’re not using a Child Theme, and if the theme doesn’t have a designated section of the dashboard for CSS modifications then install this Custom CSS Manager plugin http://wordpress.org/plugins/custom-css-manager-plugin

    Then use its “CSS Code” section of the dashboard to hold your CSS modifications:

    Alternatively use your Child Theme style.css file to hold your CSS modifications:

    .single-post .entry p:first-of-type img {
       height: auto;
       width: 200px;
    }

    Thread Starter deanmoney

    (@deanmoney)

    My theme is called room-34-baseline and from what I can tell it’s not a child theme. I have an Appearance – Editor section if that’s what you mean. I d/l’ed that plugin and added that code and didn’t do anything.

    I didn’t think trying to do something like this would be this difficult.

    Thread Starter deanmoney

    (@deanmoney)

    I did some google searching and added this code in my functions file:

    add_theme_support( 'post-thumbnails' );
    add_image_size ( 'homepage', 600, 400, TRUE );

    So right now my functions file has this code in total:

    <?php
    if (function_exists('register_sidebar')) {
    	register_sidebar();
    }
    add_theme_support( 'post-thumbnails' );
    add_image_size ( 'homepage', 600, 400, TRUE );
    ?>

    Am I on the right track? If so what should I put in my post to crop the image the size I want it? Thanks.

    Thread Starter deanmoney

    (@deanmoney)

    I also tried downloading the plugin “Manual Image Crop” with my codes in functions:

    add_theme_support( 'post-thumbnails' );
    add_image_size ( 'homepage-thumb', 600, 375, TRUE );

    I tried to use the crop feature under the tab “homepage-thumb” but it’s still not showing up.

    Does anyone know of anyway to crop the homepage image but have my post image full size. I’ve been trying to figure this out for the last two days but to no avail.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    You need to then pull that image through into the template file

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Also re-upload your image into the media library

    Thread Starter deanmoney

    (@deanmoney)

    Not sure what you mean bu pulling the image through the template file. I have deleted and re-uploaded via the media library that same image at least 8 or 9 times now after I used the new plugin.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    The only thing this will do:

    add_theme_support( 'post-thumbnails' );
    add_image_size ( 'homepage-thumb', 600, 375, TRUE );

    Is generate a 600×375 pixel thumbnail in the media library from the file you upload.

    You then have to use that image in your template. The template from your theme won’t automatically pull in that new thumbnail you’re generating.

    Thread Starter deanmoney

    (@deanmoney)

    I understand that a 600X375 is made when I used the plugin in combination with the code in my functions file… Now how do I just use that image to show on my homepage for that post while the larger version shows on in the post.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Because you’re using a commercial theme, we can’t give you any theme-specific information.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    No wait it’s not commercial, it’s here: https://wordpress.org/themes/room-34-baseline Yay!!

Viewing 15 replies - 1 through 15 (of 41 total)
  • The topic ‘How do I add a different blog post image for my homepage?’ is closed to new replies.