<p class="big">Praesent nec magna ac pede. Mauris suscipit mauris. Nam quis erat id tortor. Phasellus at nibh nulla nulla, egestas quam eu tortor orci, id eros. Mauris neque. Pellentesque dolor. Mauris in est. <a href="#">Vivamus lacus sed justo</a>. Aenean ac dignissim nibh. Suspendisse sapien. Donec in faucibus volutpat, velit in leo ultrices posuere ante a nisl. Sed nec magna. Donec enim luctus diam eu mauris. Pellentesque facilisis. Nulla augue a.</p>

<p>Lorem ipsum dolor sit amet augue. <strong>Sed eu sem urna elit</strong>, non odio. Aenean lacus tellus quis ante. Fusce enim. <strike>Aliquam ultricies</strike> porta. Aenean ac eros sed arcu. Mauris nunc posuere cubilia Curae, Nullam et ipsum. Aliquam quis elit. Pellentesque habitant morbi <u>tristique commodo</u>. Suspendisse vitae lectus varius quis, tellus.Donec ullamcorper in, dapibus quam hendrerit eget, bibendum a, bibendum tempus.  <i>Pellentesque ac ipsum</i>. Vestibulum non sem. Mauris purus. Class aptent taciti sociosqu ad litora torquent per inceptos hymenaeos. Sed.</p>

<h1>H1 Heading</h1>
<h2>H2 Heading</h2>
<h3>H3 Heading</h3>
<h4>H4 Heading</h4>
<h5>H5 Heading</h5>
<h6>H6 Heading</h6>

Creates buttons in many different styles. A button can link to another page/subpage or it can be the download button. It can also have an icon on the left- or right-hand side.

Default code:

[button title="" link="" target="_blank" align="" icon="" icon_position="" color="" font_color="" size="2" full_width="" class="" download="" onclick=""]

Attributes:

• title - Text on the button
• link - Link (with http://)
• target - Link target - 0 (default), _blank (new tab or window), lightbox (lightbox - image or embed video)
• align - Button align: left, center or right
• icon - To use a button with an icon, type the icon name here
• icon_position - Icon position: left or right
• color - Button background color - Use one of predefined colors, color name or hex, e.g.: grey or #CCCCCC
• font_color - Button text color - Use color name or hex, e.g.: black or #000000
• size - Button size: 1,2,3,4
• full_width - Stretch to the width of a column
• class - This option is useful when you want to use scroll
• rel - Adds an rel="..." attribute to the link
• download - Download file when clicking on the link. Enter the new filename for the downloaded file.
• onclick - Adds an onclick="..." attribute to the link

Example of this shortcode below:

[button title="Default button" link="#" target="" icon="" icon_position="" color="" font_color="" size="2" full_width="" class="" download="" onclick=""]

[button title="Button with icon" link="#" target="" icon="icon-layout" icon_position="left" color="" font_color="" size="2" full_width="" class="" download="" onclick=""]

[button title="Button with icon" link="#" target="" icon="icon-basket" icon_position="right" color="" font_color="" size="2" full_width="" class="" download="" onclick=""]

[button title="Default button" link="#" target="" icon="" icon_position="" color="theme" font_color="" size="2" full_width="" class="" download="" onclick=""]

Creates buttons in many different styles. A button can link to another page/subpage or it can be the download button. It can also have an icon on the left- or right-hand side.

Attributes:

• Title - Text on the button
• Link - Link (with http://)
• Link | Target - Link target
• Align - Button align - left, center or right
• Icon - Button icon
• Icon | Position - Icon position
• Background - Button background color - Use one of predefined colors, color name or hex, e.g.: grey or #CCCCCC
• Font color - Button text color - Use color name or hex, e.g.: black or #000000
• Size - Button size: 1,2,3,4
• Full Width - Stretch to the width of a column
• Class - This option is useful when you want to use scroll
• Rel - Adds an rel="..." attribute to the link
• Download - Download file when clicking on the link
• OnClick - Adds an onclick="..." attribute to the link

Great shortcode with different variations on hover.

Default code:

[fancy_link title="" link="" target="" style="1" class="" download=""]

Attributes:

• title - Link text
• link - Link (with http://)
• target - Link target: 0 (default), _blank (new tab or window)
• style - Number of style, choose number from 1 to 8
• class - This option is useful when you want to use scroll or prettyphoto
• download - Download file when clicking on the link. Enter the new filename for the downloaded file.

Example of this shortcode below:

[fancy_link title="Phasellus" link="#" target="" style="1" class="" download=""]
[fancy_link title="Phasellus" link="#" target="" style="2" class="" download=""]
[fancy_link title="Phasellus" link="#" target="" style="3" class="" download=""]
[fancy_link title="Phasellus" link="#" target="" style="4" class="" download=""]
[fancy_link title="Phasellus" link="#" target="" style="5" class="" download=""]
[fancy_link title="Phasellus" link="#" target="" style="6" class="" download=""]
[fancy_link title="Phasellus" link="#" target="" style="7" class="" download=""]
[fancy_link title="Phasellus" link="#" target="" style="8" class="" download=""]

This Item is a useful option for embedding images onto a page. Images can have links or be zoomed.

Default code:

[image src="" width="" height="" align="" border="0" margin_top="" margin_bottom="" link="" link_image="" target="" alt="" caption="" greyscale="0" animate=""]

Attributes:

• src - Image URL (use link with http://)
• width - Image width in px - optional
• height - Image height in px - optional
• align - Choose how you want to align the image - 0 (default), left, center or right
• border - Border around the image - enter: 1
• margin_top - Margin top in px
• margin_bottom - Margin bottom in px
• link_image - Image URL to open in popup after click (use link with http://)
• link - If you don't want to open the image after click you can type your own link (with http://)
• target - Link target - 0 (default), _blank (new tab or window)
• hover - Hover effect - to disable please enter: disable
• alt - Alternate text
• caption - Short text under image
• greyscale - Greyscale effect (works only for images with link) - enter: 1
• animate - Entrance animation - available values: fadeIn, fadeInUp, fadeInDown, fadeInLeft, fadeInRight, fadeInUpLarge, fadeInDownLarge, fadeInLeftLarge, fadeInRightLarge, zoomIn, zoomInUp, zoomInDown, zoomInLeft, zoomInRight, zoomInUpLarge, zoomInDownLarge, zoomInLeftLarge, bounceIn, bounceInUp, bounceInDown, bounceInLeft, bounceInRight

Example of this shortcode below:

[image src="https://themes.muffingroup.com/be/theme/wp-content/uploads/2015/10/home_betheme_offerslider_thumb.png" width="" height="" align="center" border="1" margin_top="" margin_bottom="" link="#" link_image="IMAGE_URL" target="" alt="" caption="" greyscale="0" animate=""]

[image src="https://themes.muffingroup.com/be/theme/wp-content/uploads/2015/10/home_betheme_offerslider_thumb.png" width="" height="" align="center" border="1" margin_top="" margin_bottom="" link="" link_image="" target="" alt="" caption="Praesent in libero vel turpis pellen" greyscale="0" animate=""]

This Item is a useful option for embedding images onto a page. Images can have links or be zoomed.

Attributes:

• Image - Select image from Media Library
• Image | Width - Image width in px - optional
• Image | Height - Image height in px - optional
• Align - Choose how you want to align the image - none, left, center or right
• Border - Show Image Border
• Margin | Top - Margin top in px
• Margin | Bottom - Margin bottom in px
• Zoomed image - This image or embed video will be opened in lightbox
• Link - If you don't want to open the image after click you can type your own link (with http://)
• Open in new window - Adds a target="_blank" attribute to the link
• Hover Effect - Animated effect on image hover
• Alternate Text - Image Alternate Text
• Caption - Short text under image
• Greyscale Images - Works only for images with link
• Animation - Entrance animation
• Custom | Classes - type your own class for the item - this is a useful option for those who want to create a special style.
  For example: you can type my-class-big-font class and then go to BeTheme options > Custom CSS & JS > Custom CSS and write your own styles for this class:

  .my-class-big-font { font-size:150% !important; font-weight:bold; }

<ul>
<li>Aliquam tincidunt cons ectetuer mauris eu risus</li>
<li>Vestibulum auctor dapibus con sectet uer  neque</li>
<li>Suspendisse a pellentesque dui, non felis</li>
</ul>

<ol>
<li>Aliquam tincidunt cons ectetuer mauris eu risus</li>
<li>Vestibulum auctor dapibus con sectet uer  neque</li>
<li>Suspendisse a pellentesque dui, non felis</li>
</ol>

<dl>
<dt>Magna comodo</dt>
<dd>Consectetur adipisicing elit, sed do</dd>
<dt>Nullam wisi eu</dt>
<dd>Quisque lorem tortor fringilla sed.</dd>
<dt>Auctor dapibus</dt>
<dd> Ut enim ad minim veniam, quis nostru</dd>
</dl>

Useful to present something within the list. We prepared several types of lists.

List check

<ul class="list_check">
<li>List item 1</li>
<li>List item 2</li>
</ul>

List star

<ul class="list_star">
<li>List item 1</li>
<li>List item 2</li>
</ul>

List idea

<ul class="list_idea">
<li>List item 1</li>
<li>List item 2</li>
</ul>

List mixed

<ul class="list_mixed">
<li class="list_check">List item 1</li>
<li class="list_star">List item 2</li>
<li class="list_idea">List item 3</li>
</ul>

Each of these lists has a different class type. To change the type of the list, simply change the name of class

Creates links with icon and content inside.

Default code:

[content_link title="" icon="icon-lamp" link="" target="_blank" class="" download=""]

Attributes:

• title - Item title text
• icon - Type in icon name
• link - Link (with http://)
• target - Link target - 0 (default), _blank (new tab or window)
• class - This option is useful when you want to use scroll or prettyphoto
• download - Download file when clicking on the link. Enter the name of file to download.

Example of this shortcode below:

[content_link title="Vitae adipiscing" icon="icon-picture" link="#" target="" class="" download=""]

Default code:

[icon_bar icon="icon-lamp" link="" target="_blank" size="" social=""]

Attributes:

• icon - Type name of icon you want use
• link - Link (with http://)
• target - Link target - 0 (default), _blank (new tab or window)
• size - If you want large icon, then type large, leave field empty if you want default size
• social - Using this option makes icons colorful, available styles: facebook, google, twitter, vimeo, youtube, flickr, linkedin, pinterest, dribbble

Example of this shortcode below:

[icon_bar icon="icon-picture" link="#" target="" size="large" social=""]
[icon_bar icon="icon-calendar" link="#" target="" size="small" social=""]

[icon_bar icon="icon-facebook" link="#" target="" size="small" social="facebook"]
[icon_bar icon="icon-gplus" link="#" target="" size="small" social="google"]
[icon_bar icon="icon-twitter" link="#" target="" size="small" social="twitter"]
[icon_bar icon="icon-vimeo" link="#" target="" size="small" social="vimeo"]
[icon_bar icon="icon-play" link="#" target="" size="large" social="youtube"]
[icon_bar icon="icon-flickr" link="#" target="" size="large" social="flickr"]
[icon_bar icon="icon-linkedin" link="#" target="" size="large" social="linkedin"]
[icon_bar icon="icon-pinterest" link="#" target="" size="large" social="pinterest"]
[icon_bar icon="icon-dribbble" link="#" target="" size="large" social="dribbble"]

Creates spaces between elements. It also aligns a single line, with boxes located underneath. You can choose different styles of this item.

Default code:

[divider height="30" style="default" line="default" themecolor="1"]

Attributes:

• height - Divider height in px
• style - Style: 0 (default), dots or zigzag
• line - Line width (works only with style: default): 0 (default), narrow or wide
• themecolor - Line color the same as the theme color (works only with style: default) - enter: 1

Example of this shortcode below:

[hr height="30" style="default" line="narrow" themecolor="0"]
[hr height="30" style="default" line="narrow" themecolor="1"]
[hr height="30" style="default" line="default" themecolor="0"]
[hr height="30" style="default" line="default" themecolor="1"]
[hr height="30" style="default" line="wide" themecolor="0"]
[hr height="30" style="default" line="wide" themecolor="1"]
[hr height="30" style="dots" line="default" themecolor="1"]
[hr height="30" style="zigzag" line="default" themecolor="1"]

Creates spaces between elements. It also aligns a single line, with boxes located underneath. You can choose different styles of this item.

Attributes:

• Divider height - Divider height in px
• Style - Divider style
• Line - Line Width
• Theme Color - Line color the same as the theme color
• Custom | Classes - type your own class for the item - this is a useful option for those who want to create a special style.
  For example: you can type my-class-big-font class and then go to BeTheme options > Custom CSS & JS > Custom CSS and write your own styles for this class:

  .my-class-big-font { font-size:150% !important; font-weight:bold; }

This shortcode allows you to add text with any google font you want. Some of the fonts in the Google Fonts Directory support multiple styles.

Default code:

[google_font font="Open Sans" size="25" weight="400" italic="0" letter_spacing="" color="#626262" subset=""]Insert your content here[/google_font]

Attributes:

• font - Google font name
• size - Font size in px
• weight - Font weight (some fonts only): 100, 200, 300, 400, 500, 600, 700, 800, 900
• italic - Font style: italic (some fonts only)
• letter_spacing - Letter spacing in px, default: 0
• color - Use color name or hex, e.g.: grey or #626262
• subset - Subset for google font. Multiple separate with comma, e.g.: latin,latin-ext (some fonts only)

Example of this shortcode below:

[google_font font="Pompiere" size="80"] Quisque lorem tortor fringilla sed [/google_font]

[google_font font="Exo" subset="cyrillic-ext,latin" size="40"]Praesent in libero vel turpis pellentesque[/google_font]

[google_font font="Old Standard TT" size="23"] Cum sociis natoque penatibus et ultrices volutpat. Nullam wisi ultricies a, gravida vitae, dapibus risus ante sodales lectus blandit eu, tempor diam pede cursus vitae, ultricies eu, faucibus quis [/google_font]

This shortcode allows you to add alerts.

Default code:

[alert style="warning"]Insert your content here[/alert]

Attributes:

• style - Alert style: error, info, success, warning

Example of this shortcode below:

[alert style="warning"] Warning message. This is a <a href="#">sample link</a> [/alert]
[alert style="error"] Error message. This is a <a href="#">sample link</a> [/alert]
[alert style="info"] Info message. This is a <a href="#">sample link</a> [/alert]
[alert style="success"] Success message. This is a <a href="#">sample link</a> [/alert]

Creates a nice box with text inside. There are no attributes, just text.

Default code:

[idea]Insert your content here[/idea]

Example of this shortcode below:

[idea]Nulla imperdiet sit <a href="#">amet magna</a>. Vestibulum dapibus. Curabitur sit amet magna quam. Praesent in libero vel turpis <strong>pellentesque egestas sit amet vel nunc.</strong>[/idea]

This shortcode uses html code to create a table. Content is the only thing that is needed. You can make any number of rows or columns you want and place anything you want in the table. Here are 2 examples of raw HTML used for tables:

Example of this shortcode below:

<table>
	<thead>
		<tr>
			<th>Employee</th>
			<th>Salary</th>
			<th>Bonus</th>
			<th>Supervisor</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>Stephen C. Cox</td>
			<td>$300</td>
			<td>$50</td>
			<td>Bob</td>
		</tr>
	</tbody>
</table>

<table>
	<thead>
		<tr>
			<th class="clear"></th>
			<th>Salary</th>
			<th>Bonus</th>
			<th>Supervisor</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<th>Stephen C. Cox</th>
			<td>$300</td>
			<td>$50</td>
			<td>Bob</td>
		</tr>
	</tbody>
</table>

This Item can be used to present code. It also converts HTML tags into HTML special characters.

IMPORTANT! This item does not parse html! If you want to parse, use Column item instead!

Default code:

[code]Insert your content here[/code]

This Item can be used to present code. It also converts HTML tags into HTML special characters.

IMPORTANT! This item does not parse html! If you want to parse, use Column item instead!

Attributes:

• Content - Item content
• Custom | Classes - type your own class for the item - this is a useful option for those who want to create a special style.
  For example: you can type my-class-big-font class and then go to BeTheme options > Custom CSS & JS > Custom CSS and write your own styles for this class:

  .my-class-big-font { font-size:150% !important; font-weight:bold; }

Default code:

[icon type="icon-lamp"]

Attributes:

• type - Icon name

This Item creates a column. You can use iframes, HTML, local CSS styles, and more. Inside Column, you can enter anything you wish.

Default code:

[one]Insert your content here[/one]
[one_second]Insert your content here[/one_second]
[one_third]Insert your content here[/one_third]
[two_third]Insert your content here[/two_third]
[one_fourth]Insert your content here[/one_fourth]
[two_fourth]Insert your content here[/two_fourth]
[three_fourth]Insert your content here[/three_fourth]
[one_fifth]Insert your content here[/one_fifth]
[two_fifth]Insert your content here[/two_fifth]
[three_fifth]Insert your content here[/three_fifth]
[four_fifth]Insert your content here[/four_fifth]
[one_sixth]Insert your content here[/one_sixth]
[two_sixth]Insert your content here[/two_sixth]
[three_sixth]Insert your content here[/three_sixth]
[four_sixth]Insert your content here[/four_sixth]
[five_sixth]Insert your content here[/five_sixth]

This Item creates a column. You can use iframes, HTML, local CSS styles, and more. Inside Column, you can enter anything you wish.

Attributes:

• Title - This field is used as an Item Label in admin panel only
• Content - Shortcodes and HTML tags allowed
• Text Align - Text align: left, center, right or justify
• Background | Color - Background color - Use color name or hex, e.g.: silver or #C0C0C0
• Background | Image - Choose image from Media Library
• Background | Position - This option can be used only with your custom image selected above
• Margin | Bottom - Column margin bottom: default, 0, 10px, 20px, 30px, 40xp, 50px
• Padding - Padding - Use value with px or %, e.g.: 20px or 20px 10px 20px 10px or 20px 1%
• Animation - Entrance animation
• Custom | Classes - type your own class for the item - this is a useful option for those who want to create a special style.
  For example: you can type my-class-big-font class and then go to BeTheme options > Custom CSS & JS > Custom CSS and write your own styles for this class:

  .my-class-big-font { font-size:150% !important; font-weight:bold; }

• Custom | Styles - Custom inline CSS styles, e.g.: border:1px solid #999;