Parallax in Gutenberg
What is Parallax?
Parallax scrolling is a web site trend where the background content (i.e. an image) is moved at a different speed than the foreground content while scrolling.
Setting up Parallax in Gutenberg editor
- open the Page you want to add the Parallax to.
- Click the check icon to add a new block.
- in the search bar search for ‘Cover’
- select the ‘Cover’ block.
- Upload or select the image you want to use for the Parallax.
- Click on ‘Block’ on the menu on the right side of the screen.
- Check the ‘Fixed Background’ button under ‘Cover Settings’
- Change the ‘Background Opacity to what ever setting you would like (the higher you change this, the darker the image will be.)
- Click on the image and write the text that you want.
- If you want the Parallax to take up the whole screen of the page, you can select the ‘Full width’ option above the block.