Saved

You can Save any Row, Column or Module for use on other pages or posts. Saved Rows, Columns and Modules can be accessed in the following way: In the upper right corner, click (plus sign) to expose the Content panel, then click the Templates tab. Click on a Template of your choice. Click on a […]

Templates

Templates are whole page or post layouts that have been previously saved. To use a Template: Templates can be accessed in the following way: In the upper right corner, click (plus sign) to expose the Content panel, then click the Templates tab. Click on a Template of your choice. Click on a Template to choose […]

Animation

You can assign an entrance animation, which activates the first time the page is loaded and the row, column, or module comes into view. The default is None. To add an animation Click the ADVANCED tab in the Module, Row or Column that you want to animate. Click the Animation dropdown and choose an animation […]

Borders and Drop Shadows

  Border Settings:   Style: Default | None | Solid | Dashed | Dotted | Double   Colour: Choose a colour or preset colour.   Width: Choose a width for the border, clicking the link will lock the widths.   Radius The Radius setting rounds the corners of the border box area to round the […]

Backgrounds

There are many ways different types of backgrounds to choose from. The options available will depend on which type of Module, Row or Column you’re editing.   Color Choose a colour using the Color Palette   Gradient Choose multiple colours using the Gradient Palette.   Photo Choose a Photo from the Media Library or other […]

Colours

Colours displayed on screens are made from Red, Green and Blue (RGB) Colour values can be written in RGB or Hexadecimal. For example: rgb(0,0,0) and #000000 are both black. The Colour Palette Click in the colour spectrum to choose a colour. Or Click Color Presets to pick a saved colour. You can adjust the opacity […]

Width

Full width and fixed width When you create a Row, you can specify whether the Row is full width or fixed width. If you set the row to full width, you also have a choice of whether the Row’s content is full width or fixed width. More Information: ROW SETTINGS:   Expand Tool Descriptions and […]

Margins and Padding

Built-in spacing defaults Rows and Columns have default margins and padding. Modules have default margins. An auto spacing feature for small devices is enabled by default. This feature reduces spacing automatically on mobile devices. This means the layout should look decent at all device sizes without any special effort at manual settings – unless you […]

Rows and Columns

Row layout options are available on any Page or Post. Row layouts can be accessed in the following way: In the upper right corner, click (plus sign) to expose the Content panel, then click the Rows tab. Drag and drop a row layout of your choice onto the page. Then, choose Module(s) to click and […]

Posts Slider Module

In the Posts Slider module, a set of posts or pages is displayed with either a sliding or a fade-in animation. The featured image of each post becomes the background image in the slide (unless you select the option to hide it), with post info and content overlaid on the slide. Click and drag the […]

Posts Module

The Posts module is the non-animated version of the three Posts modules (Posts, Posts Slider, Posts Carousel), and it has the most versatility with layouts, settings, and content filters. Click and drag the Posts Module onto the page…   The LAYOUT tab Expand   Layout   Posts   Featured Image   Post Info   Post […]

Post Carousel Module

In the Posts Carousel module, a set of posts or pages is displayed as a single row of posts in either Grid layout or Gallery view. The Grid layout displays a post title and info underneath the featured image. The Gallery view displays a post title and info replacing the featured image on mouseover. Click […]

Number Counter Module

The Number Counter module displays a number in an animated fashion, with the counter going from zero to the number or percent you specify. Click and drag the Number Counter Module onto the page…   The GENERAL tab Expand   Layout   Type   Number   Text Before   Text After   Animation speed   […]

Countdown Module

The Countdown module is a timer that counts down to zero from a date and time that you specify. You can specify the exact date and time, including choosing the timezone that should be used. There are a number of styling settings for customizing the look of the countdown timer, including the choice of numbers […]

Tabs Module

Use the Tabs module to insert tabbed text content into your layouts. This is a great tool for inserting large amounts of text into a small space. Click and drag the Tabs Module onto the page…   The TABS tab Expand   Items: Add items as desired. When Edit Item is clicked another window will […]

Sidebar Module

The Sidebar module gives you the ability to insert any of your WordPress sidebars into your layouts. The widgets in the sidebar can be configured by going to Appearance > Widgets in the WordPress admin panel. Click and drag the Sidebar Module onto the page…   The GENERAL tab Expand   Sidebar: Choose a sidebar. […]

Pricing Table Module

The Pricing Table module lets you insert a pricing table with as many columns as you like. You can configure options such as column color, title, price, frequency for recurring costs, a feature list, and a button. Click and drag the Pricing Table Module onto the page…   The PRICING BOXES tab Expand   Add […]

Accordion Module

  COMMON USES Expand An accordion is great for whenever you have a list of items with details that you don’t want to clutter the main page with but want the information easily accessible. Here are some good uses for the Accordion module: FAQs Q&A Feature lists One or more items in which you want […]

Subscribe Form Module

Use the Subscribe Form module to provide a form for visitors to subscribe to an email list or to collect email addresses for your own use. Click and drag the Subscribe Form Module onto the page…   The GENERAL tab Expand   Service: Choose the platform that want to use.   Structure: Setup the layout […]

Contact Form Module

The Contact Form module displays a basic contact form with the following properties: The form can display Name, Subject, Email, Phone, and Message fields. The labels and placeholder text for these fields can be customized. By default, the Name and Email fields are displayed, and the Subject and Phone fields are hidden. Any fields that […]

Menu Module

  COMMON USES Expand The Menu module can give you more options for menu content, style, and layout than the menu available in your theme or widget area. It also gives you the ability to insert a menu anywhere in your layout. Here are some ideas: Use special menus in your Beaver Builder page layouts. […]

Call to Action Module

With the Call to Action module, the emphasis is usually on the button. The point is to get the visitor to click the button to take an action on your website. Often much of the preceding page is the lead-in to funnel the visitor into wanting to click that button. By that point, no image […]

Callout Module

The callout module tends to be used in groups, often to highlight the features of a business that send the visitor to the appropriate page of the site. Click and drag the Callout Module onto the page…   The GENERAL tab Expand   Heading   Heading Tag   Text: Enter the text content.   The […]

Testimonials Module

  COMMON USES Expand Use the Testimonials module to add a basic slider with testimonials to your layouts, or any other set of text and images that you want to display one by one with either autoplay or navigation. If the Testimonials module is the only module in a row, select Wide so it takes […]

Slideshow Module

Use a slideshow module when you want to display a set of images in the foreground, one at a time.   COMMON USES Expand Besides the traditional horizontal slide transition, there are a number of other types of transitions from one image to the next, as described in the Playback tab section below. The images […]

Map Module

The Map module inserts a Google map with a marker pointing to an address you specify. The map automatically adjusts in size to fit in the column, and you can specify map height. The default is 400px. You can also use either px or vh as units for map height. There’s a setting to add […]

Icon Group Module

  COMMON USES Expand One good use for an icon group would be to display the icons for various credit cards. In this example, all of the icons were styled the same color. Another example is using the Icon group to display social media icons with links The Icon Group Module inserts a group of […]

Icon Module

The Icon Module lets you insert icons from Font Awesome, Foundation, or WordPress into your layouts. The Icon module comes with a text editor, where you can enter and format text that will appear to the right of the icon. You can add a link, which applies to both the icon and the text. If […]

Gallery Module

  COMMON USES Expand The Gallery module is used to display a collection of individual photos in a pleasing fashion. Depending on what happens when users click a module (see the section on the module’s settings), you can use the Gallery module to: Display the series of photos one by one in a lightbox with […]

Content Slider Module

  COMMON USES Expand The Content Slider module can work well when you want to construct a relatively small set of slides with overlaid content by hand, as opposed to generating the slides automatically with posts, pages, or a custom post type, in which case you’d use the Posts Slider module. One use would be […]

Video Module

Use the Video module to insert a video into your layout. The source can be either of the following: A video from the WordPress Media Library Embed code provided by a third party such as Vimeo or YouTube. An important part of the Video module is what goes on behind the scenes. You can add […]

Separator Module

The Separator module inserts a horizontal line to separate content. It can be styled for color, size, and spacing. Click and drag the Separator Module onto the page…   The GENERAL tab Expand By default, the Separator line is 1 px high, 100% wide, and a light gray color.   Color: Choose a colour for […]

Text Editor Module

  COMMON USES Expand The Use the Text Editor module to add a block of text. The Text Editor module uses an instance of the standard WordPress editor. The difference is that you have more control in positioning the text on the page. You can add headings images, and make simple changes to text formatting, […]

Photo Module

The Photo module lets you insert an individual photo from your WordPress Media Library or a custom URL. Click and drag the Photo Module onto the page…   The GENERAL tab Expand   Photo Source: You can select the photo from your Media Library or use a URL. If the file is from the Media […]

HTML Module

The HTML module lets you insert custom code and markup into your layouts that is rendered directly to the HTML output.   COMMON USES Expand Use the HTML module to add text, markup, and code such as HTML table markup, shortcodes, or JavaScript. The HTML module is better for adding markup and code than the […]

Heading Module

The Heading module inserts a heading into your row that is rendered with a heading tag (H1, H2, etc.) in the HTML output.   COMMON USES Expand While you can create headings right in the text editor, here are some advantages to using a Heading module: You can more easily move the heading around in […]

Button Module

  COMMON USES Expand Traditionally, a web button is a pretty package for a link that sends visitors elsewhere when clicked. The Button module’s button can also open a lightbox that displays a video or any other content that you can insert with shortcut or HTML. Click Action: Link or Lightbox You can set the […]

Audio Module

Using the Audio module, you can insert one or more audio files from the WordPress Media Library or a single audio file from an external source, plus choose some playback options. Using audio files from the Media Library When you choose the Media Library option in the Audio module, click the link to choose one […]

Quickstart: Drag and Drop Page Editor

How to login Open a web browser such as Safari, Chrome, Firefox or Edge Go to your website Add wp-admin after the / The address bar should then read: mywebsite.com/wp-admin Enter your Username & Password or click Forgot Password Website Editing Toolbar Once you’re logged in, the main website editing toolbar will appear at the […]