Manual Setting Up

CREAT A NEW PAGE

You can create any number of pages with content. Our theme includes several page templates to choose from, and you will need to choose the page template that suits your needs. All of this is done in the pages section of your WordPress admin.

If you DID NOT One Click Install demo, you will need to MANUALLY CREATE your Home and other pages. Here’s how to build a new page:

Step 1 – Navigate to Pages in your admin sidebar and click Add New option.


Step 2 – Input a new name for your page, and click BACKEND EDITOR to build page by Visual Composer or click FRONTEND EDITOR to build page by Visual Composer on the frontend (make sure that you have installed Visual Composer plugin).


Step 3: Content for your page goes in the editing field, use the Visual or Text editor. With Visual Composer, page content is mainly built using Shortcodes, Template. See the Shortcodes and Templates section for how to use them. You can also use our demo content, see the corresponding section of this document for the demo code of each page.

  • Don't click BACKEND EDITOR: It means that you could input content to Classic Mode Area, then go to Step 4
  • Click BACKEND EDITOR: your screen could be like this

Step 4 – Setup values for Page Settings which will affect to this page only and override options set in the Preset (if this page apply any Preset) or Theme Options. With each page, Page Settings is first priority, next is Preset, then is Theme Options, any change in Page Settings just affect to this page, not entire website.

General Settings:


Menu Settings:

Any option that was set to be Default or was not customized means that it will use the value of equivalence option you have set in Preset (if this page apply any Preset) or Theme Options. Insert a different value to override the Preset/ Theme Option value.

You could consult our guide on How to use Preset for more details on How to apply Preset to a Page/Post

Step 5 – Set your Parent page (It’s usually set to No Parent).

Step 6 – Set featured image for your page (optional)

Step 7 - You can save draft/preview or publish this page and set it as your frontpage. You could consult Settings a static page as Home section.

SIDEBARS AND WIDGETS

WordPress comes with built-in default widgets for your themes. Apart from these default widgets, OARS comes with 10 custom widgets. In order to use these widgets, from WP dashboard, navigate to Appearance → Widgets.

These screenshots below are list of pre-defined sidebars as well as their locations on a page, so that you will find it easier when pulling out widgets to set up your site.

Widget Name Description
G5Plus Banner A widget to display ad banners.
G5Plus Payment A widget to display payment methods.
G5Plus: Price Filter List A widget to display Price Filer in drop-down list style
G5Plus: Price Filter List A widget to display categories of products
G5Plus: Product Category Filter A widget to display a product sorting list.
G5Plus: Product Shorting A widget to display a Filter of products list by attribute
G5Plus: Product Filter by Attribute A widget to display a Filter of products list by attribute
G5Plus: Posts A widget to display posts in 4 custom layout (carousel, mix, small image, list) and 6 post sources: popular, random, recent, oldest, trending, video post
G5Plus: Social Profile A widget to display social profile.
G5Plus: Twitter A widget to display recent twitter
G5Plus: Login - Register A widget to display login - register form

You can add widgets to widget areas simply by hover the widget then drag-drop to widget area as your liking

Content Block

Drag-drop widget to widget area

Widgetised Sidebar in WPBakery Page Builder : You can use Widgetised Sidebar element in WPBakery Page Builder to build a Content Block then use this Content Block to display as Top Bar, Top Drawer, Bottom Bar, Footer, 404 Page in Theme Options (or Preset)

And now we will show you some example of How these widgets display on the frontend (except 2-Top Bar Left, 3-Top Bar Right widget area and 10-Canvans widget area have not been available on Pepper demo Data now)

1-Main Sidebar Widget Area on frontend

4-Footer 1, 5-Footer 2, 6-Footer 3, 7-Footer 4 Widget Area on frontend

Canvas sidebar Widget Area on frontend (this widget area now is available on demo HOME 6)

11-Woocommerce Filter Widget Area on frontend

12-Footer 4 Home 4, 13- Footer 1 Home 4, 14- Footer 2 Home 4 Widget Area on frontend

13-Shop Sidebar Widget Area on frontend

DEMO HOMPAGE

Visual Composer is the most powerful and used WP pagebuilder and there is more than 1 million sites that are using that to create homepage. This plugin is included in OARS theme by free to create advanced and complex homepage in simplest way ever has seen!

Now you can start fiddling with Visual Composer to build your home page with any design that you like and also you can read the Visual Composer documentation to learn how to use it HERE

In case you don't have time for experience with it, you can use Classic Mode and switch to the Text tab, then paste this code into the content of your page. It help you build your frontpage based on one of the pre-made home page we offer and create a new page similar to our demo Homepage.

demo HOME 1

demo HOME 2

demo HOME 3

demo HOME 4

demo HOME 5

demo HOME 6

demo HOME 7

demo HOME 8

BUILDING ONEPAGE

Home OnePage aims to focus the user's attention to the content that they want. When you choose an item on Main Menu of OnePage, it immediately navigates to the section that you've chosen.

If you want to build your Home OnePage please consult our guide below:

Step 1 - You just have to create a Menu with Links as items.

Step 2 - Go to your homepage, anywhere you want the menu item to navigate to section, please edit row by Visual Composer and type id on field: Row ID (make sure that the Row ID is the same as menu item URL)

Step 3 - After building content to your Homepage, scroll down to Page Settings area to choose style of page is OnePage

You could please consult our video guide on How to build OnePage (We use ORSON theme for example but this process is similar to the process of building OnePage on OARS theme).

Video guide on How to build one page (Ex: ORSON Theme)

BUILD AN EXAMPLE HOMEPAGE

THIS IS STEP BY STEP GUIDE ON HOW TO BUILD HOMEPAGE MANUALLY FOR HOME 1

Note: You need Wordpress, OARS theme & all required plugins are already. Building other homepages process are similar.

I. OVERVIEW ELEMENTS AREA ON PAGE

You can setup options in Theme Options (which will affect to entire website) or create a new Preset and apply to any page. Please consult this video guide on How to build Header Area. This process is similar to building Header Area on OARS theme.

The screenshot below is an header area:

II. BUILD HEADER AREA

You can setup options in Theme Options (which will affect to entire website) or create a new Preset and apply to any page. Please consult this video guide on How to build Header Area. This process is similar to building Header Area on OARS theme.

The screenshot below is an header area:

Content Block

Canvas Sidebar on the frontend

1.1 Setting header

If you want apply this header to all your pages, setup by going to Theme Options → Header tab, In case you only want to apply this header for some pages/posts such as homepage, please create a new Preset then setup options for Header Area as your liking as below. (You can consult Preset Options section for more details in use Preset)

Content Block

Canvas Sidebar on the frontend

1.2 Add widget to Canvans Sidebar

As you see in Header Options we has choose Canvans Menu to display in Header Navigation, so in this section we will show you how to build Canvas sidebar.

Content Block

Header Options tab in Preset

From WP dashboard, go to AppearanceWidgets

Content Block

Header Options tab in Preset

Drag and drop widgets as below to Canvas Sidebar area:

Content Block

Add widgets to Canvas Sidebar

Update content to these widget as below:

Content Block

Setup for widgets in Canvas Sidebar widget area

1.3 Upload logo

Go to Theme Options → Logo tab, then change logo (please read detailed description below each item before upload):

Content Block

Logo Options tab in Preset

1.4 Create menu

The menu is one of the most important elements of the site. It provides your visitors with the information about site structure. If your menu has well-thought and conveniently grouped elements, you visitors will be able to find the needed section easily. You can also consult Mega Menu section to build an attractive menu by your own.

Navigate to AppearanceMenus section to manage all menus on your site and do follow as below screenshot:

Content Block

Appearance → Menus

In the Menu Settings section, click to Primary Menu to setup this menu to be the main site menu and is used almost in all header styles and menu locations.

If you want to extra more fields to add to your menu, you can click on Screen Options and select:

Content Block

Extra fields to add to menu

Finally, don't forget to Save Menu after everything is set properly and check it on the site.

II. BUILD FOOTER AREA

The screenshot below is demo Footer Area on the frontend

Content Block

Extra fields to add to menu

2.1 Add widgets to FOOTER 1 area

Go to Widget Manager

Add Text widget and G5Plus: Infor Box widget to Footer 1 area

1. Add Text widget to Footer 1 area and setup as below:

2. Add G5Plus: Info Box widget to Footer 1 area and setup as below:


2.2 Add widgets to FOOTER 2 area

Add G5Plus: Social Profile widget to FOOTER 2 widget area


2.3 Add Widgets to FOOTER 3 area

Similar to FOOTER 2 widget area, we add Custom Menu widget to FOOTER 3 widget area:

2.4 Add Widgets to FOOTER 4 area

Add G5Plus: Banner widget and Text widget and G5Plus: Social Profile to Footer 4 area

1. Add G5Plus: Banner widget:

2. Add Text widget:

3. Add G5Plus: Social Profile widget:

Notice: You can create a new widget simply like this:


2.5 Settings Footer

Add New Content Block for Footer area

You can use Visual Composer elements/shortcodes/templates to build your Footer Area as your liking

Content Block

Add New Content Block for Footer area

In this Content Block, We use shortcode of Mailchimp form to add to Text Block shortcode (Please consult Mailchimp Settings section for more details about this shortcode) and Widgetised Sidebar in Visual Composer to build Content Block and apply to Footer area.

Specify the Content Block to use as a footer content in Theme Options

Go to Theme OptionsFooter tab, then setup general options for Footer area and specify the Content Block to use as a footer content. In case you only want to apply this Footer for some pages/posts such as homepage, you need to create a new Preset then setup options for Footer Area as your liking as below. (You can consult Preset Options section for more details in use Preset)

Content Block

Footer Settings in Preset

CONTACT FORM

You can do step by step as image below to build contact form

Add New Contact Form

You can visit Contact Form 7 Plugin to further details. Or copy and paste content to Form field like this:

Example Value Content for Contact Form

You can also consult a lot of our contact forms have been created here:

IMPORT SLIDER HOME PAGE

After setting up the homepage, you need to setup the slider for homepage to make it display the same as in live preview. The download package contains the exported slider (Revolution Slider) that can be used as your slider template. Please follow the steps below to import it to your shop:

  • Go to "Revolution Slider"
  • Click "Import Slider" button
  • When a popup appear, click "Browse" and select one of zip sliders(these files include in main file downloaded) file.
  • Click "Import Slider" button to start import the selected slider
  • Repeat the steps to import all

You could consult our video guide on How to Import Slider using Revolution Slider

Please note that these steps are to set up slider for homepage the same as in live demo. If you want to make your own slider, please follow the official Slider Revolution document.

SETTING A STATIC PAGE AS HOME

If you installed OARS demo Data, you don’t need to create a new Home Page, you just need to choose from the list Home Pages that were automatically created from the demo content, following these steps:

  • Go to Settings → Reading.
  • For Front page displays, select A static page (select below)
  • Choose any homepage as you want... from the dropdown for Front page
  • Click Save Changes

Save all your changes!

TRANSLATE THEME

People all around the world use WordPress, around 44% of WordPress websites are written in a language other than English. We’re about to show you how to translate our themes. Using Make as an example, we’ll show you how to translate Pepper theme to Vietnamese, to be precise!

We will using Loco Translate plugin that provides in-browser editing of WordPress translation files.

  • 1. Install and activate LOCO Translate plugin.
  • 2. Create and update language files directly in your theme or plugin.
  • 3. Saving custom translations.

Please confsult our video guide on How to translate G5THEME Theme using LOCO Translate plugin, We have been use Mowasalat theme for example and the process of Pepper theme translation is similar to this.

Video guide on How to translate theme using LOCO plugin

Copyright © 2022 - G5Theme
On this page
Check
No recent searches
No results for "adasds"