User Guide

This is MOTOCOM theme documentation, containing helpful information, features and detailed instructions about how to use the theme.

1. General Information & Installation

1.1 Introduction

When it comes to the world-class WordPress themes with impressive features and stunning designs, no competition stands at par with Moto Theme . Moto Theme is loaded with various customizable tools and exciting features. It provides categorized themes and templates that are built uniquely according to their niche. Creating websites has never been this easy and fun before.
Moto Theme is the top-notch platform to provide a diverse variety of trendy and mindblowing themes featuring different niches such as E-commerce, Online Food Ordering, Listing Based Business, Real Estate Market, etc with features and designs that are bound to impress your target audience.You can pick from our 100 hot-selling layouts or build your own masterpiece with ease. With Moto Themes, you empower yourself to build stunning Single and Multivendor websites of your own even if you are not at all familiar with coding. Explore the unlimited possibilities of creating an exceptional website with Moto Themes.

1.1.1 Key Features

MultiPurpose: - The theme supports 17 business niches E-commerce, Online Food Ordering, Listing Based Business, Real Estate Market, Events Management, Deals Website, Mobile App, Digital MarketPlace, Online Music Selling Business, Online Courses, Job Portal, News And Magazine, Web Hosting, Booking based Business, Question Answer, Review Website, and, Dating And Matching.
Autoupdate System: - The theme has an auto-update system so that users can directly update the theme without reinstalling it.
Autoupdate Custom Plugins: - All custom plugins have an auto-update system so that users can directly update the plugins without reinstalling it.
Mega Menu: - With the help of Mega Menu, you can easily add several widgets column-wise, configure them and create a great vertical mega menu.
Drag & Drop Page Builder: - WPBakery Page Builder plugin for WordPress takes full control over your site. Build any layout you can imagine with intuitive drag and drop builder no programming knowledge required.
Google Analytics & Google Adsense: - Google Analytics/Adsense is also added to the MOTOCOM which display tool on your website to host third-party ads that are relevant to your audience and also Custom code which comes in many shapes and forms. Often, custom code is used to connect two systems together, which is known as point-to-point integration.
Redux Framework: - Redux is a simple, truly extensible options framework for WordPress themes and plugins. It is easier than ever to build your block-based site fast.
Revolution Slider: - Slider Revolution is an innovative, responsive WordPress Slider Plugin that supports the MOTOCOM Theme.
One Click Demo Installation: - Using this feature, the user can install a full demo website with a single click.
Customizable Footer: - Footer customizer provides users to create their own style footer in an easy way.
Customizable Header: - Header customizer provides users to create their own style Header in an easy way.
RTL: - MOTOCOM Theme is well supported right to left functionality.
Cross Browser Compatible: - MOTOCOM theme has the ability to function across different browsers.
Responsive: - MOTOCOM theme looks good and works well across devices, no matter whether it is a laptop, desktop, mobile, or tablet.
Multiple Sidebar Options: - MOTOCOM theme includes multiple sidebar options.
Retina Ready: - MOTOCOM theme serves retina-ready graphics which displays a sharper and brighter image and more vivid colors.

1.1.2 System Specification

It will match all the requirements of our theme to your system. If any of the required detail comes in red then sort out the issue because these all are the basic requirements of our theme, so try to fulfill all the required details.

1.1.3 Created Date

Created : "03/05/2021"

Version : 1.0

By : Moto Themes

Email : support@motocom.co

1.2 Theme & Plugins Installation

To install this theme you must have a working version of WordPress already installed. If you need help installing WordPress, follow the instructions on WordPress Codex. Below are all the useful links for WordPress information.

WordPress Install - General info about WordPress and how to install on your server.
First Steps With WordPress - General info about multiple topics about WordPress.
FAQ New To WordPress - The most popular FAQ's regarding WordPress.

1.2.1 Download Theme

To download the theme user has to navigate our member area. For that click here.

Note - Users will get the member area login details via mail, which they used at the time of their purchase. If in case, they didn't receive login info, then please contact to our support team via support@motocom.co

After login to the member area, you can download the theme by clicking on Download button as shown in the screenshot. After this, you can see motocom.zip(main theme, which you have to install), motocom-child.zip .

motocom.zip - This is the main theme which you have to install.

motocom-child.zip(Child Theme) - This is the optional theme, and it is not necessary to install this theme with motocom.zip.

A child theme is a theme that inherits the functionality and styling of another theme, called the parent theme. Child themes are the recommended way of modifying an existing theme.

Why use a Child Theme?

If you modify a theme directly and it is updated, then your modifications may be lost. By using a child theme you will ensure that your modifications are preserved.

1.2.2 Theme Installation

You can install the theme in two ways through WordPress, or via FTP. The motocom.zip file is the Installable WordPress Theme and that is what you need to use to get the theme installed. Please see the following sections for each method.

Installation via WordPress:
Installation via FTP:

Installation Via WordPress

How To Install MOTOCOM Theme via WordPress?

Step 1 - Navigate to Appearance > Themes.

Step 2 - Click Add New and click the Upload button.

Step 3 - After successfully installing the theme don't forget to activate it.

Installation Via FTP

How To Install MOTOCOM Theme via FTP?

Step 1 - Log into your hosting space via a FTP software.

Step 2 - Navigate to WordPress root directory >> WP Content >> Theme then unzip the motocom.zip.

Step 3 - After unzip the theme navigate to Appearance >> Themes and activate MOTOCOM Theme.

Authentication Key

After theme installation, you will get redirected to the authentication page where the system asks to enter the license key. You need to enter the key which you will get from the member's area.

1.2.3 Plugins Installation

After you have successfully authenticated you will get a message and for the plugin, installation clicks on the Click Here. When you click on the link you will be redirected to the plugins page.

In the Plugins Screen, you will see the plugins of 17 niches along with the Basic Required Plugins

Now, the user will get the two options for installing the plugins.

Auto Install - When a user clicks on this option all the plugins will be automatically installed and they will get a notification for that.
Manual Install - When a user clicks on this option, users have to install all plugins manually and also activate it.

Below mentioned plugins are the Basic Required Plugins

Form Builder - Build Contact Forms, Newsletters, using this plugin.
Redux Framework - Redux is a simple, truly extensible options framework for WordPress themes and plugins.It is easier than ever to build your block-based site fast.
WPBakery - Drag and drop page builder for WordPress. Take full control over your WordPress site, build any layout you can imagine – no programming knowledge required.
Slider Revolution -Premium responsive slider plugins,which allows you to create rich and dynamic content on your WordPress websites. And not just sliders: it allows you to build carousels, content modules, and full-fledged websites by using the rich built-in editor!.Get the video tutorial to learn more about the plugin.Revolution Slider Video Tutorials

1.3 Update Theme & Plugins

No need to reinstall for updating the theme. You will receive an automatic update notification message if the update is available for the theme and plugins. Users can directly update all these as usual as WordPress default theme and plugins.

2. Demo Content

After the successful installation of the theme and plugins, the next step is to install demo content for which you have to must install the Demo Importer plugin. This step is required if you go with the ready-to-use websites. But if any user wants to make their own website with MOTOCOM Theme then it is optional.

User will get 10 niches demos with FrontEnd Purchase and 7 more niches demos with OTO1 . You can download these demo content from the Member's Area

MOTOCOM Demo Importer - Users can download the MOTOCOM Demo Importer plugin from the Member's Area . After that, you can access the demo content of the niche which is suitable for your business.

3. Theme Options

The MOTOCOM theme options panel has been specially created to make your work faster and easier. These options are very easy to use and in a few minutes you can change a lot of things on the website.

Navigate to Dashboard >> Theme Options

3.1 Demo Importer

Please make sure, you have installed Demo Importer Plugin. This is the required plugin if you want to create a site with our readymade websites.

Navigate to Theme options >> Demo Importer

To install demo content please follow the below mentioned steps:

Firstly you need to navigate to the Demo Importer tab of the Theme Options panel.
Then you will get only those demos that you have downloaded from Member's area.
A preview popup appears when you hover on any demo, and by clicking on it you can see a demo preview .

After clicking on the Import Demo Button, you have to wait for some time because the demo will load from our server to your site.
Sometimes, due to the internet speed or server configuration issue, it will halt the process, if the progress bar stops moving ahead it means, Demo importer process has halted.
In this condition, you have to re-click on the Import Demo button.
After a successful import, the Import Demo Button name will be change to Imported and the name of the demo appears in front of the Imported button.
Then a Set As Demo Button will appear when you hover on Imported Button, it is an optional button. It is required when you install multiple demos and want to switch to the last imported demo, then you can click on this button because the last imported demo will automatically set.

3.2 Under construction

If your sites get crash or getting an upgrade, then this option is useful because, If anyone tries to open your site at that time then the user will see an "Under Maintenance or Under Construction" message.

Under Construction Mode - You have to enable the “On” button to use the Under Construction Option.
Select Template - By this option, you can select the template which you want to display in Under Construction Mode. Here we have added screenshots of some under-construction template. User can add any of the templates as they need.
Custom Text -By using this feature user can add customize the heading and description of an under-construction page.
Heading - You can add the heading of the custom text here.
Description - You can add the description of the page here.

3.3 Login Screen

Using this option you can set WordPress Default Login Screen Settings and enable to change the appearance of the WordPress Login Screen.

WP Login Logo - Here you can upload the logo for the login screen.
Body BackGround Type - You can choose the background type of the page. Two options are there to choose the background type either as color or image.

Note

1. If you have chosen the color as a background type then you have to set the background color.

Background Color - User can choose any color for the background and can also choose a transparent color.

2. If you have chosen the image as a background type then you have to set the background image for the login screen.

Background Image - You can upload the background image for the login screen as needed.

Text color - User can choose any color for the text of the login screen and can also choose the transparent color.

3.4.1 Pre Header

The preheader will be visible before the Main Header. You can add here some general info like Search Box, Simple Text, Social Icons, etc.

Pre Header - You have to "On" the button to get the pre-header settings.

General Settings

A user can enable the general settings like background color, text color, width, divider of the pre-header.

Sorting - Drag and Drop Elements. The top three elements will work at a time. You can set any three menus from here.
Background Color - You can set any background color of the pre-header and also you can set the transparent color.
Text Color - You can set the color of the text and also you can choose the transparent color.
Width - You can select the width of the preheader. There are two options available for this narrow and wide. You can choose according to your need.
Divider - If you want to use the divider then select the checkbox.

Search Form Settings

Using this option user can set the search form like search type, button color, button hover color, etc. These settings will be applicable only for the pre-header search form.

Search Type - Users can set the type like gallery, media, posts, pages according to the need of the business.
Button Border radius - By this option you can adjust the radius of the button border but, enter the value in the given format (10px 10px 10px 10px OR 10px 20px). You can change numerical value as needed. Please don't add comma(,) between the values.
Button Color - In button color, there is a color option in which you can choose any color for the button and also you can choose a transparent option.
Button Text Color - In button text color, there is a color option in which you can choose any color for the button text and also you can choose a transparent option.
Button Hover Color - In button hover color, there is a color option in which you can choose any color for the button hover and also you can choose a transparent option.
Button Text Color On Hover - In button text color on hover, there is a color option in which you can choose any color for the button text and also you can choose a transparent option.

Text Field Settings

These settings will be applicable only to the text of the pre-header. You can set an icon, insert the text, etc.

Enable Icon - To use the icon with text turn “On” the button.
Icon Select - Choose an appropriate icon from here.
Icon Color - In icon color, there is a color option in which you can choose any color for the icon and also you can choose a transparent option.
TextField - Add the text line according to your need. And if you need words in bold then wrap it in a span tag.

Login / SignUp Button Settings

If the user selected the login/signup menu in the general settings then this setting will be used to set the style of the login button.

Style Users can set the style of the login/sign up button as required. Two options are available: Basic and With icon.

Link Settings

Using this feature, the user can set link of the additional pages within a pre-header as they needed.

Select Page Links - User can select pages which they want to set in pre-header.
Links Color - Users can set the color for links and can also choose the transparent color.
Links Color On Hover - User can set the hover color for links and can also choose the transparent color.

3.4.2 Main Header

The main header is the top header of the website where all primary menu resides. Users can change the design of the main header of the site with the help of the below-mentioned settings as per need.

Main Header

Main Header holds the primary menu of the site.

Site Logo - Using this feature users can set the logo in the main header area.
Favicon - In this setting, the user can set a favicon for the website.
Width - In this setting, users can select the width of the header. MOTOCOM theme has two options for this narrow and wide.
Header Style - In this setting, users can select any header style according to their business needs. There are 14 header styles available and we had also attached the screenshots of those headers.

Note - If you are using Listing and Real Estate header style then you need to enable page title for proper header rendering.
Text Transformation - Using this feature, you can select the mode in which you want to transform the text Capitalize, LowerCase, UpperCase.
Width - You can also change the width setting of the Main Menu. By selecting one option between narrow and wide.
Search Icon - This setting is used to enable the search icon in the main header. For this users have to turn“On” the button.
Search Type - Users can set the search type like gallery, media, posts, pages according to the need of the business.
Login Button - Using this setting users can enable a login button on the main header. For this users have to turn “On” the button.
Style - Users can set the style of the login button by selecting any one option between Basic and With Icon.
Action - Users can set the WP Default login or Custom Login in this setting.

Header Button

Using these settings, users can set the button label, button link, button icon, etc. But these settings will be applicable only for the header buttons.

Button - To use an additional button on the header user has to turn "On" button.
Button Label - Users can set the label of the button here.
Button Link - Users can set the link of the button, where they want to redirect it.
Button Icon - User can set the icon with button by turning “On” button.
Icon Type - Users can select the type of the icon by selecting any one option between default and svg
Icon Select - This setting is used when the user selects Icon Type as Default. Using this setting the user can select the required icon.
SVG Code - This setting is used when the user selects Icon Type as SVG. In this user has to add the code of the svg icon.
Icon Position - Using this setting, the user can set the position of the icon as Right or Left.
Button Color - In the button color setting, there is a color option in which you can choose any color for the background of the button and also you can choose a transparent option.

Button Text Color - In the button text color setting, there is a color option in which you can choose any color for the text of the button and also you can choose a transparent option.
Button Hover Color - Using this setting user can set the background of the and the changes can be seen on hover the button. In this setting, the user can choose any color and can also choose the transparent color.
Button Text Color On Hover - In this setting, the user can set any color for the text button on the hover and can also choose a transparent color.

Custom Header

Using this setting, users can create their own header by creating a page.

Select Page - For the custom header, users have to create a page with the items that they want to show in the header section. After publishing the page users will be able to see that page in the dropdown of custom header settings.

Header Color Settings

Using this feature user can customize the color settings of the header.

Background Color - In background color settings, the user can select the background color of the header and can also choose the transparent option.
Text Color - In-text color, there is a color option in which you can choose any color for the text of the header and also you can choose a transparent option.
Text Color On Hover In text color hover settings, you can choose any color for the text on hover, and can also choose the transparent color.

Sticky Header

Sticky Header is used to fix the header menu position when you scroll down. In other words, it is basically a website menu that is locked into place so that it does not disappear when the user scrolls down the page. It is accessible from anywhere on the website without having to scroll.

Sticky Header - To apply sticky header, users need to enable the “On “ Button.
Disable Responsive - If you want to disable the sticky header on responsive then turn “On “ the button.
Background Color - In this setting, the user can choose the background color of the sticky header and can also choose the transparent option.
Text Color - In this setting, the user can choose the text color of the sticky header and can also choose the transparent option.
Text Color On Hover - In text color on hover setting, there is a color option in which you can choose any color for the text color of the sticky bar on hover and also can choose a transparent option.

Toogle Icon

The toggle icon will appear only on the small size devices.

Icon Color - You can choose any color of the toggle icon and can also have a transparent option.

Mega Menu

Megamenu is a type of expandable menu in which many choices are displayed in a two-dimensional layout. It is an excellent design choice for accommodating a large number of options or for revealing lower-level site pages at a glance.

Background Type - Using this feature, user can choose the background type of mega menu as color or image.
Background Color - This setting is used when the user selects the background type as Color. In background color settings, there is a color option in which you can choose any color for the background and also you can choose a transparent option.
Background Image - This setting is used when the user selects the background type as Image. The user has to set the image for the background of the mega menu.
Heading Color - In heading color settings, there is a color option in which you can choose any color for the heading of the megamenu and also you can choose a transparent option.
Text Color - In text color, there is a color option in which you can choose any color for the text of the megamenu and also you can choose a transparent option.
Text Color On Hover - In this setting, there is a color option in which you can choose any color for the text of the mega menu on hover and also have a transparent option.
Icons Color - Using this setting, user can choose the color of the icon of the mega menu and can also choose the transparent option.
Divider Color - Divider Color setting is used to set the color of the divider in the mega menu and also have the transparent option.

3.4.3 Profile Menu

The User Profile Menu is a component that displays a user’s name and profile picture. It also displays a dropdown from which users can navigate to their profile and log out. Below mentioned are the settings for the profile menu.

Header Background Color - In the header background color, there is a color option in which you can choose any color for the header background color of the profile menu and also you can choose a transparent option.
Header Text Color - Using this feature user can select the text color of the header of the profile menu as required and can also choose a transparent option.
Body Background Color - In this setting, user can choose any color for the body background of the profile menu and also have a transparent option.
Body Text Color - This feature includes the setting of the text color of the body of the profile menu. User can choose any color for the text and can also choose a transparent option as required.

3.4.4 Title/BreadCrumb

Breadcrumbs are the navigational aid that allows visitors to understand their current location in the context of a website. The title describes the page which helps users to see their current location(page) in the website.

Title

In the title setting, the user can enable the title on the top of the page, set the color, background type, etc.

Page Title - To enable the page title option turn “On “ the button. But it works only for the pages.
Default title - To enable the default title option turn “On “ the button. But it works for the whole website not only for pages.
Alignment - Using this feature user can set the alignment of the title in the breadcrumb. We have provided three options Left, Right and Center.
Text Transformation - Using this feature you can select the mode in which you want to transform the text by selecting any one of the options between Capitalize, LowerCase, UpperCase.
Padding - With this option, the user can set the padding from the top, right, bottom, and left. You have to write numerical values here.
Background Type - With this option, the user can set the background type for the breadcrumbs. Here we have given the four options for this: Color, Image, Image with Parallax and Video and you will get the options for the background type accordingly.
Background Color - If the user has chosen the background type as color then the user can choose any color for the background of the breadcrumb and also you can choose the transparent color
Title Color - In title color, the user can choose any color for the title and can also choose the transparent color.

BreadCrumb Using these settings, the user can enable the breadcrumb and set color for that on the website.

Breadcrumb - To use breadcrumb on the website turn “ On “ the button.
BreadCrumb Color - In this, the user can choose any color for the breadcrumb and can also choose the transparent color.

3.5 Sidebar

A sidebar is basically a vertical column provided by the theme for displaying information other than the main content of the web page.

3.5.1 General Settings

Here you can set the default sidebar position, page sidebar position, sidebar style, as per your need.

Default Sidebar Position - With this, you can select the sidebar position for default pages like blog, archive, 404, etc. There are four options for the sidebar position(No Sidebar, Left Sidebar, Right Sidebar, and Left-Right Both Sidebars), you can select according to your needs.
Page Sidebar Position - With this, you can select the sidebar position for pages. There are four options for the sidebar position(No Sidebar, Left Sidebar, Right Sidebar, and Left-Right Both Sidebars), you can select according to your needs.
Sidebar Style - Using this you can select the style of the sidebar. There are three options (Default, News, and Boxed). You can choose according to your need and will get the options for style accordingly.
Widget’s Heading Alignment - With this, you can set the alignment of the heading. There are three options for this (Left, Right, Center).

3.5.2 Widgets Title Settings

Widgets can be added to any sidebar column. There are various fields and settings present to choose for each individual widget all are self-explanatory. You can put as many widgets as you want inside of the sidebar.

Text Color - In this, you can change or add the color of the text widget title and can also choose the transparent color.
Font Size - With this, you can set the widget’s heading size. The value of font size is displayed through the slider as a label
Line Height - From here you can set the widget’s heading line-height. The slider displays the value of line-height as a label.
Letter Spacing - Using this feature you can set the widget’s heading letter spacing. The slider displays the value of letter spacing as a label.

3.5.3 Additional Setting

Additional color - This color setting will be applicable only to sidebar heading dividers and links. You can choose any color and also choose the transparent color.
Padding - With this, you can adjust the padding of the page where you have added the sidebar from the top and bottom. An only numerical value will be accepted here, and the value will be calculated in pixel automatically.

3.6 Footer

MOTOCOM has a fully customizable footer so that users can design the footer as they need.

3.6.1 General Settings

To enable customization of the footer firstly you need to enable the " On " button then you can add or change the footer settings.

Footer - To add the footer in the website turn “ On ” the button.
Select Footer Page - In this setting, you have to select the page which you have created as a footer. When you select that page it will automatically be added at the bottom of all the pages of the website.
Background Type - Using this feature user can select the background type of the footer. There are two types of styles which you can select: color and image. And user will get the options for background type accordingly.
Background Color - In this settings, you can change the background color of the footer or you can select the transparent option.
Text Color - In this setting, you can change the text color on the footer or you can select the transparent option.
Link Color - Using this setting, the user can set or change the link color on the footer or can also select the transparent option.
Link Hover Color - Using this setting, the user can set or change the link color on hover on the footer or can also select the transparent option.
Background Image - User can upload the background image if user select background type as an image.

3.6.2 Copyright Settings

Copyright - To enable the copyright on the footer turn “ On ” the button.

Copyright Text - From here users can set the text of copyright. You can change the text as you need.
Copyright Background Color - In this setting, you can add or change the copyright background color, or you can select the transparent option.
Copyright Section Custom Links - Users can select the page from here which you want to set in the copyright section as a custom link.
Top Border - To use this feature turn “On” the button and you will get the options for top border accordingly.
Width - In this user can select the width of the top border. By selecting any one option (Narrow and Wide).
Top Border Color - Using this user gets an option to choose the color and can also get the transparent option.
Copyright Background Color - By this option, you can change the copyright background color or you can choose the transparent option.
Copyright Text Color - By this option, you can change the copyright text color, or you can choose the transparent option.
Copyright Link Color - Using this feature user can choose the copyright link color and can also select the transparent option.
Copyright Link Hover Color - With this setting, the user can set the copyright link color on hover and can also select the transparent option.

3.6.3 Scroll To Top Button

Scroll to top button enables the users to directly navigate to the top of the page with just one click without scrolling the mouse.

Button - To enable the scroll to top button in the website turn “On” the button.
Background Color - With this user can select the background color of the scroll to top button as they need and can choose the transparent option also.
Icon Color - With this user can select the icon color of the scroll to top button and can also choose the transparent option also.

3.7 Appearance

In appearance, the user can set the theme style, theme button style, and theme typography.

3.7.1 Theme Style

Using this feature user can change the design of the theme like body background, theme default color, links color. These settings will be applicable to the whole theme.

Body Background - With this user can choose the body background color for the theme and can also choose the transparent color. You can also set the background image for the background. We are also provided some additional settings to set the background color and image.
Width - Using this setting, user can select the width of the whole theme. We have given two options for this Narrow and Wide.
List Style - Using this user can set the style for the list item on a website.
Arrow - Using this arrow will appear before the list items.
Dot - Using this dot will appear before the list of items.
Dash - Using this dash will appear before the list of items.
Square - Using this square will appear before the list of items.
List Style Color - This setting will change the color of the list style which you have selected in the previous option and can also choose the transparent option.

Link Hover Color - By this option, the user can select the hover color of the link and can also have a transparent option. This setting will be reflected for the links of the whole website.
Theme Default Color - By this option, you can add or change the color of the theme or you can select the transparent option.
Theme Default Background Color - By this option, you can add or change the box background color of the theme or you can select the transparent option.

3.7.2 Theme Button Styles

Theme Button Settings will be applicable for all theme buttons. Using these settings user can change the background color, text color, set border etc.

Theme Button Styles

Default button Override - To enable button style in the theme turn " On " the button.
Background Color - Using this setting user can choose the background color of all theme buttons and can also have a transparent option.
Text Color - With this setting, the user can set the color of the text of theme buttons and also have a transparent option.
Font Size - Users can set the font size of the text of the button from here. It will accept an only numeric value.
Font Weight - User can set the font-weight of the text of the button by selecting any value from the dropdown.
Letter Spacing - With this setting, the user can add spaces between the character and the value will appear as a label in front of the slider.
Text Transformation - Users can transform the text by selecting any one option between Lowercase, Uppercase, and Capitalize.
Box Shadow Color - With this setting, user can choose any color for Box Shadow.

Border Setting

In the border settings, the user can set the border for all theme buttons and can design according to the need.

Border - To enable the border settings in the theme button turn "On" the button.
Border Style - With this setting, the user can set the border style for the theme button. User can select any style from the given seven options(Solid, Dashed, Dotted, Double, Groove, Inset, Outset).
Thickness - From here user can set the thickness of the border and the numerical value can be seen as a label in front of the slider.
Border Color - With this feature, the user can set the border color for the button and can also select the transparent option.
Border Radius - Using this setting you can adjust the radius of the border of the theme button. You have write the numeric values in the format like( 10px 10px 10px 10px), and do not add comma (,) between the values and you can change the values as needed.

Hover Settings

These settings include hover settings of the button and will be applicable on all the theme buttons.

Background Color - Using this setting, the user can add or change the background color of a button on the hover and can also have the transparent option.
Text Color - Using this setting, the user can add or change the text color of a button on the hover and can also have the transparent option.
Border Color - Using this setting, the user can add or change the border color of a button on hover and can also have the transparent option.
Box Shadow Color - Using this setting, the user can select the box-shadow color on hover and can also have the transparent option.

3.7.3 Theme Typography

In this setting, the user can add the set body font and also font for the text under H1 to H6 heading. This setting will be applicable to the whole website.

Typography Settings

In the typography, you can change the body font of your site with the help of the following settings. But, if your text under the H1 to H6 heading it will not change the font. Then you have to change the font setting in H1 or it depends on you which heading you selected.

Font Family - By this option you can select the text font from the Standard Fonts and Google WebFonts. You can select one at a time.
Font Weight & style - With this option, the user can adjust the font-weight or style of the text. It depends on that which font family you have selected either Standard Fonts or Google WebFonts and will get options accordingly.

If you have selected Standard Fonts then you will get four options as (Normal 400, Bold 700, Normal 400 Italic and Bold 700 Itallic ).
If you have selcted Google Webfonts then you will get either (Regular 400 or Regular 400 Itallic).

Font Subsets - With this setting user can select font subsets as Latin.
Text Align - By this option the user can adjust the alignment of the text by selecting the given option ( Inherit, Left, Right, Center, Justify, Intial).
Font Size - Using this option user can set the font size for the text and enter only numerical values here and it will automatically be converted into pixels .
Line Height - Using this setting user can set the line height for the text and you must enter numerical values here and it will automatically be converted into the pixels.
Font Color - By this option, you can change the font color or you can choose a transparent option.

H1 ..... H6

If you select these heading tags for your sites then, you can only add or change the above-mentioned settings in the particular heading tags.

3.8 Social

3.8.1 Social Share

Enable - If the user wants to enable the Social Share buttons to the posts single page then select the checkbox.
Enable Sharing - With this setting user can select the social icons checkbox which you want to share. There are five options available(Twitter, Facebook , LinkedIn , WhatsApp , Pinterest).

3.8.2 Add Social Page URL

By this setting, You can set social page URL link of many social media sites like (Facebook, Twitter, Dribble, Instagram, LinkedIn, Flickr, Youtube, Tumblr, Pinterest, Vimeo, Vine ).

3.8.3 Social Icons Border Setting

In these settings, you can change or add the social icon border settings.

Border Style - Using this option user can select the border style of social icons by selecting any one option from the given options ( Solid, Dashed, Double, Dotted, Groove, Inset, Outset ).
Color - In this setting, the user can select the color for the border of the social icons and also have a transparent option.
Hover Color - With this setting, the user can select the color for the border of the social icons on hover and also have a transparent option.
Border Radius -You can adjust the border radius of the social icon. Enter the values in the format (10px 10px 10px 10px) you can change the numeric values as required and also do not add comma(,) between the values.

3.9 Custom Code

In this setting, you can also design your site by adding your own CSS and js code.

CSS Code - You can add your CSS code in the black screen box as required.
JS Code - You can add your js code in the white screen box as required.

3.10 Header / Footer Scripts

These settings can be used to add third-party scripts on the header and footer of the website as needed.

Header Scripts - In this user can add any third-party scripts like Google Analytics, Google Adsense, etc.
Footer Scripts - With this setting, user can add any third-party scripts on the footer of the website.

3.11 Import & Export

In this setting, the user can import or export the File and URL Link of the different Demo Theme.

Import Options - In this option, you can import the backup of any theme, File, and also a URL Link. This will overwrite all existing option values, please proceed with caution! .
Export Options - Here you can copy/download your current option settings. Keep this safe as you can use it as a backup should anything go wrong, or you can use it to restore your settings on this site (or any other site).

4. WPBakery & Shortcodes

In these section you will learn and get information about the WP Bakery Page builder and Shortcodes.

4.1 WPBakery Page Builder

WPBakery Page Builder is easy to use drag and drop page builder that will help you to create any layout you can imagine fast and easy. No coding skills required!

Access Frontend editor (Inline editor) or Backend editor at any time. Yes, WPBakery Page Builder comes bundled with 2 types of editors allowing you to choose your preferred view. Create your WordPress website with a backend schematic editor or move your page building process to the frontend and see your results live. If you want to know more about WP Bakery Page Builder then Click Here

Expand the selected Item to 1/6, 1/5, 1/4, 1/3, 1/2, 2/3, 3/4, 1/1 by using the "+" button in the Item. Or, you can shorten the Item using the "-" button. Note: Every Item can be sized in the same way.
Delete an Item/Section/Row by ˟ in the right corner.
Edit each Item/Section/Row by clicking on "Pencil" in the right corner.
Clone an Item/Section/Row by clicking on "Clone" in the right corner.
You can also move any Item/Section/Row by drag & drop in the left corner.

4.2 MOTOCOM Shortcodes

A specific code that lets you do difficult things with very little effort. Shortcodes can embed files or create objects that would normally require lots of complicated, ugly code in just one line.

4.2.1 Features

Users can add qualities to the websites using features shortcode. Our feature shortcode has a variety of styles so that user can display the attributes of the websites according to the need.

General settings

Style - In these settings, you can select the styles of the feature box between the given options.
Columns - By this option, you can set the number of columns according to your need from the given options.
Icon Size - Enter a numeric value for the icon size.

Feature Setting - These settings come in the parent's settings of the feature shortcode when you click on the box.

Title - Add the title of the feature box here.
Description - You can add a description of the feature you added.
Icon Type - You can select icon type from the given option ( FontAwesome Icon, Image ) and will get options accordingly.
Fontawesome Icon - Using this option you can select the icon as required. (This option appears when you choose font awesome icon as icon type).

Icon Background Color - Using this option you can select the color of the background of the icon.
Icon Color - Using this option you can select the color of the icon and chosen color will be reflected in both the icon and its border.
Upload Image - Using this option user can upload image for the feature code.
Background Color - You can change the background color of the feature section from this option.
Heading Color - You can change the heading color of the feature using this option.
Font Color - You can change the font color of the feature from this option.
Button Text Color - Using this option you can change the color of the button text.
Custom Link - By this setting, you can add a custom link for the button where you want to redirect it.
Link Label - This setting will label to the link. ( It will work only with the feature Style 2 ).

4.2.2 Testimonial Slider

With this shortcode, you can display your client's advice in a slider form in any style as needed.

This shortcode helps you to display testimonials from your clients in a slider form. You can display it on the page.

General Setting

Number of Testimonials - The user has to enter the number for testimonials to display on the website. Enter a numeric value here.
Orderby - Select the orderby to arrange the display order of testimonials. We have provided four option for this: ID, Title, Date and Random.
Sort Order - User can sort the testimonial either in Ascending or Descending order.
Style - User can choose the testimonial style by this option from the given styles.
Navigation - Using this option user can select the navigation type from the given five options (None, Arrows, Bullets, Fraction and Progress Bar) and the user will get the options accordingly in the color settings.
Autoplay - To enable the Autoplay option, select the checkbox.
Autoplay Speed - Users can adjust the speed of the autoplay. Speed will be in milliseconds like 1000 = 1s. You will get this option when you enable the Autoplay.
Loop - To enable the loop in the slider select the checkbox.

Color Options

Background Color - Select the background color for the slider.
Heading Color - User can set the heading color of the testimonial from this option.
Simple Text Color - User can choose the color for the text appears in the testimonial from this setting.
Additional Color - Users can choose any color as an additional. This color will be applied to the additional things.
Active Bullet Color - This setting appears when you select bullet type in the navigation and you can change the active bullet color.
Inactive Bullet Color - This setting appears when you select bullet type in the navigation and you can change the inactive bullet color from this option.

4.2.3 Button

As the name suggests, with this shortcode you can create a button in any section of your website.

General Setting

Button Label - You can change the label of the button.
Button Link - In this, you can enter the link URL where you want to redirect it.
New Tab - If you want to open a link in a new tab then, select the "On" option.

Design Option

Font Size - You can change the font size of the button text. Enter the numeric value. Don't add a suffix like px.
Font Weight - You can change the font-weight of the button text by selecting any one option.
Letter Spacing - Using this setting, you can add space between the characters of the button text. Please enter the numeric value and do not add any suffix like px.
Font Style - You can change the font style of the button text from the four options (None, Uppercase, Lowercase, Capitalize).
Font Color - You can change the font color of the button text.
Padding - Using this you can manage your button size.You can change each of the number individually like 5px 10px 5px 10px. Please don't add a comma(,) between the values, always keep empty space in between them. Using this you can manage your button size.
Background Color - You can change the background color of the button using this setting.
Border - Select the on/off option to get the border settings on the button.
Border Style - You can change the border style of the button by selecting an option between Solid, Dashed, Dotted, Double, Groove, Inset, Outset.
Border Width - You can change the border width of the button. Enter only a numeric value here.
Border Color - You can change the border color of the button using this setting.
Border Radius - You can adjust the border radius of the button. Enter the values in the format 10px 10px 10px 10px or simply 10px with this all corners of the button become same. If you want to change the individual color you can enter the values in the format 5px 10px 5px 10px
Hover - Enable the on/off option to get the hover settings.

Hover Background - You can change the background color of the button on the hover.
Hover Text Color - You can change the text color of the button on the hover.
Hover Border Color - You can change the hover border color of the button.
Shadow - Enable the on/off option to get the settings.
Shadow Options - You can change default values according to your need.
Button Inline - This setting will align all buttons in a line. To get this setting, enable the checkbox.
Button Alignment - You can align the button as required by using any option one option from the Left, Right, and Center.

Icon

Select Icon - You can choose the icon for the button.
Icon Alignment - You can adjust the alignment of the icon.
Icon Color - You can choose any color for the icon.
Icon Hover Color - You can choose the icon hover color.

Attributes

Class - You can add any custom CSS class attribute to enable extra functionality.
ID - You can add CSS class ID here.

4.2.4 Services

With this shortcode, you can add services or resources offered to the customers at any section of your website.

General Setting

View - With this setting user can set the mode in which you want to display the feature either as Grid or Slider .
Columns - By this option, you can set a number of columns according to your need from the given options.
Icon Size - You can enter a numeric value for the icon size.

Slider Setting

You will get these settings when you selected the Slider option in the View setting.

Navigation - Using this option user can select the navigation type from the given five options (None, Arrows, Bullets, Fraction and Progress Bar) and the user will get the options accordingly.
Autoplay - To enable the Autoplay option, select the checkbox.
Autoplay Speed - Users can adjust the speed of the autoplay. Speed will be in milliseconds like 1000 = 1s.
Loop - To enable the loop in the slider, select the checkbox.

General Setting

These settings come in the parent's settings of the service shortcode when you click on the box.

Icon Type - You can select icon type from the given option ( FontAwesome Icon, Image) and will get options accordingly.
Fontawesome Icon - Using this option you can select the icon as required. (This option appears when you choose font awesome icon as icon type).
Icon Color - Users can choose any color for the icon.
Upload Image - Users can upload image with this setting.
Title - Enter the title of the services here.
Description - Enter the description of the services as required.
Alignment - You can adjust the alignment of the services with this setting.

Custom Link Settings

Custom Link - You can add a link here where you want to redirect it.
Enable Button - With this setting, the user can enable an additional button. For this user has to select the checkbox.
Button Label - You can add the button label here.
Button Background Color - You can add or change the background color of the button.
Button Text Color - You can add or change the text color of the button.
Button Background Color On Hover - You can add or change the button background color on hover.
Button Text Color On Hover - You can choose any color for the button text on hover.

Box Background Settings

These settings are used to design the Service box.

Background Type - You can select the background type for the service box. Two options are provided ( Color, Image) and you will get options accordingly.
Background Color - This setting will appear when you select background type as color. You can add any color for the background of the service box using this option.
Upload Image - This option will appear when you select background type as Image. You can upload a background image for the service box.
Image Overlay - With this setting, the user can add color to overlay the image.
Heading Color - You can add or change the heading color of the services.
Text Color - You can add or change the text color of the services with this option.
Disable Box Shodow - You can disable the box shadow for the service box by turning "On" the checkbox.

Box Border

Box Border - User can enable it by selecting the box border option.
Border Style - Users can select any border style for the service box.
Border Width - Users can add the width of the border. Only numerical values will be accepted here.
Border Color - Users can add or change the border color of the box.
Border Color On Hover - Users can add or change the border color of the box on hover.
Border Radius - You can adjust the border radius of the box. Enter the values in the format (10px 10px 10px 10px) you can change the numeric values as required and also do not add a comma(,) between the values and always keep space between the values.

4.2.5 Boxed Image

With the help of this shortcode, you can add a boxed-type image to your website.

General Setting

Upload Image - You can upload an image here.
Custom Link - You can set the custom link where you want to redirect it.
Custom Link Label - Enter the custom link label.
Box Background Color - You can select the color of the box background.

Box Border

Box Border - If you want to enable the border for the box select the checkbox.
Border Style - You can select the border style as needed.
Border Color - You can add or change the color of the border.

4.2.6 Team

You can show your team members with the help of this shortcode. You have to write their name, designation, a short description and you can set social links also and an image also.

General Setting

Style - You can select or change the style for the team.
View - You can select the mode to display the team as Grid or Slider and will get the options acccordingly.
Columns - You can select the number of columns as required.

Design Options

Box Color - You can select the box color in the team section.
Social Icon Color - You can select any color for the social icon.
Social Icon Color On Hover - You can choose any color of the social icon on hover.
Additional Color - You can choose any color as additional colors.

Slider Setting

Navigation - Using this option user can select the navigation type from the given five options (None, Arrows, Bullets, Fraction and Progress Bar) and the user will get the options accordingly.
Autoplay - To enable the Autoplay option, select the checkbox.
Autoplay Speed - Users can adjust the speed of the autoplay. Speed will be in milliseconds like 1000 = 1s.
Loop - To enable the loop in the slider, select the checkbox.

Team Member Setting

You can add a team member element by clicking inside the team shortcode setting.

Image - Please upload an image for a team member.
Name - You can add the team member's name using this setting.
Designation - You can add the Designation of the team member.
Phone - You can add the Contact Number of the team member.
Email - With this, you can add the Email ID of the team member.
Facebook - Using this, you can enter the Facebook account URL of the team member.
Twitter - Using this, you can enter the Twitter account URL of the team member.
Youtube - With this setting, the user can add the Youtube Channel URL of the team member.
LinkedIn - Using this, the user can enter the LinkedIn account URL of the team member.
Pinterest - Using this, you can enter the Pinterest account URL of the team member.
Vine - Using this setting user can add the Vine account of the team member.
Instagram - Using this setting, the user can enter the Instagram account URL of the team member.
Tumblr - Using this, the user can add the Tumblr account URL of the team member.
Flickr - With this, the user can add the Flickr URL of the team member.
Vimeo - Using this feature, you can enter the Vimeo account URL of the team member.
Dribble - Using this, you can enter the Dribble account URL of the team member.

4.2.7 Countdown Timer

You can use this shortcode to generate curosity and keep people interested when a special deal is available.

General Setting

Select Date - Please enter the targeted date here. The format of the date will be dd / mm / yyyy.
Style - You can select the style of the countdown according to your need.

Design Options

Box Color - Users can add or change the box color of the countdown timer.
Digits Color - Users can add or change the color of the digits of the timer with this setting.
Labels Color - With this user can add or change the label's color.
Font Size - User can add custom size. Please enter a numeric value like 10px, 20px as needed. The size will be automatically converted into Pixels.
Font Weight - You can select the font weight as required.

4.2.8 Portfolio Gallery

With this shortcode, you can add or change the settings of the portfolio section. This shortcode can work only if you added a portfolio in the gallery settings.

General Setting

Style - Users can select the style of the Portfolio Gallery as required.
Columns - Users can select the number of columns according to the need.
Number Of Gallery - Enter the number of the gallery. Enter only a numeric value here.
Gap Between Images - If you want to include the gap between the images enable the setting.
Enable Magnifier - It will enable a magnifier.
Enable Link - It will enable a link if needed by you.
Enable Filter - You can enable filter in the portfolio gallery according to your need.

4.2.9 Event Notice

With this shortcode, you can add the notice regarding the events on your website.

General Setting

Date - Please enter the targeted date here. The format of the date will be dd/mm/yyyy.
Date Position - You can select the position of the date according to your need.
Background Color - You can add or change the background color of the notice.
Text Color - You can add or change the text color of the event notice.
Icon Color - Users can choose any color of the icon.

Add Notice Settings

You can add notice by click on the Events Notice Shortcode Box

Notice - With this setting, you can enter notice for the events.
Notice Icon - User can select the notice icon according to the need.

4.2.10 Image

With this shortcode, you can add an image in various sections of your sites.

General Setting

Choose Image - User can upload either a new image or an existing from their media library.
Image Size - Users can select the image size as required.
Image Link - Users can enter the link to the image where they want to redirect it.
Open Link in New Window - If the user wants to open the Image in a new window then select the checkbox.

Design Options

Style - You can select the style of the image as needed.

4.2.11 Video

With this shortcode, you can add a video with a preview image on your website.

General Setting

Style - With this setting user can select the style by selecting any one option between Style 1 and Style 2.
Preview Image - You can upload a preview image for the video, by this option.
Image Radius - You can adjust the image radius, by this option.
Video URL - You can add a video URL here where you want to redirect it.

Design Options

Icon Background Color - Users can add or change the icon background color using this setting.
Icon Color - Users can add or change the video play icon color with this setting.

4.2.12 Icon

By this shortcode, user can set the icon and also design it on their website.

General Settings

Icon - Using this setting user can select the icon as required.
Icon Size - By this option, user can select the size of the icon, as their need( Small, Medium, Large).

Icon Color Settings

Using this setting you can set the color for the icon.

Background Color - You can select the background color of the icon as needed.
Icon Color - With this setting, the user can select the icon color.
Hover - To enable the hover effect, select the checkbox.
Background On Hover - You can select the background color of the icon on hover.
Icon On Hover - You can select the icon color on hover.

Border Settings With this setting, you can change the border of the icon.

Border - If you want to set a border around the icon then please select the "On" option.
Border Style - Users can select the style of the border from the given option as needed.
Border Width - Users can adjust the width of the border. Please enter the numeric value and also add a suffix like 'px'.
Border Color - With this option, the user can select the border color.
Border Color On Hover - With this option, the user can select the border color on the hover.
Border Radius - Users can adjust the border radius with this setting. You can change each of the number individually like 5px 10px 5px 10px. Please don't add a comma(,) between the values, and always keep empty space in between the values.

4.2.13 Lists

By this shortcode, you can add, remove, or edit your list section on the website.

Design Options

Background Color - You can add or change the background color of the list.
Background Color Fit To Content - If you want that background color that fits content then select the checkbox.
Text Color - You can set the color of the text of the list item.
Space Between The List Items - You can adjust the space between the list items. Enter only numeric values and also add a suffix like px.
List Style - You can select the style of list by selecting any one option from Simple and Larger.
Inline List - With this setting, you can set all list items in line. For that please select the checkbox.
Border - Users can add a border around the list item by selecting the "On" option.
Border Style - Users can select the style of the border from the given option as needed.
Border Width - Users can adjust the width of the border. Only a numeric value will be accepted.
Border Radius - Users can adjust the border radius with this setting. You can change each of the number individually like 5px 10px 5px 10px. Please don't add a comma(,) between the values, and always keep empty space in between the values.
List Border Color - With this setting, you can set the color of the border of list items.

Icon Settings

Icon Color - You can add or change the color of the icon with this setting.
Icon Background Color - You can add or change the color of the icon background.
Hover - With this setting, the user can enable the hover option by selecting the On Option.
Hover Background Color - You can add or change the hover background color of the icon.
Hover Icon Color - You can add or change the hover icon color.
Icon Alignment - You can adjust the alignment of the icon either as left or right.
Icon Border - To enable the Icon Border, select the "on" option.
Border Style - You can select the border style of the list icon from the given option.
Border Width - You can adjust the width of the border. Please enter only a numeric value.
Icon Border Radius - You can adjust the radius of the border. You can change each of the number individually like 5px 10px 5px 10px. Please don't add a comma(,) between the values, and always keep empty space in between the values.
Icon Border Color - You can add or change the color of the icon border.

Add List Setting

These settings appears in the parent's settings of the list shortcode when you click on the box.

General Settings

List Title - You can add the title of the list with this setting.
Link - Add a link if you want to redirect the list item to a particular page. It is optional.

Icon Settings

Enable Icon - User can enable the icon according to the need.
Icon Type - You can select the type of icon as an integrated icon or image by this option.
Icon - You can add an icon according to your need. This setting will appear when you select Integrated Icon as Icon Type.
Upload Image - You can upload the image here. This setting will appear when you select Image as Icon Type.

4.2.14 Thumbnail Banner

With this shortcode, you can add banners to your website.

Design Option

Columns - You can select the number of columns for the banner as required.
Style - You can select the style for the banner. We have given the two options With Background Image, With Right Aligned Image .
Banner Overlay Color - You can add overlay color to the banner. But, this setting will work only for those devices having a width greater than 1399.

Add Banner Settings

This setting will appear in the parent's settings of Thumbnail Banner Shortcode when you click on the Box

Background Image - With this setting, you can upload the background image for the banner.
Heading - You can add a heading for your banner.
Subheading - You can set a subheading for your banner.
Price - You can set the price of the product which displays on the banner.
Text Before Price - You can set the text before the price like Starts From according to your need.
Button Label - Using this, you can set a label for a button like Buy Now as needed.
Button Link - You can set the link of the button where you want to redirect the page.
Content Alignment - You can adjust the alignment of the content of the banner.
Heading Color - Users can add or change the color of the heading of the banner.
Subheading Color - You can choose any color for the subheading of the banner.
Price Color - You can select the price color of the banner.
Background Color - You can select the background color of the banner. This setting will work only for style 2.
Additional Color - You can select the additional color of the banner. This setting will work only for style 2.

4.2.15 Counters

This shortcode is used to enable counters on your website.

General Settings

Counter Style - You can select the style for the counter.
Columns - You can select the column number for the counter.
Speed - You can adjust the speed of the counter. Enter numeric value only like 1000, 2000 according to your need.
Title Color - You can set the color of the title of the counter.
Counter Number Color - You can add or change the color of the counter number.
Divider Color - You can add or change the color of the divider.
Extra Symbol Color - You can add or change the color of the extra symbol present on the counter.

Counter Child Settings - These settings come in the parent's settings of the counter shortcode when you click on the box.

Title - Add the Title of the counter.
Counter Number - You can enter a counter number.
Extra Symbol - You can add some extra signs like +,%, etc.
Icon - You can set the type of Icon as Integrated Icon and Custom icon. Both icon styles will not work for counter Number In Circle style.
Icon - You can select the icon according to your need. This setting will appear when you select the Integrated Icon.
Custom Icon - You can upload an image for the custom Icon. This will work when you select the Custom Icon.
Icon Color - You can add or change the icon color.
Additional Color - You can add or change the additional color for the counter.

4.2.16 Image With Background Animation

With this shortcode, you can add the image to the website with animation effects in the background.

General Setting

Upload Image - You can upload an image according to your choice.
Background Image - You can upload a background image that displays the animation effect.

4.2.17 Vertical Banner

Using this shortcode you can add a banner on your website which contains basic information about the product like product image, coupon code, etc.

General Settings

Heading - You can add the heading of the banner here.
Subheading - You can add the subheading of the banner here.
Coupon Code - You can add the coupon code.
Coupon Code Text - You can add the coupon code text.
Product Image - You can upload the product image.
Button Label - Enter the button label like Buy Now according to your need.
Button Link - Enter a link for the button where you want to redirect the page.

Design Options

Background Color - You can add or change the background color of the banner.
Text Color - You can add or change the text color of the banner.
Coupon Background Color - You can add or change the coupon background color of the banner.
Coupon Text Color - Here you can add or change the coupon text color of the banner.
Button Background Color - You can add or change the button background color of the banner.
Button Text Color - You can add or change the button text color of the banner.

4.2.18 Categories

By using this shortcode users can add the categories of the products on the website.

General Settings

Style - You can select any style for the categories.
View - You can select the view mode as grid or slider.
Columns - You can select a number of columns to display categories.
Category - Enter the category ID here. You can add multiple IDs by separating them with commas (,). To find the category ID, click on any of the categories and find the tag_id in the URL.
Font Size - Enter a numerical value if you need custom size (Ex: 20,30). This size will be in Pixel automatically.
Font Weight - You can select the font weight from here.
Box Color - Here you can add or change the box color of the category.
Additional Color - You can add or change the additional color.

Box Border

Box Border - Select the checkbox if you want to enable the box border.
Border Style - You can select the border style from here.
Border Width - You can set the border width here. Enter numerical value only.
Border Color - You can add or change the border color of the category box.
BorderColor On Hover - You can add or change the box border color on hover.

Slider Settings

These settings will appear when you select the slider type in View options.

Navigation - Using this option user can select the navigation type from the given five options (None, Arrows, Bullets, Fraction and Progress Bar) and the user will get the options accordingly.
Autoplay - Users can enable the autoplay option by selecting the checkbox.
Autoplay Speed - You can set the autoplay speed according to your need. Speed will be in milliseconds like 1000 = 1s.
Loop - Users can enable the loop option in the slider by selecting the checkbox.

4.2.19 Social Icons

Using this shortcode users can add social icons in any section of the website and also change the design according to the requirement.

Style Settings

Style - You can select the style of the social icons. We have provided two options for this Default and With Icon.

Icon Color Settings

Background Color - You can add or change the color of the background of the social icon. You can set social icons by navigating Theme Options >> Social.
Icon Color - You can add or change the color of the social icons.
Hover - You can set the hover option by selecting the checkbox.
Background Color On Hover - You can add or change the color of the background of the social icon on hover.
Icon Color On Hover - You can add or change the color of the social icons on hover.

Border Settings

Icon Border - You can set the border for the social icon from here.
Border Style - You can select the style of the border of the social icon.
Border Width - You can adjust the width of the border. Enter a numerical value.
Border Color - You can add or change the color of the border.
Border Color On Hover - You can add or change the color of the border of the social icon on hover.
Border Radius - You can adjust the radius of the border. You can change each of the number individually like 5px 10px 5px 10px. Please don't add a comma(,) between the values, always keep empty space in between them.

4.2.20 Blog Posts

With this shortcode, you can add blog posts to your website.

General Settings

View - You can select the view mode (Grid or Slider) of the blog post.
Style - You can select the style of the blog post.
Number Of Posts - Enter the number of posts you want to display.
Columns - You can select the columns according to your need.
Categories - Select the category which you made in the post section.
Order by - You can set the order (ID, Date, Title, Random) of the posts.
Sort order - You can sort the posts either in Ascending or Descending order.
Color - You can set the color which will be applicable to some of the elements of the blog. To set hover color please navigate Appearance >> Theme Style >> Links Hover Color.
Icon Color - You can add or change the color of the icon of the post.
Additonal Color - You can add or change the additional color in the blog posts.

Slider Settings

Slider - To enable the slider, select the checkbox.
Navigation - Using this option user can select the navigation type from the given five options (None, Arrows, Bullets, Fraction, and Progress Bar) and the user will get the options accordingly.
AutoPlay - Users can enable the autoplay option by selecting the checkbox.
AutoPlay Speed - You can set the autoplay speed according to your need. Speed will be in milliseconds like 1000 = 1s.
Loop - Users can enable the loop option in the slider by selecting the checkbox.

Meta Data

Thumbnail Image - To enable the image, select the checkbox.
Author - To enable the author name, select the checkbox.
Comments - Enable the number of the comment of the post with this setting.
Views - Enable a number of views of the post using this setting.
Short Description - It will enable the short description of the post.
Read More Button - To enable the read more button, select the checkbox. It will redirect users to a single page.

4.2.21 About Author

With this shortcode, the user can show the description of the author in a variety of styles.

General Settings

Style - You can select the style for the about author section.
Upload Image - You can upload an author image.
Name - You can enter the author's name.
Designation - You can enter the designation of the author.
Facebook Link - You can add a Facebook link here.
Facebook Link Label - You can add a label for the Facebook link here.
Twitter Link - You can add a Twitter link here.
Twitter Link Label - You can add a label for the Twitter link here.
Linkedin Link - You can add a Linkedin link here.
Linkedin Link Label - You can add a label for the Linkedin link here.
Youtube Link - You can add a Youtube link here.
Youtube Link Label - You can add a label for the Youtube link here.
Instagram Link - You can add an Instagram link here.
Instagram Link Label - You can add a label for the Instagram link here.

Design Options

Box Color - You can add or change the color of the box
Text Color - You can add or change the text color.
Icons Color - You can add or change the color of the social icons.
Hover Color - You can add or change the hover color.
Additional Color - You can add or change the additional color.

4.2.22 Alert Message

This shortcode will highlight a particular section of a website.

General Setting

Heading - You can enter the heading of the Alert Message here.
Description - You can write the description of the Alert Message.
Border - You can set the border by selecting any one option between (None, left, Right, Top, Bottom) and you will get options accordingly.
Content Alignment - You can align the content according to your need.
Heading Color - You can add or change the heading color as required.
Text Color - You can add or change the text color as required.
Background Color - You can add or change the background color as required.
Heading Color On Hover - You can add or change the heading color on hover as needed.
Text Color On Hover - You can add or change the text color on hover as needed.
Background Color On Hover - You can add or change the background color on hover as needed.

4.2.23 Testimonial Box

With this shortcode, you can show the testimonial in the box layout.

General Settings

Style - You can select the style of the testimonial box.
Number Of Testimonials - You can enter the number of testimonials that you want to display.
Order By - You can set the order by (ID, Date, Title, Random) of the testimonials.
Sort - You can sort the testimonials either in Ascending or Descending order.
Column - You can select the number of columns. You are needed to stretch row if you want to use 3 columns with style1,2 and 3.

Color Options

Box Color - You can add or change the Testimonial Box Color.
Text Color - You can add or change the text color of the Testimonial Box.
Additional Color - You can add or change the additional color.

4.2.24 Contact Info

User can add contact information on a section of the website with this shortcode.

General Settings

Icon Color - You can add or change the color of the icon.

Add Info Settings

This setting will appear in the parent's setting of the Contact Info shortcode after clicking on the box.

Icon - You can select the icon for the contact information.
Description - You can add a description here.

4.2.25 Video Play Icon

Using this shortcode user can design the video play icon according to the need.

General Settings

Video URL - You can add the video URL.
Style - You can select the style of play icon as required.
Size - You can select the size of the play icon according to the requirement.

Design Options

Background Color - You can add or change the background color of the video play icon.
Background Color On Hover - You can add or change the background color of the video play icon on hover.
Icon Color - You can add or change the color of the video play icon.
Icon Color On Hover - You can add or change the color of the video play icon on hover.

4.2.26 Search Box

With this shortcode, users can create the search box in the website according to the need.

General Settings

Heading - Users can enter the heading of the search box here.
Sub Heading - Users can enter the sub heading of the search box here.
Search Input Placeholder - You can write search Input Placeholder here.
Search Type - Users can select the search type from here.
Searched Keywords - This option display top searching keywords when you select the checkbox.

Design Options

Background Type - You can select the background type ( Color, Image ) of the search box.
Background Color - You can add or change the background color of the search box. This option will work when you select color as background type.
Background Image - You can upload the background image for the search box. This option will work when you select an image as a background type.
Image Overlay Color - You can add or change the overlay color on the image. This option will work when you select an image as a background type.
Text Color - You can add or change the text color of the search box.

4.2.27 Accordion

With this shortcode, you can add a series of contents to sections with headers.

General Settings

Active Tab Color -You can add or change the active tab color.
Active Tab Text Color - You can add or change the active tab text color.
Border Style - You can select the border style from here.
Border Width - You can set the border width here. Enter numerical value only.
Border Radius - You can adjust the border radius from here. To make all the corners of button same enter the values in this format(10px 10px 10px 10px or 10px both are same) and you can also change the individual corner like this 10px 5px 10px 5px .
Border Color - You can add or change the border color of the box.
Space Between The Items - You can add the space between the items. Enter only numerical values.

Add Element Settings

These settings come in the parent's settings of the Accordion shortcode when you click on the box.

Title - You can add a title here.
Content - You can enter the content here.
Heading Label - Enter the heading label here according to the requirement.
Default Active - You can make the accordion default active by selecting the checkbox.

4.2.28 Search With Inside Button

Using this shortcode you can add a search bar that has a button within it.

General Settings

Search Input Placeholder - You can write search Input Placeholder here.
Search Type - Users can select the search type from here
Searched Keywords - This option display top searching keywords when you select the checkbox.

Design Options

Text Color - You can add or change the color of the text.

4.2.29 Posts Slider

If you want to show your blog post in a slider then our Posts Slider shortcode will serve the same.

General Settings

Post Type - With this option, the user can select the post type.
Category - Enter category slug here. You can add multiple categories slugs separating by comma(,).
Number Of Posts - Enter the number of posts you want to display and enter numeric values.
Order By - You can set the order by (ID, Date, Title, Random) of the posts.
Sort Order - You can sort the posts either in Ascending or Descending order.

Design Options

Navigation - Using this option user can select the navigation type from the given five options (None, Arrows, Bullets, Fraction, and Progress Bar) and the user will get the options accordingly.
AutoPlay - Users can enable the autoplay option by selecting the checkbox.
AutoPlay Speed - You can set the autoplay speed according to your need. Speed will be in milliseconds like 1000 = 1s.
Loop - Users can enable the loop option in the slider by selecting the checkbox.

4.2.30 Rating Box

With this shortcode, the user can add the rating box to the website. Generally, it is used in Ordering Websites.

General Settings

Heading - You can enter the heading of the box here.
Title Color - You can add or change the title color of the rating box from here.
Icon Color - You can add or change the icon color of the rating box.

Add Box Settings

The user will get this in the parent's settings of the Rating Box shortcode when the user clicks on the box.

Image - You can upload the image of the product.
Box Heading - Enter the heading of the rating box.
Subheading - Enter the subheading here.
Rating - Give rating to the product like (3.0, 4.0).
Rating Color - You can select the rating color.
Address - Enter your official address here.
Delivery Time - Enter the delivery time here.
Offer - Enter the offer details here.

4.2.31 Image Gallery

Using this shortcode you can add a gallery to your website.

General Settings

Grid Coloumns - You can select the number of grid columns here.
New Tab - Select the checkbox to open the image in a New Tab.

Design Options

Slider - To enable the slider in the gallery please select the checkbox.
Navigation - Using this option user can select the navigation type from the given five options (None, Arrows, Bullets, Fraction, and Progress Bar) and the user will get the options accordingly.
AutoPlay - Users can enable the autoplay option by selecting the checkbox.
AutoPlay Speed - You can set the autoplay speed according to your need. Speed will be in milliseconds like 1000 = 1s.
Loop - Users can enable the loop option in the slider by selecting the checkbox.

Add Image Settings

This setting will appear in the parent's setting of the Image Gallery Shortcode when you click on the box.

Upload - You can upload the image here.
Image Size - User can select the image size by selecting any one option in between (Thumbnail, Medium, Large, Full ).
Link - Users can add a link where the user wants to redirect the page.

4.2.32 Tabular Content

With this shortcode, you can add the tabular content to the website.

General Settings

Tab Style - Users can select the tab style ( Text Format, Image Icon ) and will get options accordingly.
Tab Title - You can enter the title of the tab. This setting will work only when you select tab style as Text Format.
Tab Icons - With this setting, you can add an icon image for the tab. You can add multiple images for each tab.
Tab Ids - You have to assign an ID to each tab and you must have to use the same ID for the child element. You can add comma-separated IDs here.Example: Id1,Id2,Id3 etc. Id must be unique. Don't use any white space between the ids.

Design Options

Additional Color - You can add or change the additional color for the tabular content.

Tab Content Settings

Tab Content Settings will appear in the parent's setting of Tabular Content Shortcode when you click on the box.

Left Heading - Enter the left heading here.
Right Heading - Enter the right heading here.
Section ID - Please enter the same ID that you have entered in the parent shortcode. For example, if this is the first child element then the Id will be Id1 according to the parent shortcode.
Content - With this user can add a description of the tab.

4.2.33 Image With Badge

With this shortcode you can add an image in any section with have a badge.

General Settings

Upload Image - You can upload the image here.
Header - You can enter the header content here.
Label - You can enter the label here.
Footer - You can enter the footer content of the badge here.
Background Color - You can add or change the background color of the badge.
Text Color - You can add or change the text color of the badge.

4.2.34 App Mobile View

With this shortcode, you can display your business process in an eye-catching manner.

General Settings

Main Image - You can add the main image here.
Supporting Images - You can add the supporting images here.

4.2.35 Deal Timer

Using this shortcode user can add a deal timer for showing deal time on the website.

General Settings

Set Date - Enter the targeted date here.
Background Color - You can add or change the background color of the timer from here.
Text Color - You can add or change the text color.
Icon Color - You can add or change the icon color.

4.2.36 Pricing List

With this shortcode, users can set the pricing plan on their website.

General Settings

Pricing Style - You can select a pricing style from here.
Heading - You can write a heading of the plan.
SubHeading - You can write a subheading of the plan.(This setting will works only with style 2 and style 4 ).
Currency Symbol - You can the symbol of the currency.
Package Price - You can decide the pricing of the package.
Time Schedule - You can add the time duration (year, month, week, days).(This setting will works only with style 2, style 3 and style 4 ).
Pricing Icon - You can select the pricing icon.(This setting will appear when user selects the Style 4).
Button Text - You can add the text of the button.
Button Link - You can add the link for the button.

Design Options

Background Type - You can decide the background type like Image or Color.
Background Image - You can add the background image. You can add an image if you select the background type image. (This option will not work with Style 4 of Pricing Style Option).
Image Overlay Color - You can set the image overlay color. This setting will only work if you select a background-type image.
Background Color - You can add the background color for the pricing box. This setting will work if you select a background type color.
Heading Color - You can add or change the color of the heading.
Text Color - You can add or change the color of the text.
Price Color - You can add or change the color of the price.
Border - You can select the border in the pricing box by selecting any one option. ( None, Between List, Top, Bottom, Between List Top, Between List Bottom ).
Border Color - You can add or change the color of the border.
Additional Color - You can add or change the additional color in the pricing box.

Button Settings

Button Background Color - You can add or change the background color of the button.
Button Text Color - You can add or change the text color of the button.
Button Shadow Color - You can add or change the button shadow color.
Button Background Color On Hover - You can add or change the background color of a button on the hover.
Button Text Color On Hover - You can add or change the text color of a button on the hover.
Button Shadow Color On Hover - You can add or change the shadow color of a button on the hover.
Border - Select the box to get the border setting.
Border Style - You can select the style of the border.
Border Width - You can adjust the width of the border. Enter numeric value.
Border Color - You can set the border color.
Border Radius - You can adjust the radius of the border. You can change each of the number individually like 5px 10px 5px 10px. Please don't add a comma(,) between the values, always keep empty space in between them.
Hover Border Color - You can set the border color on hover.

Hover Settings

Background Color - You can add or change the background color of the pricing box on hover.
Text Color - You can add or change the text color of the pricing box on hover.

Add List Setting - These settings come in the parent's settings of the pricing list shortcode when you click on the box.

Heading - Enter heading of the Pricing List section.
Cut Line - Select the checkbox to enable the cut line feature on the heading of the Pricing List.

4.2.37 Instagram Feed

With this shortcode, you can add Instagram posts to any section of the website.

General Setting

Number Of Posts - Enter the number of posts you want to display. Make sure you have connected your Instagram account with the site.
Grid Columns - Select the number of columns.
Columns Gap - Select the Columns Gap. The gap will be counted in Pixel.

Slider Settings

Slider - Select the checkbox to enable slider in the Instagram.
Navigation - Using this option user can select the navigation type from the given five options (None, Arrows, Bullets, Fraction, and Progress Bar) and the user will get the options accordingly.
AutoPlay - Users can enable the autoplay option by selecting the checkbox.
AutoPlay Speed - You can set the autoplay speed according to your need. Speed will be in milliseconds like 1000 = 1s.
Loop - Users can enable the loop option in the slider by selecting the checkbox.

4.2.38 Category Banner

By this shortcode, user can add category banner to the website.

General Settings

Upload Banner Image - Upload the image of the banner here.
Image Render Size - Select the image size for the banner.
Title - Enter the title of the banner.
SubTitle - Enter the subtitle of the banner.
Custom Link - Enter the custom link where the user wants to redirect.

4.2.39 Newsletter

With this shortcode, you can add a newsletter to any section of your website. You can also design the newsletter according to your need.

General Settings

Heading 1 - Enter heading 1 of the newsletter.
Heading 2 - Enter heading 2 of the newsletter.
Heading 3 - Enter heading 3 of the newsletter.
Form Shortcode - Enter the shortcode of the newsletter form which you have created through MotoCom Form Builder.
Overlap Bottom Section - To enable overlap bottom section, select the checkbox.

Design Options

Box 1 background - Users can add or change the box 1 background color.
Box 2 background - Users can add or change the box 1 background color.
Heading 1 color - Users can add or change the heading 1 color.
Heading 2 color - Users can add or change the heading 2 color.
Heading 3 color - Users can add or change the heading 3 color.

4.2.40 MOTOCOM Form

Using this shortcode user can display the Form on any section of the website. For this, you have to first create the form using MOTOCOM Form Builder.

General Setting

Select Form - You can add the form here, which you have made using the MotoCom Form Builder.

4.2.41 Twitter Feed

With this shortcode, users can show the Twitter posts on any section of the website as required.

General Setting

UserName - Enter the user name here.
Number of Tweets - Enter the number of tweets.
Consumer Key - Enter the consumer key.
Consumer Secret Key - Enter the consumer secret key.
Access Token - Enter the access token.
Access Token Secret - Enter the access tocken secret.

Design Options

Icon Color - You can add or change the icon color.

4.2.42 Heading

By using this shortcode users design the heading in the website according to the need.

General Settings

Heading - You can enter the title of the one section. If you want to show some words in different color styles then you can wrap those words between span tag.
Span Color - You can add or change span color if you added some words in the span tag.
Span Font Weight - You can select the font weight of the text you added in the span tag.
Heading Tag - You can select the tags style for heading in between H1 to H6.

Subheading Settings

Subheading - You can add the subtitle of the heading section.
Subheading Position - You decide the position of the subheading by selecting any one option in between (After, Before).
Subheading Color - You can select the color for the subheading.
Subheading Font Size - You can adjust the subheading font size. Please enter the number if you need a custom size (Ex: 20,30). This size will be in Pixel automatically.
Subheading Font Weight - You can select the font weight of the subheading.

Design Options

Heading Color - You can select any color for the heading of the section.
Heading Font Size - You can adjust the font size of the heading. Please enter the number if you need a custom size (Ex: 20,30). This size will be in Pixel automatically.
Heading Font Weight - You can select the font-weight in the heading according to the requirement.
Heading Line Height - Please enter a numeric value if you need custom line height.
Heading Letter Spacing - This setting will create spaces between the characters. Please enter the number if you need custom letter-spacing(Ex: 2,5). This space will be in Pixel automatically.
Heading Text Transformation - You can apply the transformation on heading like(None, Uppercase, Lowercase, Capitalize).
Heading Alignment - You can adjust the heading text alignment according to your need.
Heading Divider - You can set the divider in the heading by selecting any one option.
Divider Thickness - You can adjust the thickness of the divider. Please enter the number if you need custom width (Ex: 2,3). This size will be in Pixel automatically.
Divider Color - You can add or change the divider color.
Custom Padding - Custom padding will only work when you use the background color. You can change each of the number individually like 5px 10px 5px 10px. Please don't add a comma(,) between the values, always keep empty space in between them.

Border Settings

Heading Border - You can add the heading border by selecting the on or off option.
Border Style - You can select the style of the border.
Border Width - You can adjust the width of the border. Enter a numeric value here.
Border Color - You can add or change the border color.
Border Radius - You can adjust the radius of the border. You can change each of the number individually like 5px 10px 5px 10px. Please don't add a comma(,) between the values, always keep empty space in between them.

Background Settings

Background Color - You can add or change the background color.
Box Shadow - You can set the box shadow by selecting checkbox.

4.2.43 Empty Spacer

With this shortcode, you can manage the spaces between the sections of your website.

Empty Spacer Settings - In this setting, you can add a responsible empty spacer between the sections, which varies according to the size of the screen. It will be helpful for your website when the user opens the website on a Mobile, Tablet, Desktop, or Laptop.

Height - How much space do you want between the sections of the website, you have to enter that value into the box. Enter a numeric value here.

5. Menu

First, users have to Navigate to the Appearance from the admin menu, then the users have to click on the Menus to get the settings for Menu creation.

Menus Settings

Auto Add Pages - It will automatically add new top-level pages to the menu.
Display Location - There are three menu locations where users can add the menus like (Home, Our services, contact us, blog, etc) according to your website. The three locations are :

Primary - This is the basic menu's location, which can be commonly used by users.
Mega Menu - With the help of Mega Menu, you can easily add several widgets column-wise, configure them and create a great vertical mega menu.
Profile Menu - Profile menu will appear to logged-in users only.

If you choose the Mega Menu location, then you have to go to the Screen Options, which is on the right side in the upper corner. Where you have to enable the CSS Classes, then the input field to add CSS class will be automatically added in all the menu items. Now you have to add ( has-mega-menu) class to the menu item in which you want to add a Mega Menu.

After adding ( has-mega-menu) class, navigate to the Widgets settings under the Appearance menu, Here you will see a sidebar which name will be the same as the menu item which you have selected for Mega Menu. By Drag and Drop, you can add widget items in this sidebar. All widgets will be shown in the form of columns.

6. MOTOCOM Gallery

Using this you can create Gallery, Portfolio, etc. To add gallery items please navigate to Gallery >> Add New

These are the following steps, by these steps, you can learn how to add or change the settings of the gallery.

Add a title for the gallery item.
Write a detailed description of the item.
You can set a featured image by navigating to the Featured Image Option which will appear at the right bottom corner.
You can also add a category by navigating to the Category option which will appear at the right side corner.
After adding all these settings don't forget to publish the post, by clicking on the Publish button right side in the upper corner.

Note - To displaying the gallery items you will have to use a Portfolio Gallery shortcode on the page using the WPBakery page builder. Check here

7. MOTOCOM Testimonials

Using this you can add the user's testimonial. To add a Testimonial navigate to Testimonials >> Add New

These are the following steps, by these steps, you can learn how to add or change the settings of the testimonials.

Add client name to the title field.
You can add description of the client in the description field.

Testimonial Additional Options:

Designation - Add your client designation.
Featured Image - You can set the featured image of the client.

After adding all these steps do not forget the post it, by clicking on the Publish button right side in the upper corner.

Note- To displaying the Testimonials, you will have to use either Testimonial Box or Testimonial Slider shortcode on the page using the WPBakery page builder. Check here

8. MOTOCOM Form Builder

A plugin to create any type of form. We have added many features to build beautiful forms. MotoCom Form Builder comes with 21 Autoresponder integration. There are lots of features that have added like Import, Export, User Database, Clone Forms, etc. To create a form navigate MOTOCOM Form Builder >> Create New.

After Click on the MotoCom Form Builder, the first page you will see all the form and their shortcodes if you have already made. In the right corner, you will see Create New, Import, and Export buttons.

Create New - Click on this button if you want to create a new form, a popup will be open, you have to put an appropriate name for the form and click the Create button. After click on the Create button, it will redirect you to the form edit screen. There are lots of settings available on the edit screen.

On the edit screen, you have to click on the plus button to add the columns. You can resize these columns by clicking on arrows which are available in the top left corner of the column.

Now you can drag the input fields from the right panel of the screen to the column. Each input fields have their own settings, You can edit them

Form Render As:

You can use the form as a simple Contact form and Newsletter, you can choose anyone according to your need. If you select Autoresponder, then you have to set some more settings.

Autoresponder:

Before it, you have to connect your desired autoresponder by navigating the Autoresponders menu

List - Select the list where you want to store the information.
Name Field - If you want to store user name also with Email then you have to manually select the name field if you are using more than one text field in the form.
Email Field - If you are using more than one email field then you have to manually select the email field.

Mail Settings

To - Please enter the receiver email. You can add multiple receivers emails which will be separated by comma(,).
From - From address, Format must be: your name
Subject - Please enter the subject here.
Additional Headers - You can enter more than one email by adding a comma(,).The format must be ,

Messages

You can edit the Error and Success messages.

Success - Sender's message was sent successfully popup will appear.
Error - Sender's message failed to send popup will appear.
Validation - Validation errors occurred popup will appear.
Required - There is a field that the sender must fill in popup will appears.
Email Validation - Email should be valid popup will appear.

Additional Settings

Some additional settings for button and input filed.

Button Settings

Font Size - You can adjust the font size of the button.
Font Weight - You can select the font weight according to your need.
Padding - You can select the padding options (Default, custom)if you want to add padding.
Custom Padding - You can change each of the number individually like 5px 10px 5px 10px. Please don't add comma(,) between the values, always keep empty space in between them. Using this you can manage your button size.
Background Color - You can set the background color of the button.
Text Color - You can set the text color of the button.
Custom Border - If you want custom border then select the checkbox to get the custom border setting.
Border Width - You can adjust the width of the border. The value will be in pixel.
Border Radius - You can adjust the radius of the border. You can change each of the number individually like 5px 10px 5px 10px. Please don't add a comma(,) between the values, always keep empty space in between them.
Border Color - You can add or change the color of the border.
Inside Form - This setting will only work for Newsletters, If you want to add a button inside the input field then you can use this.
Hover - If you want to hover in your button then select the checkbox.
Background Color - You can set the background on hover.

Text Color - You can add or change the color of the text on hover.
Hover Border Color - You can set the border color on hover.
Custom Action - You can add a custom action URL, if you want to control this form according to your need.

Input Field Settings

Label On Border - To enable label on border select the checkbox.
Fields Size - If you want large field size, then select the checkbox.
Radius - You can adjust the radius of the field. You can change each of the number individually like 5px 10px 5px 10px. Please don't add a comma(,) between the values, always keep empty space in between them.
Background Color - You can set the background color of the input filed.
Border Color - You can also set the color of the border.
Font Color - You can add or change the color of the font.
Placeholder Color - You can also set the color of the place holder.
Margin Form Bottom - Add custom margin from bottom.Enter numeric value here.

Export - You can backup your form using this button.

Import - Restore the backup using the import button.

Note: You have to hit the Update button for each of the Tabs(Form, Mail, Messages, Additional Settings) individually.

9. Slider Revolution

In this MOTOCOM theme, we have provide you a wonderful plugin for a slider, that Slider Revolution. Mainly, you can use this plugin at banner. You can visually create sliders, modules and web pages with the Slider Revolution WordPress Plugin.

Want to know more about this plugin, please visit this Link.

Here is the link from where you can understand how to use the slider revolution in your website: Documentation.

And here are some video tutorials which will help you to unsderstand that how you can use the slider revolution in you website: Video tutorials.

10. Widgets

The MOTOCOM Theme includes several custom widgets. All widgets are accessed in the Widgets section of the WordPress admin. Widgets can be added to any sidebar, footer, and mega menu. There are various fields and settings present to choose for each individual widget all are self-explanatory. You can put as many widgets as you want inside of a sidebar or footer or megamenu.

To Add Widgets, Follow The Steps Below

Step 1 - Navigate to Dashboard >> Appearance >> widgets to access the list of widgets and widget sections that they can be added to. The left hand side shows all the widgets you can use. The right hand side shows all the different sections you can add widgets to.
Step 2 - Simply drag and drop the widget you want into the widget section you want on the right hand side.
Step 3 - When finished, make sure to click Save in the widget editing box to save the widgets added to your sidebar.

10.1 MOTOCOM Widgets

Our MOTOCOM theme has some additional widget which can be easily added to your site and you can also control the design and content of your website without having to code.

In this section you will learn and get information about the MOTOCOM widgets.

MOTOCOM Categories - This widget helps you to display any MOTOCOM Category in which you can select any post type like testimonial, gallery, etc.
Newsletter - This will enable you to display the newsletter on any sidebar with description.
Post Type Categories - It displays the post type categories.
About Author - This widget display the author information.
Blog Posts - Using this widget user can display the blog posts on their website.
Twitter Feed - With this widget user will be able to display their twitter posts.

User Guide

1. General Information & Installation

1.1 Introduction

1.1.1 Key Features

1.1.2 System Specification

1.1.3 Created Date

1.2 Theme & Plugins Installation

1.2.1 Download Theme

1.2.2 Theme Installation

Installation Via WordPress

Installation Via FTP

Authentication Key

1.2.3 Plugins Installation

1.3 Update Theme & Plugins

2. Demo Content

3. Theme Options

3.1 Demo Importer

3.2 Under construction

3.3 Login Screen

3.4 Header Settings

3.4.1 Pre Header

3.4.2 Main Header

3.4.3 Profile Menu

3.4.4 Title/BreadCrumb

3.5 Sidebar

3.5.1 General Settings

3.5.2 Widgets Title Settings

3.5.3 Additional Setting

3.6 Footer

3.6.1 General Settings

3.6.2 Copyright Settings

3.6.3 Scroll To Top Button

3.7 Appearance

3.7.1 Theme Style

3.7.2 Theme Button Styles

3.7.3 Theme Typography

3.8 Social

3.8.1 Social Share

3.8.2 Add Social Page URL

3.8.3 Social Icons Border Setting

3.9 Custom Code

3.10 Header / Footer Scripts

3.11 Import & Export

4. WPBakery & Shortcodes

4.1 WPBakery Page Builder

4.2 MOTOCOM Shortcodes

4.2.1 Features

4.2.2 Testimonial Slider

4.2.3 Button

4.2.4 Services

4.2.5 Boxed Image

4.2.6 Team

4.2.7 Countdown Timer

4.2.8 Portfolio Gallery

4.2.9 Event Notice

4.2.10 Image

4.2.11 Video

4.2.12 Icon

4.2.13 Lists

4.2.14 Thumbnail Banner

4.2.15 Counters

4.2.16 Image With Background Animation

4.2.17 Vertical Banner

4.2.18 Categories

4.2.19 Social Icons

4.2.20 Blog Posts

4.2.21 About Author

4.2.22 Alert Message

4.2.23 Testimonial Box

4.2.24 Contact Info

4.2.25 Video Play Icon

4.2.26 Search Box

4.2.27 Accordion

4.2.28 Search With Inside Button

4.2.29 Posts Slider

4.2.30 Rating Box

4.2.31 Image Gallery

4.2.32 Tabular Content

4.2.33 Image With Badge

4.2.34 App Mobile View