Installation

The Themefyre Page Builder is only available for installation through the purchase of a compatible premium WordPress theme from Themefyre.

Once you have purchased a compatible WordPress theme, and followed the instructions for installing the theme found in the themes accompanying user guide, you can install the page builder by doing the following.

  1. Navigate to Appearance > Install Plugins from your WordPress dashboard.
  2. Locate Themefyre Page Builder in the list of available plugins.
  3. Press the Install button immediately below the title.
  4. Return to your list of installed plugins, and activate the plugin.

Post Types

By default, the page builder will be enabled for pages and posts only. It is possible to add support for any custom post types, so long as they are publicly viewable. Please note that the page builder may not work exactly the same for all post types, due to differences in the way they are displayed.

Enabled post types can be managed by navigating to Settings > Page Builder from your WordPress dashboard, check the post types you wish to enable the page builder for under the option for Post Types and save changes.

Icon Fonts

This plugin comes with six different icon fonts that can be enabled/disabled to your preference. It is strongly recommended that you minimize the number of enabled icon fonts as much as possible. This is because each set will load an additional font face to your site, which may negatively affect overall performance.

Icon fonts can be managed by navigating to Settings > Page Builder from your WordPress dashboard, under the option for Icon Fonts.

Google Fonts

Google Fonts is one of the easiest and most efficient ways to add custom font faces to your website. Any font found in the Google Fonts library can be easily added to the page builder.

  1. Pick one or more fonts you’d like to use from the Google Fonts library.
  2. Return to your WordPress dashboard, and navigate to Settings > Page Builder
  3. Under the option for Google Fonts locate the font you’d like to add by using the dropdown.

General Usage

The following sections explain how to build complex pages using the page builder, and how to get the most out of its functionality.

Controls

  • History: Full undo/redo functionality while editing content can be leveraged using the two undo/redo icons in the toolbar, represented by two arrows facing in opposite directions.
  • Reset: You can remove all modules from the current page by pressing the trash can icon in the toolbar. Please note that this can be undone using the undo button only until your changes have been saved.
  • Instant Preview: The fastest way to build pages is by enabling this feature. WordPress comes with a way to preview your content before saving it, this control is simply an aid to that functionality. When this control is enabled, anytime you make a change to the page builder the preview will automatically be updated.
  • Template Manager: The template manager can be launched by pressing the corresponding icon in the toolbar (it looks like a download icon).
  • Custom CSS: You can add custom CSS specific to the current page by pressing the paint brush icon in the toolbar.
  • Fullscreen: Toogle fullscreen mode by pressing the corresponding icon in the toolbar. While in fullscreen mode you will be able to preview/save changes and view the current page you are working on.

Templates

Premade Templates

The page builder includes several basic premade templates to help you get started right away. Simply select one of the available templates and click it. Once the content has been loaded it will be appended to the current page/post.

Certain themes/plugins may provide additional premade templates that you can select from, if this is the case they will appear below the templates that are included with the page builder.

Custom Templates

In addition to the included premade templates, you can easily create your own by saving the current page you are editing as a template. Simply give it a name and press “Save Template” after your template has been created it will appear in the list of available custom templates.

Custom templates can also be imported/exported using the native WordPress exporter and importer plugin.

Import Page/Post

When editing a page using the page builder you can import the content from any other page/post that has the page builder enabled. Simply locate the page/post you would like to import, and its content will be appended to the current page/post.

Custom CSS

This plugin includes a simple way for you to add custom CSS to individual pages. Simply press the paint brush icon in the toolbar and a modal window will open with a syntax highlighted CSS editor. Any CSS entered here will only be applied to the respective page it was entered on.

Hierarchy

The page builder can be thought of as being organized into three levels. These levels are full width modules, row modules, and content modules. Full width modules are intended to divide your content vertically and fill the screen horizontally, though this depends on the active theme and post type. Row modules are responsible for organizing your content horizontally and can be used to split your content into columns. Content modules allow you to fill your page with all kinds of content and elements.

Modules

Each module within the page builder represents a shortcode. To learn more about using shortcodes with WordPress you can check out this page in the Codex. Shortcodes can be tough and unintuitive to work with, which is why this page builder uses visual modules allowing you to more easily build your pages. These modules can be edited, duplicated, or deleted altogether.