How to add Parallax to a Layout Background with the included Custom Template

Dec 28, 2018

Preface

The ability to add a Parallax effect to a Layout Background Image has been included in Concrete CMS since release version 5.7.5, and is included in v8 onwards. This effect is rather easy to setup.

While this can be used in flexible, novel ways, this tutorial will not go into all ways this can be used. This tutorial will just cover a single example.

This demonstration will be on a fresh install of concrete (effectively version 8.4.3 as of this writing) on the Elemental theme, however the feature is not explicitly tied to the Elemental theme and can be used for other themes freely.

Execution

We're going to modify an existing Layout in the starter Elemental theme content.

Locate a Layout's Column, click on it to trigger the pull-down menu, and Click on "Edit Layout Design"

Next we set the desired background image. Click on the second from the left icon, to get the Background image interface. Then click on "Choose Image", pick the one you want, and we move onto the next step. You do not need to hit "Save" just yet.

Next we click on the Cog/Gear icon to the left of "Cancel" to bring up the Advanced menu. The top option, "Custom Template" will have "(None selected)" by default. Switch this to "Parallax". Then hit save.

Now you should be able to preview the background image and Parallax effect before you publish!

This method has some room for creative use. So if you discover a novel way to use this, please leave your findings in the comments below so others can benefit! :)

Recent Tutorials
Generate a report with author information and form summaries in Concrete CMS.
May 9, 2022

In Concrete CMS, you can use a form to initiate contact between logged-in users and then create helpful reports. After form submissions are collected, they can be searched, sorted, and exported as a spreadsheet. This tutorial will detail how to add author information to a report using the advanced search.

How to clone and customize Atomik theme
Feb 14, 2022
By linuxoid.

How to clone and customize Atomik theme

Update jQuery to 3.5 on Concrete CMS version 8.5.x
Dec 1, 2021
By hissy.

If you have to take some time to fix your site to work with version 9 and want to update jQuery immediately, you can override it.

Add-On Developers: Get Your Add-Ons Ready for Concrete CMS 9.0
Aug 6, 2021
By andrew.

Concrete CMS 9.0 is coming! But there are some changes in version 9 that might affected your add-ons and themes. This document aims to answer questions about the most common ways that your add-ons might need to be changed, and common problems you'll run into.

Permissions for editors in a multilingual site
Jun 2, 2021
By myq.

How to set up a multilingual Concrete CMS site for groups of language-specific editors

Getting Started with Doctrine in Concrete CMS
Jan 20, 2021
By linuxoid.

Doctrine is a very flexible, simple (once you get to know it better) and powerful PHP library for database interactions primarily focused on the ORM = Object Relational Mapping and DBAL = DataBase Abstraction Layer.

Was this information useful?
Thank you for your feedback.