Media Grid - Wordpress Plugin

v4.1


Created: 17/05/2012
Latest update: 03/04/2016
By: LCweb
Website: http://www.lcweb.it
E-mail: support@lcweb.it

Thank you for purchasing my plugin. If you have any questions that are beyond the scope of this help file, please check my support platform. Thanks so much!

PRIOR NOTE:

From v2.1 the plugin comes with the brand new Easy WP Thumb script that replaces TimThumb.
Is important to check if your system is ready to create thumbnails. Simply go in Media Grid settings and at the end of the first tab content you will find the "Easy WP Thumb - Connection Information" panel that will inform you about the status.

To maximize performance, I strongly suggest to display your grids once you've created them, to allow cache images creation.



Notes:
Grid max width

This option affects only the thumbnails. Here you have to specify the maximum width of your grid. The default value is the classical 960px but if you have a fullscreen grid you must increase the value to avoid fuzzy images.

Filtered items behavior

Filtered items behavior can be changed from the standard masory's one "hide and reorder" to a more static "change opacity".

Disable Deeplinking

Disables the deeplinking feature (essential for the plugin SEO). Enable it only if the system conflicts with your existing setup

Use lightbox as modal

Enabling this option the lightbox will be closed only clicking on the related "X" button.

Use Easy WP Thumbs forcing system?

You'll enable Easy WP thumbs forcing mode. Enable that ONLY IF you note missing thumbnails or a grid is not showing

Use TimThumb?

This option switch off Easy WP Thumbs and enable Timthumb for the thumbnails creation. To be used only if you have issues with thumbs creation

Javascript in Header

To solve some incompatibility issues you can turn it on and put the javascript in your website header. Do this ONLY IF you notice problems.

AJAX support

Enable it if your website uses AJAX to load pages or contents. It will add a script setupping new added grids.

Notes:

Item Attributes

If an attribute is deleted or renamed, even the relative field in the item editor page will be cleared. Only uppercase/lowercase changes are allowed.

Static and single image item types:




Sliders and Lightbox video item types:


Slider height

The slider heigh in PERCENTAGE value is always referred to slider width. This to maintain always the same aspect ratio also on small screens. For example if you set an height of 50% and the slider is 1000px wide, the height will be set to 500px

Add captions to slider images

You can show a caption for each slider image. They are taken from the Description field of the image.
You can reach that field from the media archive of your wordpress installation or from the "Manage Images" button of media-grid.

media manager

Attach videos to slider images

From v4 you can attach Youtube and Vimeo videos to lightbox slider images. Just copy the video URL into the wizard, clicking on the "play button" of selected images

slider image videos

Video - Self hosted videos

You can also display the videos uploaded on your website. Supported formats: mp4, m4v, webm, ogv, wmv
Player supports multiple formats at the same time to guarantee cross-browser compatibility. Use video URLs split by a comma


Inline video, Audio, Custom content item types:


Audio type - Soundcloud

Paste the track's URL into the related field. If something is typed, the tracklist will be ignored

Audio type - tracks

The title shown in the grid item is the one specified in the wordpress media library
track title


Post Contents item type:


Post type integrations

This item typecan fetch contents from any post type having an editor in WP (e.g. posts, pages, but also woocommerce products).
The essential requirement is to have at least a taxonomy associated to the post type.

WooCommerce products

Using WooCommerce products as source, shown items will be directly referred to the Woo product.
This means that lightbox layout and attributes must be set in that product, through the Media Grid options box.


Inline text and spacer item types:


Inline text - image background

Switch it to on to use featured image as item background. Actually it is used to cover completely the item.

Spacer - visibility

From v4 you ca set also spacer visibility, to hide it on standard or mobile layout.


Item Notes:

Custom Attributes

Custom attributes are always optional. If an option field is not filled, it won't be displayed in the item description

Full-size image control

This settings are relative to the each image that is shown in the lightbox. With them you can control the images height to avoid extra-sizing in vertical images.
Setting the maximum height in pixels the images too big will be cropped to fit that size, leave this field empty to use the full image.

Item's lightbox max-width

In order to avoid issues using portrait and landscape images now you can set a maximum width for the lightbox of each item.
The content will be resized accordingly to the value you set. (minimum value is 320px)
items lb max width

Set thumbnail's center

Clicking on wizard you can select with ease the center of the thumbnails that will be shown in the grid.
By default the center of the image will be used.

thumbnail center

Notes:

"auto height" size

You can also us the option to calculate automatically the cell's height. It will be sized accordingly with the image proportions. With this setting the item's image won't be cropped in the grid but just downsized.
In the builder it is rendered as a 1/5 item for technical reasons

Pagination block

Adding this block, you enable the grid pagination. Basically is a 100% wide block you can freely move in the builder to split items as you prefer.

pagination block
Easy sorting mode

Mainly addressed to grids having many items of similar shapes, it allows fast sorting without masonry involvement

easy sorting mode
1-position move buttons

Sometimes things can become complex using drag&drop items positioning. Using these buttons you'll move them one position backwards or forwards.

1-step_move_builder
Hidden spacers

If you hidden spacers in desktop or mobile mode, this setting is already reflected in grid builder. Then is normal to not see hidden spacers, just switch mode to move them.

Grid preview

You can preview the grid you are building without placing it on a page. Before you have to set the preview container's page in the plugin settings.
Once the grid has been saved the related button will appear on the right of the "save grid" one.

Here's a demo shortcode with all possible parameters

            [mediagrid cat="91" title_under="1" search="1" filter="1" filters_align="left" hide_all="1" def_filter="15" r_width="700"]
            

Notes:
Filters alignment

(Available from v4) Enabling filters now you can choose where to place them. On top, by default, or on item sides.

Enable search

(Available from v4) Using this option, you'll enable the search bar. Its position will change accordingly with filters one.
Searching function is described in the next documentation chapter.

Relative Width

If this field has been left blank, the plugin will resize dinamically the grid cells basing on the grid container width.
Otherwise the size will be fixed to the specified width. For example, if the value is 800px, an item that is 1/4 x 1/4 will be 200px x 200px big. It will be ignored in mobile mode.

Notes:

From v3.03 you can also control product enabling individually. Even if global integration is disabled, you can set single products to be usable in grids.
In "edit product" page, the first option in Media Grid box controls this behavior.

The plugin is 100% multilanguage both for the front and the back-end. If a translation of your language has been created, Wordpress will automatically switch between languages. Plus it is WPML certified and compatible with qTranslate!

Create a translation

If you have WPML + String Translation add-on you can simply scan the plugin and translate via its UI all the plugin strings.

Otherwise: going in the plugin folder, then in the one called "languages". Inside you'll find the default.pot file. It contains all the english elements that have to be translated. If you want to create one in your language follow this steps:

To translate the item type options you necessarily need to use the WPML string translation plugin.

If everything goes right, you will be able to use your translation.

If you create new translations, please, contact me at support@lcweb.it sending the .PO and .MO files.
I will put it in the new releases and mention you in the changelog. Thanks


WPML guidelines
  1. Translate item categories
  2. Duplicate items
  3. Disable auto-sync with original language and translate elements

qTranslate guidelines
  1. Translate item categories
  2. Translate items