WPBakery Page Builder
Webnus Themes comes with a Visual Page Builder. This software allows you to forget about shortcodes and create most complex layouts within minutes without writing a single line of code!
Our Visual Page Builder is based on the widely popular WPBakery Page Builder by mixey . It has very simple and intuitive interface, but before getting started with building layouts, you may find it useful to get accustomed with WPBakery Page Builder documentation:
To start creating a new layout click BACKEND EDITOR button on the top left corner below title
Now WordPress editor is changed to WPBakery Page Builder canvas. You can work with it just as you do with regular WPBakery Page Builder.
After clicking “Add element” button, you’ll notice a vast set of interface elements (shortcodes) developed exclusively for your theme. Their interface is built on the same principles as standard WPBakery Page Builder shortcodes. Therefore, if you’re already familiar with WPBakery Page Builder, working with our shortcodes will be very simple for you!
Elements Blocks :
this image shows the list of all shortcodes that you can use in webnus themes. You can use category filter and search element name field to find your shortcode much quickly. and you can find all webnus shortcodes in webnus shortcode tab
In this image, we explained all row options. These are the list of options:
- Section Setting
- Row setting
- Inner Row
- Inner Row Setting
- Column setting
- Column layout
- Delete column
- Add element in row
You can divide each part of page by different sections and use Bootstrap 12-column row within the sections. This option is available automatically, if you add a shortcode to the page, you will have the main section and row.
Add a new section and immediately after the section, you need to put a row.
In General Settings, settings tab, you can:
- Check Stretch Content (full width content) to make section use as full width.
- Full height section will show the section in every screen as full screen. If you don’t check this option, you can put the height value in the beneath field. If you don’t put this value, it will be set based on your page elements automatically.
- In this tab, you can set Content Position and you can also adjust Overlay Pattern and some settings such as text center align or white color for section.
In the next tab, you can set background and its adjustments.
In shape divider, you can use section as a shape. Check this image and shapes.
The next tab is background video and the next one is animation, which you can set the way the section appears.
The last section is Class and ID which are used for customizing or creating the mega menu.
ROW settings are like section, but the difference is that it doesn’t have shape divider and you can set here to be full width. Also, in row setting, we have styling tab which you can set padding – margin – border.
In addition to Background and Design in inner row settings, which do the styling function in a row, we have some section and row options in the general tab.
We have the same styling for a row which is in a row for padding – margin – border – background in the column too. In the General tab, you have the possibility to customize ID and Class, but there is a new tab which gives you the possibility to do the minor adjustments for responsive mode. This tab is for the Responsive Options.
The items mentioned above, are the main structure for building a page which you can put shortcodes in ROW, Inner ROW, and Column.