Getting started
The Divi Packery Image Gallery Module invented by Divi flash moves with numerous amazing features for the Divi world. The most extraordinary features of this module are premade ten types of layout, responsive view for tablet & mobile, and hover setting. Nevertheless, several features like load more button, lightbox, custom URL, & spacing are the most eye-catchy attributes among all pro features. Unlike any other Divi modules, the Diviflash Advanced Image Gallery features are split into three categories,
+ Content Option
+ Design Option
+ Advanced Option
Divi Packary Image Gallery Module Content Tab
The content tab of the Diviflash Packery image gallery module is a place where you get a couple of extraordinary features. For instance, gallery images, gallery settings, hover settings, link, background, & admin label features are firmly admirable. Considering these features as the foundation of the divi Packery image gallery isn’t a wrong decision as a divi gallery module. No worries, today we will have a demonstration below of all the features in detail.
Gallery Image Feature
The gallery image of the content tab is regarded as the primary feature for the Packery image gallery module. This attribute allows designers to add countless images to the module. Note Down, if you seek to provide the caption & description and a custom link for an image, go to the WordPress default media library.
Gallery Setting
The gallery setting is indicated as one of the core features of the Diviflash Packery image gallery module. This feature consists of the most useful functionalities in the Packery image gallery. Here, you get ten different gallery layouts to choose from, the Same desktop view on a tablet, and a responsive view for tablet & mobile features. Also, you can provide spaces between images and a load more button with your desired text. Besides that, denoting the number of images for the initial loading and secondary loading over clicking the load more button is very simple here. Finally, you have the lightbox feature for allowing visitors to view and download the images.
Hover setting
The hover setting of the Diviflash Packery image gallery is an impressive and precious feature that throws various hover effects to the module. This particular setting helps designers implement overlay with two different colors upon a 0-360 deg gradient. Also, activating the border animation gives authority to select the border animation style from 19 different animations, colors, width & space. You can control the content space and visibility of caption & description under the hover setting. If you would like to keep your content on hover, you can select reveal animation from 12 different options. However, you get the fortune to activate the always show caption & description feature. Finally, if you want to change the content position, you have a few options like the top left, center & right, center left, center & right, bottom left, center, & right. So, play with each opportunity and surge your expertise level to the next step.
Link
A designer can easily take the audience to another page by linking the Packery Image Gallery Module. Diviflash Packery Image Gallery is a well-planned module with every customization setting that will be required while working.
Background
The Divi Packery Image Gallerie’s background setting has multiple facilities to implement for a better layout, such as background color, gradient color, image, and video features. And on top of these features, there are some settings to make each adjustment as you desired. Note, this background will apply to the whole module.
Admin Label
Admin Label of Divi Packary Image Gallery Module provides the opportunity to modify the module name as you wanted. So, it doesn’t have to be the module’s actual name that generally shows on the wireframe view.
Divi Packary Image Gallery Module Design Tab
The Design Tab of the Diviflash Packery image gallery module is a platform that allows you to embellish every single element with an amazing look. The design tab is an absolute combination of all advanced and super supportive designing features. For instance, font style, load more button, item border, and spacing are the most famous attributes. Moreover, the design tab stands for having control over the sizing and animation styles. It sounds like a complicated process, right? But super easy to conduct; follow the instructions demonstrated below.
Font style
Font style approaches with two different customizing features, caption & description, given into the image from the media library.
Caption
The caption feature of the font style setting is responsible for all kinds of embellishment for the caption font. Under this feature, you can define the caption tag, font style & weight, caption text colour & size. Moreover, the caption letter-spacing & line height can be determined from the caption feature.
Description
Every customizing opportunity you have in the caption setting is also included under the description feature.
Load more button
The load more button feature is designed with the broad intention to embellish every ingredient of the load more button. This well-planed feature is responsible for setting the button alignment, font style, weight & background color, and loading icon color. Also, the button text alignment, color, size, letter-spacing & line height can control by the load more button feature. Along with these functionalities, it has the proper intention to modify the border style, width, & color with corner rounding & box-shadow effects. Nevertheless, you can select an icon for the load more button and adjust the icon’s size according to the requirement.
Item border
The item border option of the Divi flash Packery image module can put borders in all the image at once. This feature is specially invented for the edge of the Packery gallery images, and this feature isn’t for the entire container. Here, you can provide the border rounding effect to images along with several border styles, width & color.
Sizing
As a designer, you would love to control the alignment, width, and height of a particular Packery image gallery module. Here, the sizing feature stands in your favor to increase or decrease your container’s width and height. Even you can set a min or max height and width for the container.
Spacing
The spacing feature is considered the imperative feature to maintain distance between container elements. Under this feature, you are allowed to put padding over the caption & description. Even you are authorized to import padding and margin for the load more button. Here, the Diviflash has given the divi default padding and margin facilities that apply to the entire container.
Animation
Animation effect setting exists in all the Divi default modules. It has seven different effects and other options to adjust the beauty of the animated section.
Divi Packary Image Gallery Module Advanced Tab
All you want to achieve is possible under the Content and Design tab, so take the convenience as much as you can. However, the Divi Packery image Gallery Module Advanced tab intends to quench the designer’s thirst to control the module. Designers can precisely play with each Divi gallery module element by implementing CSS ID & Classes and other Custom CSS code. Further, The visibility, transitions, position, and scroll effects settings are included here to work fluently.
CSS ID & Classes
CSS ID: The only purpose of the CSS ID section is to identify the ingredient separately while linking, scripting, or style the module.
CSS Class: Assign any number of CSS classes to the element, separated by spaces, which can be used to assign custom CSS style from within your child’s theme or from Divi’s custom CSS inputs.
Custom CSS
There are three different custom CSS areas in the Diviflash Packery image gallery module; you can target and set your custom CSS code there. There is a sign “?” in each CSS input box that will tell you which class has been targeted.
Visibility
The advanced setting’s visibility option allows designers to hide the Packery image gallery section for a particular device.
Transitions
You have features like Transition duration, Delay, and Curve Speed for better customization under the transition setting.
Position
Here you have complete control over the relative, absolute, and fixed positions. This option is also available in every Divi module and works almost the same for all.
Scroll Effects
If you wish to give a scroll effect to your Packery image gallery module, here you have the opportunity to achieve it with the scroll effect setting. Under this setting, you get a sticky position, scroll transform effects, enable vertical motion, and motion effect trigger functions.
NOTE:
Mobile: Any setting that has a mobile icon will allow you to customize according to devices. You can select different settings for desktop, tablet & Mobile.
Mouse: A mouse pointer in the setting will allow you to set a hover effect on this element.
