WEB ELEMENT
CONTENT BOX
CONTENT BOX
We include 4 design options for content boxes. Each one has been carefully designed and includes font awesome or image icon integration. You can use each set with either 1-4 column and it will adjust accordingly. You can set the icon color, circle color, circle border and background color for icon-boxed style.
Choose From 4 Different Design Styles
We include 4 design options for content boxes. Each one has been carefully designed and includes font awesome or image icon integration. You can use each set with either 1-4 column and it will adjust accordingly. You can set the icon color, circle color, circle border and background color for icon-boxed style.
Our theme is fully responsive and can adapt to any screen size. Try resizing your browser window to see it adapt!
Diseño Web | MadridWe include the awesome Layer Parallax Slider as well as the popular Elastic Slider. Both are easy to use!
Diseño Web | MadridWe included a backend color picker for unlimited color options. Anything can be changed, including gradients!
Diseño Web | MadridWe love fonts, choose from over 500+ Google Fonts. You can change all headings & body copy with ease!
Diseño Web | MadridOur theme is fully responsive and can adapt to any screen size. Try resizing your browser window to see it adapt!
Diseño Web | MadridWe include the awesome Layer Parallax Slider as well as the popular Elastic Slider. Both are easy to use!
Diseño Web | MadridWe included a backend color picker for unlimited color options. Anything can be changed, including gradients!
Diseño Web | MadridWe love fonts, choose from over 500+ Google Fonts. You can change all headings & body copy with ease!
Diseño Web | MadridOur theme is fully responsive and can adapt to any screen size. Try resizing your browser window to see it adapt!
Diseño Web | MadridWe include the awesome Layer Parallax Slider as well as the popular Elastic Slider. Both are easy to use!
Diseño Web | MadridWe included a backend color picker for unlimited color options. Anything can be changed, including gradients!
Diseño Web | MadridWe love fonts, choose from over 500+ Google Fonts. You can change all headings & body copy with ease!
Diseño Web | MadridOur theme is fully responsive and can adapt to any screen size. Try resizing your browser window to see it adapt!
Diseño Web | MadridWe include the awesome Layer Parallax Slider as well as the popular Elastic Slider. Both are easy to use!
Diseño Web | MadridWe included a backend color picker for unlimited color options. Anything can be changed, including gradients!
Diseño Web | MadridWe love fonts, choose from over 500+ Google Fonts. You can change all headings & body copy with ease!
Diseño Web | MadridChoose From 4 Different Design Styles
We include 4 design options for content boxes. Each one has been carefully designed and includes font awesome or image icon integration. You can use each set with either 1-4 column and it will adjust accordingly. You can set the icon color, circle color, circle border and background color for icon-boxed style.
Our theme is fully responsive and can adapt to any screen size. Try resizing your browser window to see it adapt!
Diseño Web | MadridWe include the awesome Layer Parallax Slider as well as the popular Elastic Slider. Both are easy to use!
Diseño Web | MadridWe included a backend color picker for unlimited color options. Anything can be changed, including gradients!
Diseño Web | MadridWe love fonts, choose from over 500+ Google Fonts. You can change all headings & body copy with ease!
Diseño Web | MadridOur theme is fully responsive and can adapt to any screen size. Try resizing your browser window to see it adapt!
Diseño Web | MadridWe include the awesome Layer Parallax Slider as well as the popular Elastic Slider. Both are easy to use!
Diseño Web | MadridWe included a backend color picker for unlimited color options. Anything can be changed, including gradients!
Diseño Web | MadridOur theme is fully responsive and can adapt to any screen size. Try resizing your browser window to see it adapt!
Diseño Web | MadridWe include the awesome Layer Parallax Slider as well as the popular Elastic Slider. Both are easy to use!
Diseño Web | MadridWe included a backend color picker for unlimited color options. Anything can be changed, including gradients!
Diseño Web | MadridWe love fonts, choose from over 500+ Google Fonts. You can change all headings & body copy with ease!
Diseño Web | MadridOur theme is fully responsive and can adapt to any screen size. Try resizing your browser window to see it adapt!
Diseño Web | MadridComplete Set of Options
Every option and description included with the content box shortcode is listed below.
- Parent / Child Settings = “Parent Level” settings will control all box styles together. “Child Level” settings will control each box style individually.
- Content Box Layout = Select the layout for the content box
- Number of Columns = Set the number of columns per row..
- Content Alignment = Works with “Classic Icon With Title” and “Classic Icon On Side” layout options.
- Title Size = Controls the size of the title. Leave blank for theme option selection. In pixels ex: 18px.
- Title Font Color = Controls the color of the title font. Leave blank for theme option selection. ex: #000
- Body Font Color = Controls the color of the body font. Leave blank for theme option selection. ex: #000
- Content Box Background Color = Leave blank for theme option selection.
- Hover Type = Select the hover effect type. This will disable links and hover effects on elements inside the column.
- Icon Background = Choose to show a background behind the icon. Select default for theme option selection.
- Icon Background Radius = Choose the border radius of the icon background. Leave blank for theme option selection. In pixels (px), ex: 1px, or “round”.
- Icon Color = Leave blank for theme option selection.
- Icon Background Color = Leave blank for theme option selection.
- Icon Background Inner Border Color = Leave blank for theme option selection.
- Icon Background Inner Border Size = Leave blank for theme option selection.
- Icon Background Outer Border Color = Leave blank for theme option selection.
- Icon Background Outer Border Size = Leave blank for theme option selection.
- Icon Size = Controls the size of the icon. Leave blank for theme option selection. In pixels ex: 18px.
- Icon Hover Animation Type = Select the animation type for icon on hover. Select default for theme option selection.
- Hover Animation Color = Select an accent color for the hover animation. Leave blank for theme option selection.
- Link Type = Select the type of link that should show in the content box. Select default for theme option selection.
- Link Area = Select which area the link will be assigned to. Select default for theme option selection.
- Link Target = _self = open in same window
_blank = open in new window. Select default for theme option selection. - Animation Delay = Controls the delay of animation between each element in a set. In milliseconds, 1000 = 1 second.
- Offset of Animation = Choose when the animation should start.
- Animation Type = Select the type on animation to use on the shortcode
- Direction of Animation = Select the incoming direction for the animation
- Speed of Animation = Type in speed of animation in seconds (0.1 – 1)
- Margin Top = In pixels (px), ex: 1px.
- Margin Bottom = In pixels (px), ex: 1px.
- CSS Class = Add a class to the wrapping HTML element.
- CSS ID = Add an ID to the wrapping HTML element.
- Title = The box title.
- Icon = Click an icon to select, click again to deselect
- Content Box Background Color = Leave blank for theme option selection.
- Icon Color = Leave blank for theme option selection.
- Icon Background Color = Leave blank for theme option selection.
- Icon Background Inner Border Color = Leave blank for theme option selection.
- Icon Background Inner Border Size = Leave blank for theme option selection.
- Icon Background Outer Border Color = Leave blank for theme option selection.
- Icon Background Outer Border Size = Leave blank for theme option selection.
- Rotate Icon = Choose to rotate the icon.
- Spinning Icon = Choose to let the icon spin.
- Icon Image = To upload your own icon image, deselect the icon above and then upload your icon image
- Icon Image Width = If using an icon image, specify the image width in pixels but do not add px, ex: 35
- Icon Image Height = If using an icon image, specify the image height in pixels but do not add px, ex: 35
- Link URL = Add the link’s url ex: http://example.com
- Link Text = Insert the text to display as the link
- Link Target = _self = open in same window
_blank = open in new window - Content Box Content = Add content for content box
- Animation Type = Select the type on animation to use on the shortcode
- Direction of Animation = Select the incoming direction for the animation
- Speed of Animation = Type in speed of animation in seconds (0.1 – 1)