This is searchable archive of our old support forums, which operated from 2012 - 2016. To find out how to get support for your current theme, please visit our support page.

Post Grid Image Sizes

  • Creator
    Topic
  • #11818
    mike-se
    Participant

    Using the Post Grid element with 3 columns the thumbnail size used is the grid_4 – 320×200 (hard crop). Shouldn’t it be using the grid_3 crop?

    The image size should actually be 278×174 if I measure what I see on the screen. Since the thumbnail isn’t the size shown on screen it gets too blurred.

    So, when I use the image crop function as below:

    function my_image_sizes( $sizes ) {
        $sizes['grid_4'] = array(
            'width' => '278', // Your new width
            'height' => '174' // Your new height
        );
        return $sizes;
    }
    add_filter( 'themeblvd_image_sizes', 'my_image_sizes' );

    and then regenerate the thumbnail using the plugin Regenerate Thumbnails: http://wordpress.org/plugins/regenerate-thumbnails/ the new thumbnail gererated is actually 269x174px.

    What is going on here, and how to fix this?

    /Mike

Viewing 3 replies - 1 through 3 (of 3 total)
  • Author
    Replies
  • #11821
    mike-se
    Participant

    Ok… Tried this instead – and it worked:

    function my_image_sizes( $sizes ) {
         
        // Grid 4 images
        $sizes['grid_4']['width'] = 278;
        $sizes['grid_4']['height'] = 174;
     
        return $sizes;
    }
    add_filter( 'themeblvd_image_sizes', 'my_image_sizes' );

    Still confused about why the 3 grid uses grid_4?

    #11837
    Jason Bobich
    Keymaster

    Using the Post Grid element with 3 columns the thumbnail size used is the grid_4 – 320×200 (hard crop). Shouldn’t it be using the grid_3 crop?

    Nope, grid_4 is correct. — The theme uses a standard 12-column scaffolding system. If you’re new to this concept, it basically means your columns are spread between the 12 single columns. So, for example if you have three columns, each of your columns takes up four of the total 12-column grid. — 4 + 4 + 4 = 12

    For example, if you had two equal columns (50%-50%), then it would be grid_6. — 6 + 6 = 12

    Or four equal columns, it would be grid_3 — 3 + 3 + 3 + 3 = 12

    This internal concept allows for more complicated theoretical combinations. For example, say you had three columns that you wanted to setup 50%-25%-25%, then you’d end up with grid_6/grid_3/grid_3. — 6 + 3 + 3 = 12

    The image size should actually be 278×174 if I measure what I see on the screen. Since the thumbnail isn’t the size shown on screen it gets too blurred.

    Yeah, this is correct. There are so many theoretical situations you could stuff a post grid in throughout your content, and then have them scale responsively. Taking this into account it would be ridiculous to attempt to create a crop size for every possible instance. When you uploaded an image in your WP admin, you’d have have a hundred crop sizes (probably more) generated for each image. And what if someone were to adjust the width of their website’s container? Then they’d have to re-do the math for those 100 image sizes? See where I’m going with that? 😉

    So, the goal here is to pick one size that will work in many scenarios. We pick a size that is at the bigger end of the spectrum that can that be accommodate as people use the post grid in smaller areas, and as it scales down responsively.

    However an image being scaled down in your browser shouldn’t really appear blurred. Ha, I think maybe you’re looking too hard at that screen.

    Note: If you ever want to post a block of code in the forums here, you can post them within < pre > HTML tags.

    #11864
    mike-se
    Participant

    Thanks Jason!

Viewing 3 replies - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.