Adding layered content is very simple:
- Log into your WP admin
- Navigate to Pages or Posts and either create a new one or edit a previously created one
- Under Page Attributes > Template, select “Layers” and save
- Add layered content sections with the following shortcode:
[layer] Hello World! [/layer]
Example With Multiple Layers and Optional Parameters
[layer id="layer-1" class="odd" color="#fff" padding="5%" background-color="#000" background-image="https://lawyerweb.co/wp-content/uploads/2018/02/bg-plain.jpg"] Blah blah blah. [/layer] [layer id="layer-2" class="even"] Beep beep beep. [/layer]
You may add whatever id you like and as many classes (space-separated) as you like.
Built-in classes include:
left center right layer-inner overlay force-white-text force-black-text
layer-inner creates a more narrow content area within the layer, if needed.
overlay allows you to fade a background image for more legible text, if needed.
force-white-text and force-black-text can override theme styles to force all text within the layer to be white or black, if and when needed.
For color, padding, background-color, and background-image parameters, you may treat this just like normal CSS, adding either a color name like red or color code like #ff0000 or a full image URL.