How to Create Your First Gallery
Are you ready to create the most visually-appealing gallery that will impress your website visitors? We’ll walk you through all the steps you need to follow to build an impressive gallery in minutes.
Create a new gallery
To get started, head to your WordPress Dashboard >Modula > Add New and it will pop up a new box.
With Modula, you can set galleries as defaults and use them later to other galleries you build (you’ll need the Default extension from Modula Pro), or choose to create a gallery from scratch. For our first gallery, we’ll click Create without default.
You will be redirected to a page where all the magic happens. You can start by giving your gallery a name to differentiate it from the others. Then, upload your images, or select them from your WordPress Library.
You can drag and drop images to arrange them as you wish.
Customize your gallery
If you scroll down to Settings, you’ll find most of Modula's customization options. Let’s begin with some general settings.
Choosing to create galleries with Modula will allow you to use various gallery types:
- creative (Modula will creatively arrange your images);
- custom (you can resize images controlling their heights, widths, and aspect ratio);
- slider (display multiple pictures in a slideshow);
- masonry (showcase your photos in columns without having to crop them).
The Slider grid type is available in Modula PRO.
Depending on the gallery type you choose, Modula will offer you different features that work hand in hand with the grid type.
Creative Gallery - change image size, width, heights, randomize factor on Modula’s grid algorithm, set the maximum number of images to display.
Custom Grid - change gutter, image size, randomize factor on Modula’s grid algorithm, set the maximum number of images.
If you choose the custom grid, you’ll be able to resize them by dragging the corner of each image.
Masonry - change gutter, image size, width, randomize factor on Modula’s grid algorithm, set the maximum number of images, add the number of columns.
Slider - change gutter, image size, width, set autoplay, animation speed, infinite loop, numbers of slides to show on a single view (slider), and more.
In this section, you can also enable pagination (Modula PRO extension) to let users page back and forth through multiple pages of images and add a Powered by Modula text at the bottom right of your gallery.
What’s more? You can style your gallery by adding a border and changing border size, radius, color, as well as shadow size, and color.
Customize Lightbox and Links
Go to Lightbox and Links, and set to Open Images in a Lightbox (the window that opens when you click on an image and appears in its entirety). There are also two more features: add an attachment page and direct link to a picture if you want to link photos in your gallery to external URLs.
If you scroll down, you’ll find more customizations for the Lightbox (Modula PRO) - add a toolbar, navigation options, transition effects, animations, change Lightbox color, add thumbnails, and more. Depending on your preferences, you can design the Lightbox gallery as you please.
Another handy feature is the Zoom extension (Modula PRO). This extension will allow visitors to see your work in detail and admire each piece of your artwork up close in the Lightbox.
But you can do more! Go to Slideshow (Modula PRO)to easily create a presentation of your gallery and allow users to cycle through all the available images effortlessly.
Add filters to your gallery (Modula PRO)
To filter your image/video gallery by category, you can go to Filters, add filter names, and click Add New Filter. You can add as many filters as you need.
You can also customize your filters by adding a filter link style, changing color, hover color, text alignment, filter positioning, and much more.
Return to your images and click on the Pencil icon to edit your picture.
You’ll be redirected to edit the image’s metadata. In this section, you can add a title, alt text, caption text, URL, and filters to your pictures. Clicking on the filter box will bring up all previously created filters. So, add the filters that match your image.
Insert videos into your gallery (Modula PRO)
If you scroll down, you’ll find more options. You can attribute a Youtube or Vimeo video URL as well as add a self-hosted video to your image. Just add the URL link or upload your video and then click Save and Save&Close.
Moreover, if you’re a photographer, you can add EXIF Information in the Edit section to display data from your image directly into your gallery and lightbox view (feature available in Modula PRO).
Then, you can add additional options for displaying the video in Settings > Video.
Enable social sharing
Go to Social, and enable Social Bar. This way, you can add social icons to your images and promote your artwork. Website visitors will easily share your pictures if they like them.
Include image effects (Modula PRO)
Attract your visitors' attention by adding image loading effects to your gallery. You can choose between 4 loading effects: scale (in the free version), rotate, scale, horizontal slide, and vertical slider (in the PRO version).
There’s more! You can choose how your images will behave on hover. Go to Hover Effects, and you can select your preferred effect. These effects show title, description, and social icons when you move the cursor.
Optimize your images (Modula PRO)
Why optimize your images? Image optimization helps in improving page load speed, boosts websites' SEO ranking, and improves user experience. So, go to Speed Up and enable Lazy Load.
If you go to Misc, you also have the option to Enable Deeplinking (best for SEO). Modula Deeplink is a premium extension that will let users link to any image within the lightbox by assigning it with a unique URL.
Another tip for improving SEO is to add titles, captions, and alt text to your images. Captions are text descriptions usually used to provide more details about an image. As presented before, the edit image feature allows you to add caption, title, and other metadata for each image.
Once you add caption and title to your pictures in the Edit section, you can customize these values in the Caption section - change color, font, font size, font style.
Allow visitors to download your images (Modula PRO)
Modula provides a Download extension that allows your website visitors to download various images from your gallery. Go to Download Settings > Enable Download. Depending on the settings enabled, you can add a download icon on your thumbnails to download each image or a ‘download all images’ button above the gallery. You can also add a ‘download all’ button inside the lightbox.
Protect your images (Modula PRO)
Most images shared on the internet are being used without permission or license from their original creators. So, if you are a photography enthusiast, we found ways to protect images on your website from theft.
First, head over to Misc and enable right-click protection. Modula Right-Click Protection will allow users to prevent visitors from downloading images by disabling right-click and Alt+click.
Second, with Modula’s Password Protection add-on, you can easily protect galleries with a password. Just head to Password Protect (as shown above), enter the password you would like to protect the gallery with, optionally enter a username/email address and a message to be displayed to people trying to access your gallery.
Third, the Watermark extension will help you add watermarks to your images and prevent them from being shared without proper credit.
Go to Watermark, and there you will see a bunch of options. You will need to upload your watermark image, select where the watermark will be positioned on the image as well as set the margin around it.
When you'll create multiple galleries, you can display them on your website in albums. Modula Albums is an extension that helps you display multiple galleries on a page and organize them into albums.
Save your gallery
Once you’re done designing and customizing your gallery, don’t forget to click Save Gallery.
Modula will generate a shortcode for your gallery.
Showcase gallery on your website
All you have to do is copy the shortcode and paste it into a page or post - you can create a new one or post to an existing one.
If you own the Gutenberg Block Editor, you can simply click on the “+” icon, look for Modula Gallery and add the gallery created.
If you’re using the Classic Editor, you simply need to add the shortcode to your page/post and click Publish.
If you’re starting to gather members on your website, you can use the Module Role Management extension, which provides granular access control over user roles that can add, edit, delete, or update galleries on your site. Go to Modula > Settings > Roles and add permissions to an existing user role or remove them by simply checking the correct checkboxes.
Et voila! This is how you can create the most stunning image and video galleries on your WordPress website without the hassle and coding skills.