On this page:

Box image

On this page:

Return boxes with image background.

Shortcode

[boxes columns="2"]
[boximg image="https://dummyimage.com/750x445/b5b5b5/ffffff.jpg" link="#" color="#e63946"]Text 1[/boximg]
[boximg image="https://dummyimage.com/750x445/b5b5b5/ffffff.jpg" link="#" color="#119d65"]Text 2[/boximg]
[boximg image="https://dummyimage.com/750x445/b5b5b5/ffffff.jpg" link="#" color="#fb8b24"]Text 3[/boximg]
[boximg image="https://dummyimage.com/750x445/b5b5b5/ffffff.jpg" link="#" color="#033860"]Text 4[/boximg]
[/boxes]

Attributes

Attribute Type Values Description
[boxes ...]
columns number from 1 to 5 Number of columns.
size text normal, small Box size CSS class.
[boximg ...]
image url Background image url.
color text Hex (#000000) or rgb (rgb(0,0,0)) or rgba (rgba(0,0,0,.5)) color value.
link url Box link.
link_target text Box link target. Set "_blank" to open link in a new window.

Shortcode - New Learning

[boxes boxid="boxesimg" type="1" columns="4"]
[boxesimg_item image="https://dummyimage.com/750x445/b5b5b5/ffffff.jpg" link="#" description="Description 1" color="rgba(230, 57, 70, 0.6)"]Title 1[/boxesimg_item]
[boxesimg_item image="https://dummyimage.com/750x445/b5b5b5/ffffff.jpg" link="#" description="Description 2" color="rgba(17, 157, 101, 0.6)"]Title 2[/boxesimg_item]
[boxesimg_item image="https://dummyimage.com/750x445/b5b5b5/ffffff.jpg" link="#" description="Description 3" color="rgba(251, 139, 36, 0.6)"]Title 3[/boxesimg_item]
[boxesimg_item image="https://dummyimage.com/750x445/b5b5b5/ffffff.jpg" link="#" description="Description 4" color="rgba(3, 56, 96, 0.6)"]Title 4[/boxesimg_item]
[/boxes]

Attributes - New Learning

Attribute Type Values Description
[boxes ...]
bgcolor text Background color. Hex or rgb/rgba color value.
bocolor text Border color. Hex or rgb/rgba color value.
border number Border width in pixels, without "px".
boxid number boxesimg This attribute is required.
btnfwcls text global, light, normal, medium, bold Button font weight.
btnrounded boolean 1, 0 Set to "1" to use rounded style of button.
btnsize text normal, sm, lg, xlg Button size css class.
btntext text Button text.
btntype text primary, secondary, success, warning, info, danger, inverse Button type css class.
ccolor text Accent color. Hex or rgb/rgba color value.
center boolean 1, 0 Set to "1" to center box text.
columns number from 1 to 5 Number of columns.
custom_class text Custom CSS class.
cwidth number Box content width in pixels, without "px".
desc boolean 1, 0 Set to "0" to hide box description.
gutter text thin, normal, none Css class to set padding between boxes.
height number Box height in pixels, without "px".
icolor text Icon color. Hex or rgb/rgba color value.
imgwidth number Image width in pixels, without "px".
itemlink boolean 1, 0 Set to "1" to apply a link to a whole box.
linkbtn number 0, 1, 2 0 = no link, 1 = arrow link, 2 = button link
mb number Margin bottom in pixels, without "px".
mt number Margin top in pixels, without "px".
rounded boolean 1, 0 Set to "1" to use rounded style.
shadow boolean 1, 0 Set to "1" to use shadow style.
tcolor text Box title color. Hex or rgb/rgba color value.
txcolor text Box text color. Hex or rgb/rgba color value.
tfs text Title font size in rem, without "rem".
tfw text global, light, normal, medium, bold Title font weight.
tlh text global, small, normal Title line height.
type number from 1 to 6 Box type.
wave boolean 1, 0 Set to "1" to apply the "wave" style.
[boxesimg_item ...]
bgcolor text Background color. Hex or rgb/rgba color value.
btnbgcolor text Button background color. Hex or rgb/rgba color value.
btnbghcolor text Button background color on hover. Hex or rgb/rgba color value.
btnborcolor text Button border color. Hex or rgb/rgba color value.
btnborhcolor text Button border color on hover. Hex or rgb/rgba color value.
btncolor text Button text color. Hex or rgb/rgba color value.
btnhcolor text Button text color on hover. Hex or rgb/rgba color value.
ccolor text Accent color. Hex or rgb/rgba color value.
description text Box description text.
icolor text Icon color. Hex or rgb/rgba color value.
icon text Icon name.
link URL Link URL.
link_target boolean 1, 0 Set to "1" to open link in a new window.
tcolor text Box title color. Hex or rgb/rgba color value.
txcolor text Box text color. Hex or rgb/rgba color value.