100% Width & Parallax Areas
By using „Fullwidth Container“ shortcode you can insert and style 100% width areas with optional parallax anywhere on your page and add to this area any content & shortcodes you wih. To insert fullwidth container, choose this element from the list of TheGem’s shortcodes here:
Color: select the font color for the text content you will insert in your fullwidth area
Background Color: select the background color for your fullwidth area
Background Image: select some image to be used as background image of fullwidth container. For parallax areas we advice to use large images in 1920 x 1200 px resolution
Background Style: choose a style of displaying background image
Background horizontal position: choose the horizontal position of your background imageBackground vertical position: choose the vertical position of your background image
Parallax: enable parallax effect if you wish to use parallax
If enabled:
Parallax type: choose parallax type you wish to use
Parallax overlay color: select overlay color for your parallax area
Padding top: set the top padding of the fullwidth area in pixel
Padding bottom: set the bottom padding of the fullwidth area in pixel
Padding left: set the left padding of the fullwidth area in pixel. NOTE: set this padding to “0” if you wnat to avoid any paddings to the left
Padding right: set the right padding of the fullwidth area in pixel. NOTE: set this padding to “0” if you wnat to avoid any paddings to the right
Container: enable this option if you don’t want to display the content inside your fullwidth area in 100% width layout, i.e. to display your content width limited to main website content width
Top & Bottom styled marker: choose if you wish to dispaly a styled marker and on which position After adding a fullwidth container, you can add any content element inside it by simply clicking on “+” symbol on it: