User Generated Images + Bootstrap

  • I’m building a site where users are going to be submitting posts on their own. So i’m a little lost as to where to begin with how to make all the images look consistent when displayed on a grid on the homepage. At the moment I am just getting the image urls by pulling in get_post_thumbnail. I am using Bootstrap for the CSS framework, which has a few tools that might help. 

     <?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID), 'thumbnail' ); ?>
<img src="<?php echo $url ?>" class="img-thumbnail" />
Viewing 2 replies - 1 through 2 (of 2 total)

  • Hello mrtunes,

    If I have understood it correctly, you are looking for the way so that all the images you use on the homepage are consistent and of the same size.

    Step 1: Edit Your Theme’s Function.php File and Add Image Sizes
    add_image_size( ‘homepage-thumb size’, 220, 180 );

    Step 2: Add the Code in Theme File to Display Custom Sizes
    <?php $img = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), ‘homepage-thumb size’ ); ?>

    Step 3: Regenerate Thumbnails For Previously Uploaded Images
    Use the Regenerate Thumbnails plugin

    Hope this helps.

    Thanks.

    Thread Starter mrtunes

    (@mrtunes)

    Hi thanks for taking a look at this. I tried implementing your suggestion, and here’s what gets outputted:
    <img src="Array" class="img-thumbnail img-fluid rounded" />

    Let me know if you have any idea why this is?

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘User Generated Images + Bootstrap’ is closed to new replies.