How to Add the Parallax Effect, Video Background, and Ken Burns Effect
Page Builder Sandwich has a feature that we collectively like to call Fancy Background Effects. There are three of them: the Parallax Effect, Video Backgrounds, and the Ken Burns Effect.
What are the different Fancy Background Effects?
PBS’ Fancy Background Effects give your website the boost that it needs to attract site viewers. They’re a surefire way to grab attention, and when executed correctly, can yield eye-catching results in website traffic.
The Parallax Effect
Implementing the Parallax Effect onto your page gives your background a sense of depth, letting certain elements of your site “pop out” while scrolling. Here’s an example of a page with a parallax background implemented, and one without.
With Parallax Scrolling
The background image scrolls at a different rate as the rest of the elements in the page.
Without Parallax Scrolling
The elements of the web page – the text, images, buttons, etc – all scroll at the same rate as the background.
Video Backgrounds
Video Backgrounds allow you to place looping videos on backgrounds instead of still images. The great thing about PBS’ video backgrounds is that you can simply paste your desired YouTube or Vimeo link when prompted, and we’ll turn it into a video background for you. You can also upload your own videos for this, too.
Some samples of video backgrounds you can check out:
The Ken Burns Effect
Ken Burns, who popularized the Ken Burns effect in film.
In documentaries, do you ever notice when they show photos that slowly zoom into detail? That’s called the Ken Burns Effect. You can access these effects on Page Builder Sandwich, too.
How do I add the Fancy Background Effects?
You can find all the Fancy Background Effects through the following steps:
Step 1: Choose a row you’d like to add an effect on. Click on this row’s settings button (the gear icon on the left). This will open the Properties Inspector.
Step 2: Once the Properties Inspector pops up, scroll down a bit until you find the option called “Fancy Background Effects”.
Step 3: Once you’ve found it, you’ll see that you can click a dropdown button and select which background effect you’d like on your row.
Step 4: Depending on which Fancy Background Effect you choose, you can adjust each effect’s settings. For example, for the Parallax effect, you can adjust its height and position.
And you’re done! After this, you should see your Fancy Background Effects appear on your site in full swing.
Have you used PBS’ Fancy Backgrounds yet?
Are there any other background effects you’d like to suggest we add to our features? Or show us your PBS-made site with one of the effects? Let us know in the comments section below!