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.

Posts

By Michael Davis | September 25, 2016

  Example 1 Here we have set up 3 posts with title, author and date displayed. Example 2 This examples shows posts as a gallery with information displayed on hover. Example 3 This examples uses a masonry grid format to display the posts with an excerpt. Example 4 This example uses the feed format with featured images to…

Read More

Slideshow

By Michael Davis | September 25, 2016

  Example 1 In this example were showing cropped images with a ‘Ken Burns’ effect and fade transition. Slide show starts automatically and we’re handing all controls. This is a good solution for full width rows too. Example 2 Here’s we showing the same slide show but with all controls enabled on hover. This slideshow…

Read More

Button

By Michael Davis | September 29, 2016

Example 1 A standard solid button with a 4x rounded corner. This button has a transition animation that initiates when the user hovers over the button. The button width is set to auto. CLICK ME Example 2 This is the same button but we’ve set the width to 200px. CLICK ME Example 3 A full width…

Read More

Subscribe Form

By Michael Davis | September 25, 2016

Example 1 This is the standard, stacked subscribe form set to collect name and email address. Example 2 In this example we’ve opted to collect emails only and created an inline form and button. Example 3 Using the standard Beaver Builder button settings, we can add icons and style the button to suit the page…

Read More

Posts Slider

By Michael Davis | September 25, 2016

  Example 1 This example uses the post slider with a thumbnail image set to left aligned. Best for viewing on large and medium devices. Example 2 If you prefer that your featured image occupies the entire background of the post, select ‘background’ from the featured image options. Here we’ve added a left aligned post title and…

Read More

Audio

By Michael Davis | September 22, 2016

Example 1 – Self Hosted mp3 Thirteen Thirtyfive by Dillon from the album The Silence Kills. Downloaded free from Last.fm Example 2 – URL Streaming Vivaldi: Autumn from The Four Seasons streaming from mfiles.co.uk

Read More

Content Slider

By Michael Davis | September 25, 2016

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

Separator

By Michael Davis | September 24, 2016

Example 1 Separators can act as simple dividers between content. In this example, we make a single line to divide two examples. Example 2 In this example, we’ve created a dashed line, increased the separator’s width to 5px and changed the colour to yellow. Example 3 In this example, we’ve increased the separator’s width to 15px…

Read More

Accordion

By Michael Davis | September 24, 2016

  Example 1 In this first example, the accordion is set with default options, showing only the label and a light grey surrounding box. If you open subsequent accordion rows, the others will remain open. Accordion Label 1 This is the accordion content. You add content using a standard WordPress text editor. Using the editor…

Read More

Photo

By Michael Davis | September 23, 2016

  Example 1 In this example, we’re displaying a simple image file with a link back to this post. Example 2 In this example, we’re displaying the same image but adding lightbox functionality when clicked. Example 3 In this example, we’re displaying a photo along with the image caption. You can choose to show the caption…

Read More
[beaver_tunnels] [/beaver_tunnels]

Leave a Comment