Quantcast
Viewing all articles
Browse latest Browse all 23

How to Use Image loaded effects in Final Tiles Grid Gallery

Final Tiles Grid Gallery is a versatile WordPress portfolio gallery plugin that allows you to build smart grid based portfolios and galleries.

I have tested many portfolio plugins over the last ten yeas and Final Tiles Grid Gallery is certainly one of the most flexible solutions available today. You are not restricted to using rows and columns like many other portfolio solutions. Images are displayed in an intelligent manner with large and small images being integrated in an interlocking grid design.

Image may be NSFW.
Clik here to view.
Final Tiles Grid Gallery

The plugin offers a responsive portfolio design that looks great on every device and native support for video services such as YouTube and Vimeo. Filters can be applied to images and it is possible to use Final Tiles Grid Gallery to display your latest blog posts or WooCommerce products.

The inclusion of six lightboxes also means that you can easily change the way that images are displayed in the gallery.

In my last tutorials, I have shown you How to Create a New Final Tiles Grid Gallery, How to Configure Your Final Tiles Grid Gallery, and How to Use Hover Effects in Final Tiles Grid Gallery.

In this tutorial, I would like to explain what image loaded effects are and how you can use them to make your galleries come to life

How to Use Image loaded effects in Final Tiles Grid Gallery

Hover effects are applied to individual items in your portfolio. When a user hovers over an image, you can make the image zoom and rotate by a certain value.

Image loaded effects work in a similar way, however instead of being applied to individual images, the effects are applied to all images.

When the page is loaded, the images are loaded into the portfolio. A range of effects can be applied to the images when they are being loaded. For example, images can be spun into position.

There are four different image loaded effects: Zoom, rotation, horizontal slide, and vertical slide.

The default value of zoom is 100%, which means that no zoom is applied. Any value between 0% and 200% can be selected.

The default values of rotation, horizontal slide, and vertical slide, are zero. Rotation can go from -180 degrees up to 180 degrees while slides can be any value from -100 pixels to 100 pixels.

Image may be NSFW.
Clik here to view.
Image Loaded Effects

Applying a combination of the four available image loaded effects ensures that your images do not simply appear in your portfolio. They will quickly rotate and zoom into the page from a range of angles.

I recommend playing around with the different values until you find the kind of effect that suits.

Image may be NSFW.
Clik here to view.
Image Loaded Effects Transition

When the animation effects have finished, your images will be displayed in your portfolio just as they normally would. From here, a user will see a hover effect when they place their mouse cursor over an image.

Image may be NSFW.
Clik here to view.
Image Loaded Effects Final

As you can see, image loaded effects are a nice addition to Final Tiles Grid Gallery. It is one of many features that transforms this WordPress portfolio gallery plugin into something special.

The great thing about Final Tiles Grid Gallery is that you can tweak your gallery and gallery effects at any time. All you have to do is return to the gallery edit page and make the changes you need to make.

I hope you have enjoyed this tutorial.

Thanks for reading.

Kevin

The post How to Use Image loaded effects in Final Tiles Grid Gallery appeared first on GreenTreeLabs.


Viewing all articles
Browse latest Browse all 23

Trending Articles