[su_section image="https://getshortcodes.com/wp-content/uploads/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]
This shortcode is available in Shortcodes Ultimate Pro
This shortcode allows you to create content sections with parallax effect.
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 – |
background_position This option determines position of the background image | left top (Left Top) center top (Center Top) right top (Right Top) left center (Left Center) center center (Center Center) right center (Right Center) left bottom (Left Bottom) center bottom (Center Bottom) right bottom (Right Bottom) | left top |
fullwidth Set this option to Yes to stretch section to full page width (not just content part). This option requires single-column page template. | yes or no | no |
parallax Enable parallax effect. Parallax effect may not work in Live preview mode | yes or no | yes |
cover Enable cover mode for background image. Image will fit into the section | 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 – |
target Choose link target | self (Open link in same window/tab) blank (Open link in new window/tab) | blank |
class Additional CSS class name(s) separated by space(s) | CSS class name(s) separated by space(s) | – none – |
Photo by Neven Krcmarek