Colorist

Elegant Business Theme

Ask a Question

How to use page builder

  1. Click on Page Builder in edit screen

  2. There are 8 parts in page builder editor

    1. Adding a row and columns

      Think of rows as individual sections in your page, for example services icons section on home page. By clicking this button, you to enter no. of columns and click Insert

    2. Adding a widget

      To add widget to a particular column, select it by clicking on it, it highlights, and then click on Add widget button. By clicking, you're presented with a popup that contains all the available widgets to you to use. Select a widget from list of widgets, fill in details / select options for that widget.

      After adding a widget you can do 3 things with it. 1) Edit 2) Duplicate 3) Delete These options are available to you when you move mouse over the widget

    3. Prebuild layout option, which you don't need with this theme
    4. Click the button there are three available Option.Options are Edit Row,Duplicate Row,Delete Row.
    5. The up/down icon acts as a handle to pick up and drag the row up or down.
    6. Icon shows the History or when the previous changes are madeup for the particular page.
    7. Click on this button for Live Editing.
    8. Row and columns. Image represents a row with single column
    9. Click Attributes Icon. Available Option are Row Class,Cell Class,CSS Styles.
  3. There are 4 parts in Row Styles

    Goto Edit Row option from page builder editor

    1. Goto Attributes

      1. Enter the Class Name of the particular row.
      2. Enter the Class Name of the particular cell.
      3. Enter the CSS Style text.
    2. Goto Theme

      1. Enter the URL of the Background Image which you want.
      2. Enable if you don't want the bottom margin.
      3. Select the Bottom border color which you want.
      4. Enable if you wanted to repeat the background image.
      5. Select the Background color which you want.
      6. Select the Top border color which you want.
    3. Goto Layout

      1. Enter the Bottom margin(space below the row)value and also select one of the dropdown option. Available dropdown option are px,percentage,in cm,mm,em,ex,pt,pc.
      2. Enter the Gutter(Amount of space between the column)value and also select one of the dropdown option. Available dropdown option are px,percentage,in cm,mm,em,ex,pt,pc.
      3. Enter the Padding(Padding around the entire row)value and also select one of the dropdown option. Available dropdown option are px,percentage,in cm,mm,em,ex,pt,pc.
      4. Select the Row Layout.Available option are Standard,Full Width,Full With Stretched.
    4. Goto Design

      1. If you want background image for the particular row, Upload a backgeound image which you want.
      2. Select the background image display. Available option are Tiled Image,Cover,Centered with original Size.
      3. Select the border color of the particular row which you want.
    5. Click on save when you're done.

How to create a page with help of pagebuilder

  • Goto create page with help of pagebuilder