How do I add parallax to my website?

Parallax is a visually appealing design attribute available for you to enable on your background images and patterns.


Follow these simple steps below, to add it to your page's background:

1. Select Design from the Dashboard navigation bar.

2. Select Page in the righthand Design panel.

3. Select the Background button:

4. At the very bottom you will see Scrolling, choose the Parallax scroll option.

5. Select Save and Publish to make your changes live.

You can preview your parallax feature by scrolling up and down on your page. The feature will work with patterns or background images.


If you are wanting to add the parallax effect to only a section of your page in a content block, follow these steps:

1. Select Content from the Dashboard navigation bar.

2. Select the green (+) button.

3. Select the green Image option.

4. Download this (right click link and Save-as) 1x1 transparent pixel and upload it into the image block:

5. Scroll up the page and select the blue Design this page link:

6. Select Page in the righthand Design panel

7. Select the Image block you just added to your page

8. Find the dropdown titled Container and find the area for Background

9. Upload or select your image background from the library

10. Under Type select Normal

11. Under Scrolling select Parallax scroll

12. Check off Resize background image based on device type

13. Check off Expand content to container edges

14. Under Padding add the amount of padding on the top and bottom that looks visually appealing to you

15. Select Save and Publish

Powered by Zendesk