Posts Carousel
Example 1
In this example, we're displaying all of our posts and limiting them to 3 per row. You can set the number of posts displayed by manipulating the post width. In order to progress to the next slide, you would need to click on the dot indicators.
Example 2
This is a gallery carousel with a hover effect. In this example we've removed the dot indicators and added the left and right arrows.
Example 3
By removing the featured image and adding in the post content, you can created a post preview block. In this example we've opted to make the post column heights equal.
Countdown
Example 1 The default number counter shows days, hours, minutes and seconds. There are no options to display years. The number counter is always centrally placed in the column or row. Day Hour Minute Second Example 2 Change the number and text size and colour and add a separator between them. Day Hour…
Read MoreMenu
Example 1 This is the default menu module layout showing a simple menu with a 15px font, spaced at 10px between links. Example 2 In this example we’re showing a menu with sub-items, indicated by including a down arrow. Example 3 In this example we’ve taken the same menu and applied a background and…
Read MoreIcon Group
Example 1 A simple icon group showing a draining battery. In this example, the 4 icons are left aligned, sized at 40px with 30px between them and coloured yellow. Example 2 Within the Icon Group modules individual icon settings is a style tab to assign colours to each icon. In this example the American Express,…
Read MorePosts Carousel
Example 1 In this example, we’re displaying all of our posts and limiting them to 3 per row. You can set the number of posts displayed by manipulating the post width. In order to progress to the next slide, you would need to click on the dot indicators. Example 2 This is a gallery carousel with…
Read MoreVideo
Example 1 This is a self-hosted mp4 file that is set to loop once you have started the video. Example 2 This is a Vimeo embed. Unlike the self-hosted option, there are no settings within the Beaver Builder video module to allow for the video to start automatically or loop indefinitely.
Read MoreTabs
Example 1 The default tab container shows the tab title with the active tab coloured grey. Tab 1 Tab 2 Tab 3 Tab 1 Tab one content Lorem ipsum is a pseudo-Latin text used in web design, typography, layout, and printing in place of English to emphasise design elements over content. It’s also called placeholder…
Read MoreIcon
Example 1 This example shows a simple icon with right aligned text. Text is controlled through the WordPress editor so you can set it as a heading or paragraph text accordingly Example 2 In this example, we’re using an icon on its own – the icon is coloured white with a blue circular background. Backgrounds…
Read MorePricing Table
Example 1 The default pricing boxes with the pricing row highlighted. Item 1 $20 per Onth Feature 1 Feature 2 Feature 3 Get Started Item 2 $35 per month Feature 1 Feature 2 Feature 3 Get Started Example 2 In this example, we’re placing more emphasis on item 2. Item 1 $20 per month…
Read MoreContent Slider
Example 1 This is the default image slider set to show only images as slide backgrounds. If your images have different height dimensions, the slider will automatically crop them to the slider height size. Example 2 This example shows the content slider headline and text followed by a call to action button and a right…
Read More