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.
Number Counter
Example 1 A simple percentage counter… Go 100% End Example 2 Add prefix and suffix text to your counter. This example is showing a count up to 100 timed over 100 seconds. Count up to 100 Start –100– End Over 100 seconds Example 3 Add a circular indicator and slow down the counter to represent,…
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 MoreCountdown
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 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 MoreTestimonials
Example 1 In this example we’re showing a slider of testimonials with a customised header. Awesome feedback from our customers What an awesome experience this has been. Our day out hot air ballooning will never be forgotten! We’ll always cherish our night-time hot air balloon experience! Thank you team for a wonderful time. Example 2…
Read MoreSocial Buttons
Example 1 This example shows the default display of all of the social buttons – Facebook, Twitter and Google+. Other than limiting which buttons are displayed there are no other settings to adjust.
Read MoreGallery
Example 1 In ‘Thumbs’ mode, the gallery module will display the thumbnail version of your images. In this example, our thumbnails are set to 150 x 150px in the media library image settings. If you change this to say, 200 x 200px, BB will display that size of image in the gallery module. Example 2 In this…
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 More