Featured Image Thumbnail Grid Faq



  • 1.Featured Image Thumbnail Grid
  • Not all of my thumbnails are displaying. Only X thumbnails are displaying.
    Adrian04-09-2014

    To show more thumbnails on a page than the default value Blog pages show at most, use a fixed value for posts_per_page or try setting the posts_per_page value to '999'.

    You can view or modify Blog pages show at most in the Reading Section of your Wordpress Settings

    settings

     

  • I can’t add a thumbnail to my posts.
    Adrian05-09-2014

    Your theme must be enabled for post thumbnails.

  • How can I change the height and width of the thumbnails?
    Adrian05-09-2014

    How do I change the Height & Width on a single post or page?
    You can now change the height and width in the short code, allowing you to override the style sheet width and height. Use auto to retain proportional sizing in the grid.

    Example:

    [thumbnailgrid height="250px" width="250px"]

    - How do I change the Height & Width of the thumbnails for all posts and pages?

    You can install a custom css plugin (do a search for the plugin Simple Custom CSS). Once installed, it should show up in your Appearance menu. Using the Custom CSS plugin:

    Copy & Paste the styles below. Replace the width and height with the width and height that you would like to use. You can also change the space around the thumbnail by changing the padding. !important ensures that your custom style will have priority over the default style.

     

    .postimage,
    .postimage img {
    width: 150px!important;
    height: 150px!important;
    }
    .griditemleft {
    width: 150px!important;
    padding: 10px!important;
    }

  • How do I center the grid?
    Adrian05-09-2014

    How do I center a grid?

    Use the shortcode aligngrid with the gridwidth shortcode. Read more about shortcodes here:

    How do I center all of my grids uniformly?

    If your theme does not have a custom css module, you can install a custom css plugin (do a search for the plugin Simple Custom CSS). Once installed, it should show up in your Appearance menu. Using the Custom CSS plugin:

    Using custom CSS, you must add a width to thumbnailgridcontainer. This can be a percentage.

    Example 1:

    .thumbnailgridcontainer {

    width: 500px!important;
    }

    Example 2:
    .thumbnailgridcontaner
    {

    width:80%!important;
    }

  • How do I display the full title of a post?
    Adrian05-09-2014

    How do I display the full title of a post in one grid?

    In the shortcode, set wraptext=TRUE and the captionheight to an appropriate value.
    Example:

    [thumbnailgrid wraptext=TRUE captionheight="50px" posts_per_page = "3" cat="41"]

    How do I display the full title of a post in all grids?

    If your theme does not have a custom css module, you can install a custom css plugin (do a search for the plugin Simple Custom CSS). Once installed, it should show up in your Appearance menu. Using a Custom CSS plugin add the following:

    .postimage-title a

    {
    white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
    white-space: -pre-wrap; /* Opera 4-6 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
    }

    You might want to give postimage-title a fixed height so that your thumbnails areas are all the same height.

    .postimage-title
    {
    height: 30px;
    }

  • How do I display thumbnails for custom post types like woocommerce?
    Adrian30-10-2014

    For WooCommerce use the post type "product". Contact the developer of the plugin or theme for the post type of your custom posts or pages if you do not already know it.
    Example:
    [thumbnailgrid post_type="product"]

  • How do I use this code in my theme?
    Adrian25-01-2015

    There are two ways to call this shortcode in your theme.

    1. Use the wordpress function do_shortcode

    echo do_shortcode( '[thumbnailgrid gridwidth="400" aligngrid="left" posts_per_page = "3" cat="41"]' );

    2. Create an instance of the thumbnailgrid class.

    Snippet

     <?php  $tg = new sfly_thumbnailgrid();?>
    
      <div class="home-thumb fixed">
                    
      <?php echo  $tg->thumbnailgrid_function(array('posts_per_page' => 3, 'cat' => '41'  'aligngrid' => 'left', 'gridwidth' => '400'));?>
     
      </div>
    
  • How do I use the plugin to display pages?
    Adrian14-04-2015

    Obviously, your theme should enable featured images for pages or you should use a plugin for this. There are also plugins that allow you to set categories and tags for pages.

    Set the post_type attribute. The post_type for pages is "page".

    [thumbnailgrid post_type="page"]

    In version 5 of the plugin and up, you can set variables such as post__in and post__not_in (see the shortcode descriptions) to display or exclude specific pages.

    Example

    [thumbnailgrid post_type="page" post__in="1,2,3"] will display page id's 1, 2 and 3 and no other posts.
    [thumbnailgrid post_type="page" post__not_in(1,2,3)] will display all pages except for those with the id's of 1, 2 and 3.

  • How do I change the size of my thumbnails?
    Adrian07-05-2015

    You can use the width and height settings to stretch the images, but you may also want to regenerate thumbnails in a different size or to create new thumbnail sizes.

    Create new thumbnail sizes.  WordPress attachments come in 4 default sizes, thumbnail, medium, large & full (the original size). If you want to resize images or create new sizes, this is a handy link:

    http://havecamerawilltravel.com/photographer/wordpress-resize-thumbnails

    You can use this plugin to regenerate or generate images for posts that already exist before you change thumbnail sizes.

    https://wordpress.org/plugins/regenerate-thumbnails/

  • How do I change the default image?
    Adrian07-05-2015

    Tip: The default thumbnail image is installed in the folder wp-includes/images/media/default.png. To change it, replace the image.

    If you replace this image, it may be overwritten when you update WordPress.  There are many plugins that you can use to override this image.