Section

Description and Code

The Section shortcode lets you insert a full width or fixed width section in your page. You can use it for example for one page layout. Here's an example of the shortcode in code view:

[section_component menu_anchor="" section_100_width="no" background_color="" background_color_2="" background_color_fill="flat" background_color_linear="vertical" background_image="" background_repeat="no-repeat" background_position="left top" background_attachment="scroll" background_attachment_parallax="yes" border_size="0px" border_color="" border_style="solid" padding_top="20px" padding_bottom="20px" class="" id=""]Your Content Goes Here[/section_component]

Parameters

• menu_anchor
  • defines anchor which will be used in one page menu
  • Possible values - string - like section-contact

• section_100_width
  • defines if the section container will have 100% width or defined layout width
  • Possible values - yes or no

• background_color
  • defines the section background color
  • Possible values - hex code #000000, or color name black or rgba values like rgba(0,0,0,0.4)

• background_color_2
  • defines the section background color 2 for Linear or Radial Gradient style
  • Possible values - hex code #000000, or color name black or rgba values like rgba(0,0,0,0.4)

• background_color_fill
  • defines the background color fill style
  • Possible values - flat, linear, radial

• background_color_linear
  • defines the background color orientation of Linear Style
  • Possible values - vertical or horizontal

• background_image
  • defines the path for the image that you want to show as background
  • Possible values - string - like http://example.com/wp-content/uploads/image.jpg

• background_repeat
  • defines the background image repeat
  • Possible values - no-repeat, repeat, repeat-x, repeat-y

• background_position
  • defines the position of the background image
  • Possible values - left top, left center, left bottom, right top, right center, right bottom, center top, center center, center bottom

• background_attachment
  • defines if the background image scrolls
  • Possible values - scroll or fixed

• background_attachment_parallax
  • defines if the background will have Parallax effect
  • Possible values - yes or no

• border_size
  • defines the border width of the section
  • Possible values - use unit with pixels like 1px

• border_color
  • defines the section border color
  • Possible values - hex code #000000, or color name black or rgba values like rgba(0,0,0,0.4)

• border_style
  • defines the section border color
  • Possible values - solid, dashed, dotted

• padding_top
  • defines the section padding top
  • Possible values - use unit with pixels like 20px

• padding_bottom
  • defines the section padding bottom
  • Possible values - use unit with pixels like 20px

• class
  • custom class for CSS of component
  • Possible values - string - like custom-element-class

• id
  • custom ID for CSS of component
  • Possible values - string - like custom-element-id

Basic Examples

Examples With Parallax Effect