Panels

Use the [panel_box] shortcode to create panels. You can also use the [panel] shortcode to create a panel box without a border.

Panel Box

Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment.

Panel without borders

Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment.

Panel Box

Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment.

markup
[panel]
[heading size="h3"]Panel Title[/heading]
Your content here
[/panel]

important

In each of these examples, we've nested the panel code within the column grids.


Style modifiers

You can add style modifiers uk-panel-box-primary and uk-panel-box-secondary to change the visual appearance of the panel. You can also add the uk-panel-title to the heading to adapt the heading styling to the panel.


Primary Panel

Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment.

Secondary Panel

Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment.

markup

[panel style="uk-panel-box-primary"]
[heading size="h3" style="uk-panel-title"]Panel Title[/heading]
Your content here
[/panel]


Panel title with Icons

You can also add icons to the panels by using the [icon] shortcode right next to the header.


Primary Panel

Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment.

Secondary Panel

Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment.

markup

[panel style="uk-panel-box-primary"]
[heading size="h3" style="uk-panel-title"][icon style="icon-envelope-o"/] Panel Title[/heading]
Your content here
[/panel]

Talk to us

085 888 5555