Modula Loading Effects

Enhance the visual appeal of your image galleries with Modula’s Loading Effects feature. This powerful tool allows you to add dynamic animations to your images, creating an engaging user experience. In this documentation, we’ll explore the different loading effects available in Modula and guide you on how to customize them to suit your preferences.

Accessing Loading Effects Options

To access and activate the loading effects options in Modula, follow these steps:

1. WordPress Admin Dashboard:
   • Log in to your WordPress admin dashboard.
2. Navigate to Modula:
   • Go to “Modula” in the admin menu.
3. Edit or Create a Gallery:
   • Choose an existing gallery to edit or create a new one.
4. Loading Effects Tab:
   • Within the gallery settings, navigate to the “Loading Effects” tab under Settings.

Now that you’ve accessed the Loading Effects options, let’s delve into the specific loading effects and their settings.

1. Scale Loading Effect

Overview:

The Scale Loading Effect provides a zoom-in or zoom-out animation for your gallery images.

Settings:

• Slider Adjustment:
  • Set the slider to 0 to disable the loading effect.
  • Adjust the slider between 1 and 100 for a zoom-in effect.
  • Set the slider above 100 for a zoom-out effect.

2. Rotate Loading Effect

Overview:

The Rotate Loading Effect adds a captivating rotation animation to your gallery images upon page load.

Settings:

• Slider Adjustment:
  • Modify the slider to control the degree of rotation.
  • Higher degrees result in more rotation, while lower degrees reduce rotation.

3. Horizontal Slide Loading Effect

Overview:

The Horizontal Slide Loading Effect animates images by sliding them onto the page horizontally during the initial page load.

Settings:

• Slider Adjustment:
  • Use the slider to adjust the magnitude of the horizontal sliding effect.
  • Negative values make images slide in from the left, while positive values make them slide in from the right.

4. Vertical Slide Loading Effect

Overview:

The Vertical Slide Loading Effect slides images onto the page vertically during the initial page load.

Settings:

• Slider Adjustment:
  • Adjust the slider to control the magnitude of the vertical sliding effect.
  • Negative values make images slide in from the top, while positive values make them slide in from the bottom.

Settings explained:

Scale: choose a value below 100% for a zoom-in effect. Choose a value over 100% for a zoom-out effect. Choose 100 for no effect.  

Rotate: to add a rotate effect set this value to a positive one for counter-clockwise rotations and a negative one for clockwise rotations.

Horizontal Slide: set this to a negative value if you want your gallery’s image to slide in from the left or to positive if you would prefer for them to slide in from the right.

Vertical Slide: negative value if you want your gallery’s image to slide in from the top or positive value if you would prefer for them to slide in from the bottom.

Load in view: if your gallery is somewhere further down the page but you still want to make the loading effect please check this toggle.

Experiment with these loading effects and settings to create a visually stunning presentation for your image galleries. Click on the effect names to see demos and visualize the impact before applying them to your Modula galleries.