The Ultimate guide on Brave Conversion Engine for WordPress
By Adarsh Sojitra on March 14th, 2021
WordPress is one of the best content management system available in the market. There are many reasons behind it’s popularity. It is flexible and scalable. You can launch any kind of website on the using WordPress. It is completely free to use (open-source). You also do not need any technical knowledge to create a website in WordPress.
WordPress provides us a long list of Free plugins and themes. You can select Themes and Plugins from official WordPress repository.You can use different themes on your WordPress site and switch between two themes immediately. Themes also provides us a list of option for customisation. It means that we can edit any theme from WordPress repository and use it on our website according to our requirements.
Plugins in WordPress allows you to add new features to your website. You can quickly install a plugin to add a new feature to your website. For example, If you want to create an E-mail list, You can use Opt-in Monster, Thrive list, Convert pro and many more.
Now, If you are using or planning to use WordPress to create your website, You have to create an E-mail list. E-mail list allows you to create the community around your blog or website. You can also sell to your E-mail subscribers and earn through Affiliate Marketing. There are a few very effective ways to collect E-mails. One of the best ways is to show Opt-in forms and pop-up boxes.
However, the design of the Opt-in form and it’s content matters significantly on How much your opt-in forms convert. The content depends on the type of your business. However, I will show you can use a Free WordPress plugin to create completely custom pop-up boxes and opt-in forms.
We are going to use the Brave conversion engine to create pop-ups in our WordPress site. It is a free plugin and allows you to create Pop-up boxes and other type of opt-in forms with drag-and-drop Pop-up builder. It is an awesome plugin. Let’s first learn How to install it in WordPress.
How to install Brave in WordPress
Step 1: Log into your WordPress account dashboard with your username and password.
Step 2: After that, click on the “Plugins” option from the left sidebar to access plugins dashboard.
Step 3: Now click on the Add New button which is available at the top of the page. You can also find the Add New tab in the left sidebar.
Step 4: Now, a new plugin page will open on your screen that is your Add Plugin page. You can see one search box also available on the right side of the page. This search box will help you to find the required Plugin easily.
Step 5: Click on the search box and type the plugin name. For Example, Brave. Now find the plugin from the result list and you can see a Install Now button on the plugin box. Click on the Install Now Button to install the plugin.
Typically, this installation process will take a couple of seconds. After the successful installation process Install Now button will change into Activate button as you can see in the below image.
Step 6: Click on the Activate button to finally activate the plugin.
Step 7: After the successful installation, WordPress will redirect you to the plugins page and you will see one notification box that will inform you that your new Plugin is Active.
Step 8: Then, click on the brave Tab to see the Existing Pop-up box in the Plugin.
List of Existing Pop-up Box: Now, click on the Brave tab from the left sidebar. You will see the Campaign box in which you can see some tabs like Pop-ups and Content.
In the Pop-ups tab you will see, a list of your existing Pop-up as you can see in the below image.
So, the Below image is a dashboard of the Brave Plugin, here you will see the details of pop-ups and contents. You can also manage the contents from here.
There must be a Demo popup in the list just after the installation. You can either delete it and start from scratch, or modify it accordingly. We will learn everything about the brave conversion engine in this guide. So, Let’s get started.
How to use Brave Conversion Engine in WordPress
Step 1: Log into your WordPress dashboard with your username and password.
Step 2: Now, click on the Brave tab that is available on the left-sided Tab section.
Step 3: After you click on the Brave tab, it will extend with some options below the Brave Plugin tab. On this page, you will find a “+“ button. The plus button is available on the top-right side of the screen as you can see in the below image.
Step 4: Once you click on the Plus button, You will see a drop-down with the New popup / Widget and New Embedded Content options. Click on the New popup/Widget for the next step.
Step 5: You will see a new screen with the title field and template selection. Enter the name of your plugin according to your requirement.
Step 6: After that, just below the Title you can see a section called Newsletter Subscription. While in Newsletter Subscription you will see some Pre-created Pop-up boxes. So, you can use it as your new Pop-up box. Select the Pop-up box theme from here as per your requirement.
Step 7: For example, we are selecting the highlighted to popup box in the following image. You can select it to follow us through the guide.
Step 8: You can hover of on pop-up box to see a blue icon. This icon will help you to see the preview of this Pop-Up box. Click on it to see the preview of how this pop-up will look like after creation.
Step 9: After the Preview, select the Pop-up and click on the Create Pop-up that is available on the bottom right side of the page as you can see in the below image.
Step 10: And, If you want to create a new Pop-up box with your customizations. Then you can click on the link Start With Blank that is also available at the bottom of the page.
Step 11 – Element List: In this section, you will see the list of elements you can create, like Text, Image, Shape, Button, Form, List, Posts. Let’s understand the elements we do have in the Free version of this plugin.
Step 11.1 – Elements: These are the elements you can use to create your Pop-ups.
- Text:- Generally, this Element Tool will help you to put Text on the Pop-up Box. But, you can use this element and create some designs also.
- Image:- Usually, the Image Tool will help you to put Image on the Pop-up Box.
- Shape:- This Tool Helps you to put Shapes on the Pop-up Box.
- Button:-This Tool Helps you to put a Button on the Pop-up Box.
- Form:-This Tool Helps you to put Forums on the Pop-up Box.
- List:- This Tool Helps you to put a Selectable list on the Pop-up Box.
- Post:- This Tool Helps you to put your newly added website post on the Pop-up Box.
You can also change the properties of the elements. In the next step, we will learn how we can change and customize those Elements.
Step 11.2 – Text Element: The Text element allows you to add text to your Pop-up box. You can create any type of text on your pop-up form and customize it according to your requirements.
When you create a Text element, You will see all the text customisation options in the right sidebar. Some of the customisation options available are text decoration, font family, color, alignment and much more.
Step 11.3 – Image Element: This Element will help you to put Images on your Pop-up box.
To use this Image element Drag & Drop the Element on your required palace on the Pop-up Box.
After you drop the Image element on the pop-up box. Select the Element to see the image element-related settings on the right sidebar. See the below image for reference. Let’s understand each setting in brief.
In the Element setting section, you will find tabs like Image, Style, and Other. Click on the Image tab to see the image-related settings as you can see in the below image.
The first set in the image tab is the Current Image setting. There are also two options available as Static and Dynamic. With the help of the Static option, you can upload and set one image which does not change. With the help of the “Dynamic” option, You can select the dynamic image that changes according to the URL of the page or any other factor.
There are many image settings available for you like Round borders, Opacity, Brightness, Contrast, Blur, Shadow, Flip, Grey scale and much more. There are two important settings in this section. They are:
- Display Border: Now, If you need some border on the Image element. Then this set will help you to give some border with your customization. Just turn ON the Toggle and you’ll see some more settings will expand under this setting. You can choose the Border Color according to your design and Border size too. You can also see one drop-down menu as border style. This setting will help you to give some other effect to the border as dashed and dot.
- Display Overlay: This setting will help you to give some overlay effect to the image as you can see in the image element settings. You can also choose the overlay color from the color box that appears when you turn ON the toggle.
Step 11.4 – Shape Element: This Shape Element will help you to put some shapes. For example, polygon, Circle, Square and use this element on your Pop-up box. You just have to Drag & Drop the Element from the Element section to the Pop-Up box at your required place.
As soon as you drop the element, click on the Shape element to see the settings related to this element.
You will find settings on the right side like Shape type, Fill color, Fix aspect ratio, current shape, border, shadow, blur and many more.
Step 11.5 – Button Element: Button element allows you to add buttons in your pop-up box. You just have to Drag & Drop the button element at your required place on the pop-up box. This button will help you to give clickable effects and redirect the page from the pop-up box.
After you choose the place of the button element, select the button. Just, click on the button element to see the element-related settings on the right-sided setting section as you can see in the below image.
There are two tabs in the settings section in casse of the button element. Let’s first understand the “Style” settings tab first.
- In the style settings, you can modify settings like font family, font size, text color, background color, icon, shadow, roundness and much more. You can customise the look of your button from this section.
- In the Action tab, you can manage the functionality of the button. You can modify settings like Hover animation, click action, make link nofollow and other similar settings.
Step 11.6 – Form Element: Form Element helps us create fully customised forms on our pop-up box. To apply this form Element on the pop-up box, Just goto the Element Section and Drag the Form element. Now Drop the Element on the Pop-up box as per your requirement as you can see in the below image.
Now click on the Form Element to see the settings on the Right-Sided setting section. You’ll see tabs like Form, Style, Action, Other as you can see in the below image. Let’s see each setting In Brief.
The first section allows you to manage fields on your form. You can add, remove or modify fields from this section.
The second section is for styling your new form. It allows you to change settings like form label color, font color, progress bar color and much more.
The third section is very important. It allows you to define the action of the form. You can set an E-mail notification or add the user to the newsletter subscribers list.
Step 11.7 – List Element: You can use this element if you want to create a list on your pop-up form. A simple list can contain your features or benefits of subscribing to your E-mail list. Lists are a great way to express multiple things in a simple manner.
To use the Element you just have to drag the list element and drop it on the pop-up box as per your design place. You can customize these items and the List Item Box too. Let’s see how we can change the List items and the box too.
Click on the List item Box to see the settings related to the list item box on the Right-sided setting section. You’ll see three sections like List, Style, and other as you can see in the below image.
In the first tab with “List” label, you can manage your list items. You can add, remove or modify the list items in the list. To add a new list item, click on the “Add” button visible in the right-side settings section.
In the second tab with “Style” label, you can manage the look of your list on the pop-up box. From this tab, you can update settings like Font family, font size, Line height, text color, Alignment, Text decoration, list type and much more.
The last tab with “Other” label contains animation and CSS class settings.
Step 11.8 – Posts Element: Now the next Element is a post Element which shows your customized post on the Pop-up box. Let’s see how we can use this post element on our pop-up box.
Goto the element list and drag the post element on the pop-up box. Now drop it on your Pop-up box at the desired place. Now click on the post element which you just dropped on the Pop-up box. This click will select the element and show you to possible settings on the Right-Side of the display at posts setting section as you can see in the below image.
Now you’ll find some setting tabs like Posts, Layout, Style, etc. These settings will help you to customize the post element’s post related and style related Settings. So Let’s see each setting section in brief.
Click on the “Posts” setting Section and you’ll see the first Drop-Down menu with the “Type” table, click on the Drop-Down menu.
After you click on the drop down menu, You’ll see some options like Latest Posts, Selected Posts, Related Posts, and Popular Posts. Select the type of posts that you want to show on the Pop-up box.
Now the second set is available as number of posts with a slider setting, This setting will help you to decide how many posts you want to display. By default, it will display 3 posts but you can change it.
The last setting is to decide whether or not you want to display the selected posts in random order. Turn on the toggle if you want to display the posts in random order.
In the “Layout” settings section to modify the layout settings. In this section, you can manage whether or not you want to display things like Full title, Display daye, display category, display image, display excerpt and display character count. The toggle buttons are present for all the settings. You can turn them on or off according to your requirements.
In the “Style” settings section, you can change settings like Font family, title font, content font size, background color, title color and other similar settings related to the look of your posts.
Step 12 – Pop-up Box Settings: Brave also provides us the settings for pop-up box itself. To see and modify the settings related to the whole pop-up box, click on the pop-up box in the preview section.
Now you will see a new panel on the right side that will contain many settings related to the pop-up box. Let’s understand all of them in brief.
- Popup Layout: In this section, you can manage the location of your pop-up box on the screen. You have to select from the 9 possible locations for the pop-up. You can also use the slider to adjust your pop-up on the screen.
- Popup Size: In this section, you can set the height, width and scrollbar for your popup box.
- Popup Style: Here you can manage all the look related settings for your pop-up box like Font family, background, shadow and much more.
- Popup Animation: Pop-up Animation settings allows you to choose the entry and exit animations for your Pop-up box. There are many animations available in Brave, You can select the one that fits the best for your campaign.
- Popup Overlay: From this section, you can set the overlay settings for your Pop-up box. Overlay is the blur or the background when the pop-up box is active. You can either enable or disable the overlay. If you choose to turn on the overlay, you can also update the overlay effects in Brave.
- Popup Close: Here you can decide the close button position, close button icon and close button size. You can also enable Auto-close with various options.
So, this is how you can create and manage Pop-up boxes in Brave conversion engine. You can modify the settings of each element as well as the whole popup box.
Conclusion: Popup boxes are one of the best ways to collect E-mails or leads. If you are a creative kind, you can also start creating the pop-up box from scratch in Brave. If you don’t want to invest a lot of time in creating a popup box from scratch, you can use the ready-made templates too. Brave is a very powerful tool to create awesome pop-up boxes and lead generation forms with almost all the customisations you will ever need.
If you decide to understand Brave conversion engine in detail, you will also discover that not only you can collect E-mails. But you can also display related posts and other post related stuff on the user’s screen at the right time. Finally, this is how Brave conversion engine works. If you are facing any issues while following the guide, let us know in the comment section given below. If you are an Interserver customer, feel free to contact our awesome support staff for help!