Close
Close

Columns Shortcode in Boxed Layout

Columns shortcode From Layers Easy Bootstrap Shortcodes Widget.

[ebs_row]
[ebs_column md=”12″ sm=”12″ xs=”12″ animation=”bounceIn” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-road” icontype=”glyphicon” color=”#dd3333″]3 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[/ebs_row]
[ebs_row]
[ebs_column lg=”6″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInLeft” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-cloud” icontype=”glyphicon” color=”#339900″]2 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”6″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInRight” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-envelope” icontype=”glyphicon” color=”#0099FF”]2 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[/ebs_row]
[ebs_row]
[ebs_column lg=”4″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInLeft” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-heart” icontype=”glyphicon” color=”#FF9900″]3 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”4″ md=”12″ sm=”12″ xs=”12″ animation=”fadeIn” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-zoom-in” icontype=”glyphicon” color=”#FF99FF”]3 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”4″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInRight” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-home” icontype=”glyphicon” color=”#FF3333″]3 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[/ebs_row]
[ebs_row]
[ebs_column lg=”3″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInRight” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-time” icontype=”glyphicon” color=”#666600″]4 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”3″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInRight” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-music” icontype=”glyphicon” color=”#993333″]4 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”3″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInLeft” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-upload” icontype=”glyphicon” color=”#00FF33″]4 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”3″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInLeft” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-film” icontype=”glyphicon” color=”#dd3333″]4 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[/ebs_row]

Columns In Fill Width Layout

[ebs_row]
[ebs_column md=”12″ sm=”12″ xs=”12″ animation=”bounceIn” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-road” icontype=”glyphicon” color=”#dd3333″]3 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[/ebs_row]
[ebs_row]
[ebs_column lg=”6″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInLeft” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-cloud” icontype=”glyphicon” color=”#339900″]2 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”6″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInRight” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-envelope” icontype=”glyphicon” color=”#0099FF”]2 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[/ebs_row]
[ebs_row]
[ebs_column lg=”4″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInLeft” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-heart” icontype=”glyphicon” color=”#FF9900″]3 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”4″ md=”12″ sm=”12″ xs=”12″ animation=”fadeIn” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-zoom-in” icontype=”glyphicon” color=”#FF99FF”]3 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”4″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInRight” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-home” icontype=”glyphicon” color=”#FF3333″]3 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[/ebs_row]
[ebs_row]
[ebs_column lg=”3″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInRight” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-time” icontype=”glyphicon” color=”#666600″]4 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”3″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInRight” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-music” icontype=”glyphicon” color=”#993333″]4 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”3″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInLeft” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-upload” icontype=”glyphicon” color=”#00FF33″]4 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”3″ md=”12″ sm=”12″ xs=”12″ animation=”fadeInLeft” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-film” icontype=”glyphicon” color=”#dd3333″]4 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[/ebs_row]

Screen Wise (large/medium/small/extra small ) Settings

Using the columns shortcode you can set the screen (large/medium/small/extra small ) wise layout. You can set any width, offset, visibility etc.

The following both columns width will change base on the screen size
[ebs_table width =”100%” style =”table-striped table-bordered table-hover” responsive =”true”]
[ebs_table_head]
[ebs_th_column]Screen Size [/ebs_th_column]
[ebs_th_column]First Column[/ebs_th_column]
[ebs_th_column]Second Column[/ebs_th_column]
[/ebs_table_head]
[ebs_table_body]
[ebs_table_row]
[ebs_row_column]Large[/ebs_row_column]
[ebs_row_column]6 columns[/ebs_row_column]
[ebs_row_column]6 columns[/ebs_row_column]
[/ebs_table_row]
[ebs_table_row]
[ebs_row_column]Medium[/ebs_row_column]
[ebs_row_column]8 columns[/ebs_row_column]
[ebs_row_column]4 columns[/ebs_row_column]
[/ebs_table_row]
[ebs_table_row]
[ebs_row_column]Small[/ebs_row_column]
[ebs_row_column]3 columns[/ebs_row_column]
[ebs_row_column]9 colimns[/ebs_row_column]
[/ebs_table_row]
[ebs_table_row]
[ebs_row_column]Extra Small[/ebs_row_column]
[ebs_row_column]12 columns[/ebs_row_column]
[ebs_row_column]12 colimns[/ebs_row_column]
[/ebs_table_row]
[/ebs_table_body]
[/ebs_table]

[ebs_row]
[ebs_column lg=”6″ md=”8″ sm=”3″ xs=”12″ animation=”fadeInLeft” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-cloud” icontype=”glyphicon” color=”#dd3333″]2 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”6″ md=”4″ sm=”9″ xs=”12″ animation=”fadeInRight” animationtime=”everytime” ]
[ebs_iconheading type=”h1″ style=”glyphicon-envelope” icontype=”glyphicon” color=”#dd3333″]2 Column[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”6″ md=”4″ sm=”9″ xs=”12″ animation=”fadeInRight” animationtime=”everytime” mdhide=”yes” lghide=”yes” ]
[ebs_iconheading type=”h1″ style=”glyphicon-envelope” icontype=”glyphicon” color=”#dd3333″]only for small screen[/ebs_iconheading]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[/ebs_row]

Show Hide Columns With Screen Size

User can set the column visibilty based on the screen size, check the following on different screen sizes

[ebs_row]
[ebs_column lg=”6″ md=”6″ sm=”6″ xs=”6″ animation=”fadeInLeft” animationtime=”everytime” smhide=”yes” xshide=”yes” ]

Visible only on Large and medium screen

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”6″ md=”6″ sm=”6″ xs=”6″ animation=”fadeInRight” animationtime=”everytime” mdhide=”yes” xshide=”yes” ]

Visible only on Large and small screen

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”6″ md=”6″ sm=”6″ xs=”6″ animation=”fadeInRight” animationtime=”everytime” smhide=”yes” lghide=”yes” ]

Visible only on medium and extra small screen

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[ebs_column lg=”6″ md=”6″ sm=”6″ xs=”6″ animation=”fadeInRight” animationtime=”everytime” mdhide=”yes” lghide=”yes” ]

Visible only on small and extra small screen

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum.
[/ebs_column]
[/ebs_row]