200+ shortcodes & items
with 2 unique styles for unlimited possibilities
Content blocks
Tabs Horizontal / Vertical
This Item allows you to create Tabs in 3 different styles. You can add as many tabs as you want.
Default code:
[tabs title="" type=""][tab title="Title"]Content[/tab][/tabs]
Attributes:
- title - Tabs title
- type - There are 3 different styles for this Item: horizontal, centered and vertical
Example of this shortcode below:
[tabs title="" type=""] [tab title="Commodo luctus"]<p class="big">Lorem ipsum dolor sit amet ...</p><p>Donec vestibulum justo ...</p>[/tab] [tab title="Eget lacina"]<p class="big">Curabitur et ligula ...</p><p>Donec vestibulum justo a diam ...</p>[/tab] [tab title="Porta gravida"]<p class="big">Lorem ipsum dolor sit ...</p><p>Donec vestibulum justo ...</p>[/tab] [/tabs] [tabs title="" type="vertical"] [tab title="Commodo luctus"]<p class="big">Lorem ipsum dolor sit amet ...</p><p>Donec vestibulum justo ...</p>[/tab] [tab title="Eget lacina"]<p class="big">Curabitur et ligula ...</p><p>Donec vestibulum justo a diam ...</p>[/tab] [tab title="Porta gravida"]<p class="big">Lorem ipsum dolor sit ...</p><p>Donec vestibulum justo ...</p>[/tab] [/tabs]
This Item allows you to create Tabs in 3 different styles. You can add as many tabs as you want.
Attributes:
- Title - Tabs title
- Tabs - Tabs content
- Style - There are 3 different styles for this Item: Horizontal, Horizontal with centered tabs and Vertical
- Unique ID (optional) - Use this option if you want to open specified tab from link. For example: Your Unique ID is offer and you want to open 2nd tab, please use link: your-url/#offer-2
- 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; }
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id.
Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id.
Lorem ipsum dolor sit amet enim. Etiam ullamcorper. Suspendisse a pellentesque dui, non felis. Maecenas malesuada elit lectus felis, malesuada ultricies.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
Accordion Toggle
This Item adds an Accordion or Toggle on page. You can add as many tabs as you need. Just type the Title and Content (you can use html tags) for each tab. You can also use Drag & Drop option to set the order for items.
Default code:
[accordion title="" open1st="0" openAll="0" style=""][accordion_item title="Title"]Content[/accordion_item][/accordion]
Attributes:
- title - Accordion title
- open1st - To open first tab on load type: 1
- openAll - To open all tabs on load type: 1
- style - Select accordion or toggle
Example of this shortcode below:
[accordion title="" open1st="1" openAll="0" style=""] [accordion_item title="<i class='icon-cog'></i> Sed est elit posuere ac semper hendrerit neque"]<p class="big">Lorem ipsum dolor sit amet ...</p><p>Donec vestibulum justo ...</p>[/accordion_item] [accordion_item title="<i class='icon-star'></i> Aenean ligula nibh, molestie id viverra a"]<p class="big">Curabitur et ligula ...</p><p>Donec vestibulum justo a diam ...</p>[/accordion_item] [accordion_item title="<i class='icon-users'></i> Morbi sed dolor risus rhoncus sapien"]<p class="big">Lorem ipsum dolor sit ...</p><p>Donec vestibulum justo ...</p>[/accordion_item] [/accordion] [accordion title="" open1st="1" openAll="0" style="toggle"] [accordion_item title="Sed est elit posuere ac semper hendrerit neque"]<p class="big">Lorem ipsum dolor sit amet ...</p><p>Donec vestibulum justo ...</p>[/accordion_item] [accordion_item title="Aenean ligula nibh, molestie id viverra a"]<p class="big">Curabitur et ligula ...</p><p>Donec vestibulum justo a diam ...</p>[/accordion_item] [accordion_item title="Morbi sed dolor risus rhoncus sapien"]<p class="big">Lorem ipsum dolor sit ...</p><p>Donec vestibulum justo ...</p>[/accordion_item] [/accordion]
This Item adds an Accordion or Toggle on page. You can add as many tabs as you need. Just type the Title and Content (you can use html tags) for each tab. You can also use Drag & Drop option to set the order for items.
Attributes:
- Title - Accordion item title
- Accordion - Add as many tabs you want, use drag & drop to change their order or remove them
- Open first - Open first tab on load
- Open All - Open all tabs on load
- Style - Select Accordion or Toggle
- 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; }
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
Curabitur et ligula. Ut molestie a, ultricies porta urna. Vestibulum commodo volutpat a, convallis ac, laoreet enim. Phasellus fermentum in, dolor.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
This Item creates an FAQ page. Â You can also use Drag & Drop option to set the order for the items on this page.
Default code:
[faq title="" open1st="0" openAll="0"][faq_item title="Title" number="1"]Content[/faq_item][/faq]
Attributes:
- title - FAQ item title
- open1st - Open first tab on load
- openAll - Open all tabs on load
Example of this shortcode below:
[faq title="" open1st="1" openAll="0"] [faq_item title="Sed est elit posuere ac semper at hendrerit a neque?" number="1"]Lorem ipsum dolor sit amet ...[/faq_item] [faq_item title="Donec vestibulum justo a diam ultricies pellentesque?" number="2"]Lorem ipsum dolor sit amet ...[/faq_item] [faq_item title="Quisque mattis diam vel lacus tincidunt elementum?" number="3"]Lorem ipsum dolor sit amet ...[/faq_item] [faq_item title="Integer a placerat at, mollis nunc vel neque sollicitudin?" number="4"]Lorem ipsum dolor sit amet ...[/faq_item] [faq_item title="Integer lorem non enim fringilla orci?" number="5"]Lorem ipsum dolor sit amet ...[/faq_item] [/faq]
This Item creates an FAQ page. Â You can also use Drag & Drop option to set the order for the items on this page.
Attributes:
- Title - FAQ item title
- Add tab - Add as many tabs you want, use drag & drop to change their order or remove them
- Open First - Open first tab on load
- Open All - Open all tabs on load
- 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; }
Lorem ipsum dolor sit amet tempor ac, laoreet feugiat. Proin id dui. Integer a placerat at, mollis nunc vel neque sollicitudin augue sit amet magna. Donec aliquam dictum quis, tincidunt molestie, neque nibh ultricies nec, aliquam purus. Fusce convallis non, facilisis sodales. Vivamus sem at augue. Nulla et magnis dis parturient montes, nascetur ridiculus mus. Vivamus justo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem.
Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor. In iaculis viverra neque, ac eleifend ante lobortis id. In viverra ipsum ac eros tristique dignissim. Donec aliquam velit vitae mi dictum.
Helper
This is one of 2 tabs you can add. Some Shortcodes and HTML tags allowed.
Second tab has been replaced with external link

Helper is available as Muffin Builder Item only.
List
The List item enables you to define and create styles, images, icons and more.
Default code:
[list icon="icon-lamp" image="" title="" link="" target="_blank" style="1" animate=""]Insert your content here[/list]
Attributes:
- icon - Use an icon from the icon's list
- image - Image URL instead of an icon (use link with http://)
- title - List item title
- link - Link (with http://)
- target - Link target - 0 (default), _blank (new tab or window)
- style - Select style: 1 - with background, 2 - transparent, 3 - vertical or 4 - ordered list
- 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:
[list icon="icon-heart-line" image="" title="Tincidunt mauris" link="" target="" style="1" animate=""]Vitae adipiscing turpis. Aenean ligula nibh in, molestie id viverra a, dapibus at dolor. [/list] [list icon="" image="IMAGE_URL" title="Integer aliquam" link="#" target="" style="2" animate=""]Vitae adipiscing turpis. Aenean ligula nibh in, molestie id viverra a, dapibus at dolor. [/list] [list icon="" image="IMAGE_URL" title="Malesuada fames" link="" target="" style="3" animate=""]Vitae adipiscing turpis. Aenean ligula nibh in, molestie id viverra a, dapibus at dolor. [/list] [list icon="icon-heart-line" image="" title="1" link="" target="" style="4" animate=""]Vitae adipiscing turpis. Aenean ligula nibh in, molestie id viverra a, dapibus at dolor. [/list]
The List item enables you to define and create styles, images, icons and more.
Attributes:
- Icon - Use an icon from the icon's list
- Image - Select image from Media Library instead of using an icon
- Title - List item title
- Content - List item content
- Link - Link (with http://)
- Open in new window - Link target
- Style - Choose between 4 different Item styles
- 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; }
Tincidunt mauris
Integer aliquam
Malesuada fames
Bibendum sapien
Vestibulum commodo
Quisque lorem

Tincidunt mauris

Integer aliquam

Malesuada fames

Quisque lorem

Bibendum sapien

Vestibulum commodo

Integer aliquam

Tincidunt mauris
Pricing item Boxes / Tables
This Item creates a Pricing page. You can choose among 3 different styles. For example, you can use boxes or tables, with or without labels.
Default code:
[pricing_item image="" title="" price="" currency="" currency_pos="left" period="" subtitle="" link_title="" icon="" link="" target="" featured="0" style="box" animate=""] <ul> <li><strong>List</strong> item</li> </ul> [/pricing_item]
Attributes:
- image - Image URL (use link with http://)
- title -Pricing title
- price - Price
- currency - Pricing currency
- currency_pos - Show currency on the: left or right
- period - Pricing period
- subtitle - Text will be visible under price
- link_title - Button text
- icon - Use an icon from the icon's list
- link - Link (with http://)
- target - Link target - 0 (default), _blank (new tab or window), lightbox (lightbox - image or embed video)
- featured - Enter 1 to feature the item
- style - Select box, table or label styles
- 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:
Box:
[pricing_item image="https://themes.muffingroup.com/be/theme/wp-content/uploads/2015/09/home_betheme_pricingbox.png" title="Basic" currency="$" currency_pos="left" price="12" period="/ monthly" subtitle="Vitae adipiscing turpis. Aenean ligula nibh, molestie id vivide." link_title="Sign up now" link="#" target="" icon="" featured="0" style="box" animate=""] <ul> <li><strong>10GB</strong> Space amount</li> <li><strong>Unlimited</strong> users</li> <li><strong> 30GB</strong> Bandwidth</li> <li><span class="yes"></span></li> <li><strong>20</strong> MySQL Databases</li> </ul> [/pricing_item]
Table:
[pricing_item image="" title="Standard" currency="$" currency_pos="left" price="29" period="/ monthly" subtitle="Vitae adipiscing turpis. Aenean ligula nibh, molestie id vivide." link_title="Sign up now" link="#" target="" icon="" featured="0" style="table" animate=""] <ul> <li><strong>10GB</strong> Space amount</li> <li><strong>Unlimited</strong> users</li> <li><strong> 30GB</strong> Bandwidth</li> <li><span class="no"></span></li> <li><strong>20</strong> MySQL Databases</li> </ul> [/pricing_item]
Label:
[pricing_item image="" title="Basic" currency="$" currency_pos="left" price="12" period="/ monthly" subtitle="Vitae adipiscing turpis. Aenean ligula nibh, molestie id vivide." link_title="Sign up now" link="#" target="" icon="" featured="0" style="label" animate=""] <ul> <li>Space amount</li> <li>Users</li> <li>Bandwidth</li> <li>Enhanced Security</li> <li>MySQL Databases</li> </ul> [/pricing_item]
This Item creates a Pricing page. You can choose among 3 different styles. For example, you can use boxes or tables, with or without labels.
Attributes:
- Image - Select image from Media Library
- Title - Pricing title
- Price - Price
- Currency - Pricing currency
- Currency | Position - Show currency on the left or right side
- Period - Pricing period
- Subtitle - Text will be visible under price
- Content - Pricing content
- Button | Title - Button text
- Button | Icon - Use an icon from the icon's list
- Button | Link - Link (with http://)
- Button | Target - Link target
- Featured - Select Yes if you want an item featured
- Style - Select one of 3 different styles
- 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; }

Basic
Vitae adipiscing turpis. Aenean ligula nibh, molestie id vivide.
- 10GB Space amount
- Unlimited users
- 30GB Bandwidth
- Enhanced Security
- 20 MySQL Databases

Standard
Vitae adipiscing turpis. Aenean ligula nibh, molestie id vivide.
- 10GB Space amount
- Unlimited users
- 30GB Bandwidth
- Enhanced Security
- 20 MySQL Databases

Business
Vitae adipiscing turpis. Aenean ligula nibh, molestie id vivide.
- 10GB Space amount
- Unlimited users
- 30GB Bandwidth
- Enhanced Security
- 20 MySQL Databases

Professional
Vitae adipiscing turpis. Aenean ligula nibh, molestie id vivide.
- 10GB Space amount
- Unlimited users
- 30GB Bandwidth
- Enhanced Security
- 20 MySQL Databases
Basic
Vitae adipiscing turpis. Aenean ligula nibh, molestie id vivide.
- Space amount
- Users
- Bandwidth
- Enhanced Security
- MySQL Databases
Standard
Vitae adipiscing turpis. Aenean ligula nibh, molestie id vivide.
- 10GB Space amount
- Unlimited users
- 30GB Bandwidth
- 20 MySQL Databases
Business
Vitae adipiscing turpis. Aenean ligula nibh, molestie id vivide.
- 10GB Space amount
- Unlimited users
- 30GB Bandwidth
- 20 MySQL Databases
Professional
Vitae adipiscing turpis. Aenean ligula nibh, molestie id vivide.
- 10GB Space amount
- Unlimited users
- 30GB Bandwidth
- 20 MySQL Databases
Slider
If you prefer something other than Revolution Slider we recommend the Slider Item. You can easily show simple slide images by pasting slides on a page.Youadd slides I within the "Slides" section,located on the left side of the WordPress dashboard.
Default code:
[slider style="" category="" orderby="date" order="DESC"]
Attributes:
- style - Select one of 4 available styles: [default], description, flat, carousel or center
- category - Enter category slug or leave empty
- orderby - Select date, menu_order or title
- order - Select ASC or DESC
Example of this shortcode below:
[slider category="About" orderby="date" order="DESC"]
If you prefer something other than Revolution Slider we recommend the Slider Item. You can easily show simple slide images by pasting slides on a page.Youadd slides I within the "Slides" section,located on the left side of the WordPress dashboard.
Attributes:
- Style - Select one of 5 available styles
- Category - Slider items category
- Order by - Select order by column
- Order - Select order
- 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; }