



Hits: 236
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 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 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;
}
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"]
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>
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.
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/
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.