Available with Extra Shortcodes add-on.

This shortcode allows you to create content sections with parallax effect.

Photo by Neven Krcmarek

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tincidunt elit et eros commodo, laoreet iaculis risus lobortis. Ut eget cursus nisi. Maecenas egestas, nunc gravida rutrum porttitor, ante ligula luctus erat, non vehicula massa mauris et ante. Mauris a vulputate sapien. Aenean sagittis tellus vitae mi viverra, sed venenatis nibh fringilla. Suspendisse vel suscipit elit, vel ultricies sem. Suspendisse elementum risus ut efficitur feugiat.
[su_section image="https://getshortcodes.com/wp-content/uploads/sites/2/2017/08/section-bg.jpg" border="none" text_align="center"]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce tincidunt elit et eros commodo, laoreet iaculis risus lobortis. Ut eget cursus nisi. Maecenas egestas, nunc gravida rutrum porttitor, ante ligula luctus erat, non vehicula massa mauris et ante. Mauris a vulputate sapien. Aenean sagittis tellus vitae mi viverra, sed venenatis nibh fringilla. Suspendisse vel suscipit elit, vel ultricies sem. Suspendisse elementum risus ut efficitur feugiat.[/su_section]
Option name Possible values Default value
background
Section background color
#HEX color #ffffff
image
Select background image for this section. Example value: http://lorempixel.com/1200/600/abstract/
The URL of uploaded file

none

parallax
Enable parallax effect. Parallax effect may not work in Live preview mode
yes or no yes
mobile
Enable parallax effect on devices with screen width less than 768px
yes or no yes
max_width
Maximum width for this section content (px)
Number from 0 to 1600 960
margin
Section margin (px), [top right bottom left]
Any text value 0px 0px 0px 0px
padding
Section padding (px), [top right bottom left]
Any text value 30px 0px 30px 0px
border
Top and bottom section borders
CSS border shorthand property 1px solid #cccccc
color
Section text color
#HEX color #333333
text_align
Text alignment for panel content
left (Left)
center (Center)
right (Right)
left
text_shadow
Pick a shadow for section text
CSS box/text-shadow shorthand property 0 1px 10px #ffffff
url
You can type here any hyperlink to make this section clickable
Any text value

none

class
Additional CSS class name(s) separated by space(s)
CSS class name(s) separated by space(s)

none