How to set a parallax background for a section in WordPress with Nimble Builder ?

The Nimble Builder allows you to set a background to your sections, columns and modules. When using an image background, you can enable a parallax effect on scroll.

The parallax effect is commonly used in web design to create appealing pages. When enabled, the background image moves slower than the other page elements when scrolling.

You can see the effect in action here, or here.

In this documentation, we'll describe how to create a parallax background for a section, but this is the same process for a column or a module.

  1. Edit your section's settingsEdit a Nimble Buider section
  2. Expand the background tabSet the background of a section
  3. Upload an image and check the parallax effectEnable the parallax effect
  4. Set the force of the effect, from 0 to 100%

Tips for faster page load performances : 

  1. use optimized images : your background images should ideally not be larger than 200kb, with a maximum width of 1500 pixels
  2. enable the lazy loading options :
    1. Click on the global settings icon
    2. expand the site wide options and click on the page speed optimizations tab