web_parallax_layer Shortcode
The web_parallax_layer shortcode places one Media Library image in a web_parallax_scene. Horizontal and vertical depth values determine how strongly that image moves in response to the parent scene.
The attributes below match the current Page Builder controls and public output. Use raw syntax only for reviewed content that cannot be maintained through the visual controls.
Allowed parent shortcodes: web_parallax_scene.
Usage
[web_parallax_layer]
Content
[/web_parallax_layer]Attributes
| Attribute | Default | Accepted values | Purpose |
|---|---|---|---|
image |
— | Media Library image URL | Supplies the visual layer and its intrinsic height. |
x_depth |
0 |
Number | The movement applied to this layer on the X axis will be multiplied by the value specified here. |
y_depth |
0 |
Number | The movement applied to this layer on the Y axis will be multiplied by the value specified here. |
device_visibility |
— | String unless stated otherwise | Applies the selected responsive visibility rule. |
el_id |
— | Valid unique HTML ID | Enter scene ID (Note: make sure it is unique and valid, according to w3c specification). |
el_class |
— | String unless stated otherwise | If you wish to style a particular content element differently, then use this field to add a class name and then refer to it in your CSS file. |
Enclosed content
This image variant does not render enclosed content. Use web_parallax_layer_html for reviewed custom markup or web_parallax_layer_text for the theme's structured text and button controls.
Verification
Preview the complete scene with pointer movement and confirm the chosen image loads at the intended proportions. Compare positive, negative and zero depth values, then verify the effect remains legible when the viewport is smaller than the source image.