[teaser]With column shortcodes you can create your own layouts by choosing groups of columns to stack beside and on top of each other. Combine this layout ability with all the elements that can be created by shortcodes and you do almost anything. The column widths available to use are 1/5, 1/4, 1/3, 2/5, 1/2, 3/5, 2/3, 3/4, 4/5 and of course 100% width columns are automatically used in any other situation. Any combination that adds up to a full column can be used to create a set of columns. As you image, that’s a lot of layout combinations available to you![/teaser] [line] [h4]Half Columns[/h4] [column_one_half] 1Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. [/column_one_half] [column_one_half] 2Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. [/column_one_half] [toggle_box title=”See The Shortcodes” variation=”1″] [code_table] [code_line][column_one_half][/code_line] [code_line]1Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_half][/code_line] [blank_code_line] [code_line][column_one_half][/code_line] [code_line]2Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_half][/code_line] [/code_table] [/toggle_box] [line] [h4]One Third + Two Thirds[/h4] [column_one_third] 1Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_third] [column_two_thirds] 2Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. [/column_two_thirds] [toggle_box title=”See The Shortcodes” variation=”1″] [code_table] [code_line][column_one_third][/code_line] [code_line]1Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_third][/code_line] [blank_code_line] [code_line][column_two_thirds][/code_line] [code_line]2Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_two_thirds][/code_line] [/code_table] [/toggle_box] [line] [h4]Five Columns[/h4] [column_one_fifth] 1Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fifth] [column_one_fifth] 2Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fifth] [column_one_fifth] 3Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fifth] [column_one_fifth] 4Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fifth] [column_one_fifth] 5Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fifth] [toggle_box title=”See The Shortcodes” variation=”1″] [code_table] [code_line][column_one_fifth][/code_line] [code_line]1Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fifth][/code_line] [blank_code_line] [code_line][column_one_fifth][/code_line] [code_line]2Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fifth][/code_line] [blank_code_line] [code_line][column_one_fifth][/code_line] [code_line]3Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fifth][/code_line] [blank_code_line] [code_line][column_one_fifth][/code_line] [code_line]4Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fifth][/code_line] [blank_code_line] [code_line][column_one_fifth][/code_line] [code_line]5Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fifth][/code_line] [/code_table] [/toggle_box] [line] [h4]Complex Example[/h4] [column_one_fifth] 1Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fifth] [column_one_fifth] 2Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fifth] [column_two_fifths] 3Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip.¬†Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_two_fifths] [column_one_fifth] 4Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fifth] [toggle_box title=”See The Shortcodes” variation=”1″] [code_table] [code_line][column_one_fifth][/code_line] [code_line]1Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fifth][/code_line] [blank_code_line] [code_line][column_one_fifth][/code_line] [code_line]2Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fifth][/code_line] [blank_code_line] [code_line][column_two_fifths][/code_line] [code_line]3Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_two_fifths][/code_line] [blank_code_line] [code_line][column_one_fifth][/code_line] [code_line]4Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fifth][/code_line] [/code_table] [/toggle_box] [line] [h4]Four Columns[/h4] [column_one_fourth] 1Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fourth] [column_one_fourth] 2Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fourth] [column_one_fourth] 3Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fourth] [column_one_fourth] 4Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip. [/column_one_fourth] [toggle_box title=”See The Shortcodes” variation=”1″] [code_table] [code_line][column_one_fourth][/code_line] [code_line]1Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fourth][/code_line] [blank_code_line] [code_line][column_one_fourth][/code_line] [code_line]2Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fourth][/code_line] [blank_code_line] [code_line][column_one_fourth][/code_line] [code_line]3Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fourth][/code_line] [blank_code_line] [code_line][column_one_fourth][/code_line] [code_line]4Lorem ipsum dolor sit amet…[/code_line] [code_line][/column_one_fourth][/code_line] [/code_table] [/toggle_box]

Share and Enjoy

  • Facebook
  • Twitter
  • Delicious
  • LinkedIn
  • StumbleUpon
  • Add to favorites
  • Email
  • RSS

Leave a Reply

Your email address will not be published. Required fields are marked *