Content Grid

Example 1

This shows a PowerPack content grid with 6 Module Posts, a dotted border, centred text and featured image shown. Post meta and post content has been turned off.

beaver builder accordion module
Accordion
Beaver Builder Audio Module
Audio
content-slider2x
Content Slider
Beaver Builder Slideshow Module
Slideshow
social-buttons2x
Social Buttons
testimonials2x
Testimonials

Example 2

One of the more powerful features of PowerPack is the ability to filter posts. Here we are filtering posts by category.

All
  • All
  • Beaver Builder
  • PowerPack
  • UABB
posts2x
Restaurant / Services Menu
beaver builder heading module
Fancy Heading
beaver builder tabs module
Advanced Tabs
beaver builder tabs module
Advanced Tabs
Image & Colour Row Background
beaver builder heading module
Heading

Example 3

This Content Grid restricts the number of posts shown initially to 4 with a pagination module below. Taxonomy overlays in the top right corners show the chosen taxonomy categories for each of your posts.

posts2x
Restaurant / Services Menu
beaver builder heading module
Fancy Heading
beaver builder tabs module
Advanced Tabs
beaver builder tabs module
Advanced Tabs

Example 4

By enabling the content and meta settings you can include these elements within the grid. PowerPack includes a number of pre-defined styles that you can choose from  which alters the positions of each of the elements. Here, post date is shown on the left side with the post content indented to the right.

posts2x
Restaurant / Services Menu

  Example 1 This example shows a more traditional styled restaurant menu. Example 2 Here’s an example of the Restaurant/Services Menu module from PowerPack being used to list business services. Example 3 Here’s another spin on the Services type menu. TOP 3 ADDONS FOR BEAVER BUILDER PowerPack Dozens of addons plus templates. A great asset for designers needing…

beaver builder heading module
Fancy Heading

  Example 1 This is a heading using the color animation. Nature Example 2 This is a heading using the gradient animation. Similar to example 1 except with a gradient instead of a flat color. Nature Example 3 This heading uses the Rotate/Flip Animation option. All of the animations include a time option to set the animation length in…

Example 5

Content Grid also works as a post carousel with powerful options for setting image crops, arrow and carousel dot options.

Example 6

This final example shows a circular cropped featured image and title below with a post filter, centrally aligned. The filter border has been set to only show at the bottom which creates a neat highlight effect for the active filter.

All
  • All
  • Beaver Builder
  • PowerPack
  • UABB
posts2x
Posts
number-counter2x
Number Counter
menu2x
Menu
map2x
Map
icon-group2x
Icon Group
icon2x
Icon
gallery2x
Gallery
countdown2x
Countdown
content-slider2x
Content Slider
contact-form2x
Contact Form
call out module for beaver builder
Call Out
call to action module for beaver builder
Call to Action
beaver builder accordion module
Accordion
separator2x
Separator
content-grid2x
Advanced Posts
[beaver_tunnels] [/beaver_tunnels]

Leave a Comment