BM Content Builder introduction

The creative BM Content Builder is a unique elements Drag & Drop LIVE mode builder. You can create a unique webpage with no coding skills.

After install and activate the BM Content Builder plugin, you’ll see the BM Content Builder button in Page/Post/Portfolio editing panel:

Press the button to pop up the interface of BM Content Builder.

There are 10 useful modules within the builder: Text, Button, Grid, Masonry Grid, Single Image, Content Form, Embed, Social, Slider, and Group

Buttons on top bar

If there are existed content on BM Content Builder, there are several buttons on the top bar: Quit, Save, Add Module, Save Layouts as Template, Insert Template.

  • Click the left-arrow icon to exit this editor.
  • Click the disk icon to save the current content.
  • Click the plus icon to add new modules. 
  • Click “Insert Template”, you could insert some layouts. Learn more 

Tools bar on each module

For the builder is a live model editor, you’ll see the change that you have edited. Move the mouse cursor over the module. The tools bar would be shown.

Video tutorials

Check the video tutorials how the BM Content builder works, the video includes:

  • How to use the tools bar?
  • 12 columns width system(width, move left/right)
  • How to make 2 modules to stay within one line?
  • How to set the top/bottom spacing?

Buttons on the tools bar

Order: To change the module order

Width: To increase/reduce the width. It is a 12 columns width system. The module will be fullwidth if the width is over 12 columns. If you want the 2 or more modules stayed in the same row. Please make sure the width of all modules is less than or equal to 12 columns.

Move to Left/Right. It will obey the rule of 12 columns width. If click the Right arrow one time, it means to move the module to right one column. If it’s width is 12 columns, click once(or more) the Right arrow, it will be moved out of the right edge of the page. Click the Left arrow to move to left. It will not make the module to move out the left of the page.

You could make a 6-cols width module be centered by click 3 times. It will obey the rule of 12 columns width.

Increase / Reduce the top/bottom spacing quickly(20px click once) for desktop only.

If you want to edit the top/bottom spacing for the mobile, please edit the module. Click “Spacing”, you could enter a number to set the “Top Spacing(desktop/mobile)” and “Bottom Spacing(desktop/mobile)” for this module.

Add new module behind(or into for Group module) this module

Unique ID

There is a unique number ID for each module:

The ID would be within class name of module, the class name format would be module-id-1572937975619

Was this article helpful?

Related Articles