Plugin Documentation
There have been some changes in version 3 of our free plugin. The excerpt height for fixed height excerpts may need to be adjusted as it now takes into account any 'read more' text appended to the excerpt. You may now use the widget/shortcode with custom posts The appearance of the plugin has changed. padimage
transitiontype the transitiontype setting controls the transitions of items when the grid resizes or during filtering. css - generates css animations. This is the default value and is equivalent to setting the animate option to true. js - enables javascript transitions none - no transitions. Any transitions will default to your theme css styles if
tooltip The tooltip option controls whether or not a tooltip displays when you hover over the image. tooltip defaults to true. Images without tooltips Images with tooltips
Standard Taxonomies like posts, tags and post formats and custom Taxonomies can be handled by featured-image-pro. Use the shortcode generator to select taxonomy id's. Normally, you only need two fields. taxonomies a comma delimited list of taxonomies taxonomy_relation defaults to 'OR'. Possible values are 'AND', 'OR'. Do not use with a single inner taxonomy array.
target - defaults to none. Sets the target for the link. Setting the target='_blank' will open a new window for the page.
subcaption1 subcaption2 Version 2 of the widget allows you to create subcaptions using the author name and/or the post date. You can display the author or the date in any subcaption. Advanced subcaptions options are available. subcaptionalign Available in version 3. Align the subcaption left, right or center. The default is center.
id The id number of a saved grid. Our shortcode generator allows you to save your options to the database while using our shortcode generator. Simply go into the shortcode generator, generate some shortcode and click on save. Your new shortcode will be displayed in the grid. It helps if you add a description to
Basic Settings responsive is a percentage value that can be used to automatically create a responsive grid. Columns may not calculate exactly. Increase the gutter or reduce the percentage by 1 or 2 to get the number of columns that you want in the grid. Advanced Responsive Settings: Percent Position There are only two options
resize determines whether or not the grid resizes when the window is resized. When this is false, you will want to use css styles to make your grid responsive and disable the default styles. resize defaults to true. max-width and width will be ignored when this value is false. Resize is disabled and maxwidth is
Set the rel value in the html for the link. This has no effect on the plugin and is for external use only.
Posts Per Page Controls the number of images or posts that display in the widget. The number of images defaults to the posts per page setting which can be found in the settings menu on your admin panel in the 'Reading' section. Default: Your default setting.
The plugin can be used with pages, posts, images (attachment) and any custom post type. This option is not available in the widget. Please insure that your posts have images unless you are using the advanced features of the plugin. The default post type is 'post'. Display product posts from Woo Commerce: Display event posts
padimage The Pad Image setting adds a class to the grid item and creates a padding around the image of 10px. This setting defaults to true as of version 3.0. Grid images with paddings, Grid Item has a border. No padding:
originleft determines the direction that items are added to the grid. When false, the items will be added from the right. originleft is a true/false value that defaults to true This example shows a grid with the origin from the right. origintop deterimines the direction that items are added to the grid.
orderby Posts can be sorted randomly (rand), by date (), or by title (title). The default orderby is date. order Posts can be ordered in ascending (Asc) and descending (Desc) order. The default order is Ascending. Load posts in random order. Load posts by title in ascending order Load posts by title in descending order Load posts by default date
openwindow - defaults to false. Sets target to '_blank' which opens the link into a new window.
bypage Enables paging of grids. The number of items that are displayed in the grid is based on the posts per page setting which defaults to the value set in wordpress. bypage is a true/false value that defaults to false navtype The type of navigation desired Valid options are : navigate, page_numbers, dots, more. navtype
itemwidth The width for a grid item automatically defaults to the width of the image. You can set the width for the grid item. The caption and the excerpt will stretch to fit the grid item while the image will default to it's native width and height unless specified otherwise. To stretch the image, set
If you want an even spacing between images, you will need to use both gutter and marginbottom, setting to equal heights. Note that gutter expects a number, while marginbottom expects a CSS value. That means, for equal spacing, you would need to enter values like this: If you're looking for more vertical space, simply add
linkto the linkto setting determines what happens when you click on a link. By default, the link will open the related post. We have a free addon for colorbox that is specifically for images in the media library and open up the full sized images in a lightbox slideshow. When using colorbox, the target and
ignore_sticky_posts Instead of displaying images for sticky posts in the grid, the Ignore sticky posts setting displays posts in sort order. ignore_sticky_posts defaults to true Set to false to display sticky posts first. Sticky posts disabled by default
hoverimage allows the image link in the hoverlink setting to be displayed on top of an image when the mouse hovers over it. hoverlink the image that will be displayed when the mouse hovers over an image in the grid. hoverimage is a true/false value and defaults to false hoverlink defaults to featured-image-pro/img/magnify.png
gutter determines the space between columns. If the border setting is used, it must be less than or equal to the gutter. gutter is an integer value and defaults to 5 You can also go for a tight look by setting both gutter and margin to 0.
gridwidth set a fixed maximum width for the grid. This setting applies either to the widget container or to the widget depending on the 'fitwidth' setting. The widget sits inside of a container. grid items sit inside of the widget. If fitwidth is set: this setting is applied to the maximum width of the container. It
gridalign align the grid in the container to the left, right or center Alignment with gridwidth: Alignment without gridwidth
HOW TO INSTALL Method 1: Select Plugins in the admin panel. Select 'Add New' Search for 'Featured Image Pro Widget'. Click on 'Install Now'. Once the plugin has been installed, click on 'Activate' Method 2: Download the plugin. In the WordPress admin panel, click on Plugins. Select Add New to get to the “Install Plugins”
Masonry grids may overlap if the height of a grid item is unknown. This can happen when css is applied after the grid has been laid out or when the grid resizes and the width changes. These settings are not available in the widget and must be applied in the shortcode. layoutonresize There are some
fitwidth Setting this allows the grid to size to content, which makes alignment possible. fitwidth defaults to true unless the responsive setting contains a percentage value.
Filtered Grids use the Isotope.Js plugin to create menus based on associated taxonomies. Normally you would not use paging with these grids, and instead display all items. displayas displayas defaults to 'masonry'. Set this value to 'filtered' for a filtered grid. By default, if the grid items are not queried by taxonomy, the category is
fadeintime Set this value to increase or decrease the time it takes for the grid to initially fade in. fadeintime defaults to 500 milliseconds. default fadeintime at 3000
The Featured Image Pro plugin can be used to display post excerpts. You can override the default excerpt word count by choosing the number of words to be displayed in the excerpt. You can set a height. If you want an even grid, you may have to balance these two items in order to make
show_noimage_posts When this setting is false, the widget only retrieves posts with featured images. When true, all posts will be retrieved whether or not a featured image is set. show_noimage_posts is a true/false value that defaults to false. When true, posts without images will be loaded. Posts without images can be displayed with or without
uniqueid - Use this advanced setting to create unique id's and classes for custom styling and scripts. By default a unique id is generated at runtime and is not static. In the case of a sidebar widget, the unique id contains the widget id which is static. The unique id is appended to the masonry container
Sometimes things go wrong and the debug functions can help us to determine what is causing the issue. *Before reporting an issue, save your copy and try retyping your query by hand or regenerating the query from the shortcode generator. Sometimes extra characters can be inserted into the query. Set debug=true debug_query=true. If necessary, set debug_log
To create an even grid similar to the featured image thumbnail grid, you must ensure a fixed height for all of the elements and, if displaying images with different widths, you may also choose to ensure a fixed width for the image. Use the widget to experiment with excerpt length and heights. To create an
You can use our plugin to create a media gallery. Create a basic media gallery that links to the image posts: Use our colorbox addin to display a gallery in a lightbox Use taxonomies terms with any taxonomy. In this case, we used Media Library Assistant plugin. Use taxonomy terms with isotope filters
columnwidth the width of each column in the grid. The image width spans the columns. In version 1, the columnwidth value defaulted to 150. In version 2 (and up), the columnwidth value defaults to 1 if there is no gutter. If there is a gutter, the plugin first checks for an itemwidth and sets the
All colors default to your theme default. item_color item_color is used to change the text color for text in the grid item. item_bgcolor item_bgcolor changes the background color of the grid item. link_color link_hovercolor link_color and link_hovercolor change the appearance of hot links. Video instruction https://www.youtube.com/watch?v=QgaU6SabDbc
This widget allows you to display grids by one or more categories. Select the categories in the widget and, if necessary, hit the apply button at the bottom of the widget. Display a grid for posts categorized demo Display a grid for posts categorized "more demo" and "still more demo"
showcaptions When true, captions will be displayed. By default, caption text will wrap. showcaptions is a true/false value that defaults to false In this example, showcaptions is set to true. hovercaptions When true, captions are displayed on top of the image when the mouse hovers over the image. Override the styles using custom css (See
author__in returns posts authored by a comma delimited list of authors id's or a single id. author__not_in returns posts that are not authored by a comma delimited list of authors id's or a single id author_name returns posts that are authored by the user name.
In many cases, animation transitions are already coded into your theme so that when a page resizes, elements on the page move smoothly to their new positions. If this is true, the grid will animate smoothly when you resize your window. Enabling this in the widget will enable transitions when your theme lacks them or
WordPress allows queries of tags. Tags apply to posts, and also to custom posts or attachments that have this feature enabled, the shortcode generator does not generate codes for the settings listed in theWordPress Codex, but they are supported by the plugin. Array values should be entered as comma delimited values. When tags are enabled,
subcaptionx Choose a field value for an infinite number of sub captions, besides the default 'author' and 'date' options, you can choose from taxonomy values, meta values, and even image meta values. Sub captions should be created in numerical order, i.e.: subcaption1, subcaption2, subcaption3, etc. If you skip a number, all sub captions after that
Use the powerful shortcode generator to create grids. Save the shortcode in the database and retrieve by id or alternately paste in the shortcode. Featuring Responsive grids simple settings to create responsive grids The premium version of the plugin allows you to use powerful queries to retrieve posts. Query by author, custom taxonomies, meta values, posts,
Posts can be queried by meta values as defined in the codex. You should familiarize yourself with these before using this advanced functionality. When querying on checkbox values, sometimes you may have to use EXISTS or NOT EXISTS instead of 1 and 0. In some cases, unchecked values do not get stored in the database
The plugin allows you to query by page & post according to the WordPress codex . You should familiarize yourself with this feature. The shortcode generator does not generate the following. p (Post id) - use 'post__in' with a single id, 'page_id' - use 'post__in' with a single id, 'post_parent' - use post_parent__in with a
The plugin allows posts to be ordered by all of the options in the codex. the codex. You should familiarize yourself with 'orderby' before using this option. Currently only a single orderby value is supported. orderby orderby defaults to 'date'. orderby_meta_key Ideally, combine ordering by meta key with a meta query using the same key:
before display posts before the date after display posts after a specific date today today can be used in place of the before or after settings.
When using filter and actions, use a filter priority above 10. We apply most of our filters around 15 or 16. To apply filters before our plugin, use a filter below 15. To apply filters after ours, use a filter above 15. Here are some of the filters available in the plugin. See the free