Theme setting up

One Click Install Demo Data

With ORION, you can build a fully functional website just by clicking a button and install our demo data or click 5.2.1 Create A New Page to step by step. Your ORION installation will be set up with what we have on our demo website, and you can use it as a template to develop your own website.

Go to G5Theme => Install Demo

Then choose Install demo data you want:

The process would be displayed on import status bars so you will know when it finish and your data is ready.

DONE. Now, you can visit your website to view demo.

Manual Settings Up

Building An Example

THIS IS STEP BY STEP GUIDE ON HOW TO BUILD HOME PAGE MANUALLY FOR ORION CREATIVE AGENCY 03 DEMO

Need Wordpress, Orion & plugins are already

I. Overview elements area on page

II. BUILDING

1. Build & Setting Top Bar area

1.1 Build Top Bar Left

Add a "Text" widget to Top Bar Left Area

Go to Widget Manager and do follow

Add Text Widget

1.2. Build Top Bar Right

Add Two "Text" widgets and "G5Plus - Social Profile" widget to Top Bar Right Area

Add Text Widget 01

Code HTML

<div id="lang_sel">Language:
	<ul>
		<li> <a href="#" class="lang_sel_sel icl-en">ENGLISH </a>
			<ul>
				<li class="icl-fr"> <a href="#"> FRENCH </a></li>
				<li class="icl-de"> <a href="#">GERMAN </a></li>
				<li class="icl-ja"> <a href="#"> JAPANESE</a></li>
			</ul>
		</li>
	</ul>
</div>

Add Text Widget 02

Add Social Profile Widget :

2. Build & Setting header area

You can consult this video guide on How to build Header Area

2.1 Upload logo

Go to ThemeOptions >> Logo Setting tab, and upload or choose an image from library to be Logo as you want:

2.2 Create menu

Go to Apperance >> Menus, do follow:

2.3 Settings

Go to ThemeOptions >> Header tab, then setup options for Header Area as your liking:

3. Import slider & create home page

3.1 Import slider simple

You can consult how to import slider at IMPORT SLIDER HOME PAGE
section. And locate zip file slider to import on path: orion\wp-content\plugins\orion-framework\core\install-demo\data\creative-agency\revslider

3.2 Create A New Page

<p style="text-align: center;">Founded in 2014, by designers Leonard, OrionStudio is a global brand and design agency with offices in the creative hubs of London and San Francisco. I opened the agency after spotting a split in the creative industry. Studios were either boutique and beautiful, but only managing to work on a few projects or of a massive scale and impersonal with their client relationships. DesignStudio was created with the aim to fill this gap – delivering the quality of boutique, bespoke design to global brands and audiences. Using effective strategies and innovative creative thinking we engage audiences, encourage relevant conversation, influence behaviour, and achieve brand objectives.</p>
[/vc_column_text][g5plus_space desktop="60" tablet="60" tablet_portrait="60" mobile_landscape="60" mobile="60"][vc_single_image image="1862" img_size="full" alignment="center"][/vc_column][/vc_row][vc_row layout="container"][vc_column][g5plus_space desktop="100" tablet="80" tablet_portrait="60" mobile_landscape="50" mobile="50"][/vc_column][vc_column width="1/4" el_class="xs-pd-bottom-50 col-mb-12" offset="vc_col-xs-6"][g5plus_counter title="PROJECTS COMPLETED" end="90" suffix="+" counter_style="style-center"][/vc_column][vc_column width="1/4" el_class="xs-pd-bottom-50 col-mb-12" offset="vc_col-xs-6"][g5plus_counter title="Web Awards" end="50" suffix="+" counter_style="style-center"][/vc_column][vc_column width="1/4" el_class="xs-pd-bottom-50 col-mb-12" offset="vc_col-xs-6"][g5plus_counter title="Happy Clients" end="120" suffix="+" counter_style="style-center"][/vc_column][vc_column width="1/4" el_class="xs-pd-bottom-50 col-mb-12" offset="vc_col-xs-6"][g5plus_counter title="Cups of Coffee" end="240" suffix="+" counter_style="style-center"][/vc_column][vc_column][g5plus_space desktop="120" tablet="100" tablet_portrait="80" mobile_landscape="60" mobile="50"][/vc_column][/vc_row][vc_row el_class="background-half-blue-grey"][vc_column][vc_row_inner layout="container"][vc_column_inner][g5plus_video video_layout="video-creative" video_image_bg="2119" video_image_bg_opacity="30" video_url="https://www.youtube.com/watch?v=IRxqMV9PH-E"][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row][vc_row css=".vc_custom_1478331132020{background-color: #f5f8fa !important;}"][vc_column][g5plus_space desktop="60" tablet="40" tablet_portrait="20" mobile_landscape="0" mobile="0"][vc_row_inner layout="container"][vc_column_inner][g5plus_testimonials testimonials_layout="avatar-dots-nav" item_active="5" slider_trend="slider-horizontal" avatar_align="avatar-bottom" values="%5B%7B%22author_bio%22%3A%22Unique%20themes%2C%20unique%20service%20-%20Orion%20not%20only%20produce%20a%20wonderful%20product%20-%20They%20guide%20you%20through%20making%20the%20product%20work%20for%20YOU!%20Responsive%20layout%20and%20responsive%20staff...%20Could%20you%20ask%20for%20more%3F%22%2C%22author_name%22%3A%22Nina%20Chambers%22%2C%22author_job%22%3A%22Web%20Developer%22%2C%22author_avatar%22%3A%22626%22%7D%2C%7B%22author_bio%22%3A%22Unique%20themes%2C%20unique%20service%20-%20Orion%20not%20only%20produce%20a%20wonderful%20product%20-%20They%20guide%20you%20through%20making%20the%20product%20work%20for%20YOU!%20Responsive%20layout%20and%20responsive%20staff...%20Could%20you%20ask%20for%20more%3F%22%2C%22author_name%22%3A%22Jeremy%20Carlson%22%2C%22author_job%22%3A%22Web%20Designer%22%2C%22author_avatar%22%3A%22627%22%7D%2C%7B%22author_bio%22%3A%22Unique%20themes%2C%20unique%20service%20-%20Orion%20not%20only%20produce%20a%20wonderful%20product%20-%20They%20guide%20you%20through%20making%20the%20product%20work%20for%20YOU!%20Responsive%20layout%20and%20responsive%20staff...%20Could%20you%20ask%20for%20more%3F%22%2C%22author_name%22%3A%22Josie%20Howell%22%2C%22author_job%22%3A%22Creative%20Director%22%2C%22author_avatar%22%3A%22628%22%7D%2C%7B%22author_bio%22%3A%22Unique%20themes%2C%20unique%20service%20-%20Orion%20not%20only%20produce%20a%20wonderful%20product%20-%20They%20guide%20you%20through%20making%20the%20product%20work%20for%20YOU!%20Responsive%20layout%20and%20responsive%20staff...%20Could%20you%20ask%20for%20more%3F%22%2C%22author_name%22%3A%22Kawhi%20Leonard%20%20%22%2C%22author_job%22%3A%22Web%20Developer%22%2C%22author_avatar%22%3A%22626%22%7D%2C%7B%22author_bio%22%3A%22Unique%20themes%2C%20unique%20service%20-%20Orion%20not%20only%20produce%20a%20wonderful%20product%20-%20They%20guide%20you%20through%20making%20the%20product%20work%20for%20YOU!%20Responsive%20layout%20and%20responsive%20staff...%20Could%20you%20ask%20for%20more%3F%22%2C%22author_name%22%3A%22Jeremy%20Carlson%22%2C%22author_job%22%3A%22Web%20Designer%22%2C%22author_avatar%22%3A%22627%22%7D%2C%7B%22author_bio%22%3A%22Unique%20themes%2C%20unique%20service%20-%20Orion%20not%20only%20produce%20a%20wonderful%20product%20-%20They%20guide%20you%20through%20making%20the%20product%20work%20for%20YOU!%20Responsive%20layout%20and%20responsive%20staff...%20Could%20you%20ask%20for%20more%3F%22%2C%22author_name%22%3A%22Josie%20Howell%22%2C%22author_job%22%3A%22Web%20Developer%22%2C%22author_avatar%22%3A%22628%22%7D%5D"][/vc_column_inner][/vc_row_inner][g5plus_space desktop="80" tablet="60" tablet_portrait="40" mobile_landscape="20" mobile="20"][/vc_column][/vc_row][vc_row layout="container" equal_height="yes"][vc_column][g5plus_space desktop="115" tablet="95" tablet_portrait="75" mobile_landscape="55" mobile="50"][g5plus_heading title="WHAT WE CAN DO" sub_title="EXPERT OUR" align="text-center"][g5plus_space desktop="50" tablet="35" tablet_portrait="35" mobile_landscape="35" mobile="35"][/vc_column][vc_column width="1/3" el_class="sm-pd-bottom-50"][g5plus_icon_box icon_type="image" icon_image="184" title="WEB DESIGN" description="The Orion that recognize the talent and effort of the best web designers, developers and agencies in the world."][/vc_column][vc_column width="1/3" el_class="sm-pd-bottom-50"][g5plus_icon_box icon_type="image" icon_image="187" title="DEVELOPMENT" description="The Orion that recognize the talent and effort of the best web designers, developers and agencies in the world."][/vc_column][vc_column width="1/3"][g5plus_icon_box icon_type="image" icon_image="186" title="MARKETING" description="The Orion that recognize the talent and effort of the best web designers, developers and agencies in the world."][/vc_column][vc_column][g5plus_space desktop="110" tablet="90" tablet_portrait="70" mobile_landscape="50" mobile="50"][/vc_column][/vc_row][vc_row css=".vc_custom_1478331453195{background-color: #f5f8fa !important;}"][vc_column][g5plus_space desktop="115" tablet="95" tablet_portrait="75" mobile_landscape="55" mobile="50"][g5plus_heading title="OUR BLOGS" sub_title="LATEST FROM" align="text-center"][g5plus_space desktop="50" tablet="35" tablet_portrait="35" mobile_landscape="35" mobile="35"][vc_row_inner layout="container"][vc_column_inner][g5plus_post source="recent" layout="no-excerpt" layout_classic="thumb-bottom-padding" number="5" arrows="" autoplaytimeout="5000" items_md="3" items_sm="3" items_xs="2" items_mb="1" is_slider="true"][/vc_column_inner][/vc_row_inner][g5plus_space desktop="90" tablet="70" tablet_portrait="50" mobile_landscape="30" mobile="30"][/vc_column][/vc_row][vc_row][vc_column][g5plus_space desktop="115" tablet="95" tablet_portrait="75" mobile_landscape="55" mobile="50"][g5plus_heading title="OUR TEAM" sub_title="MEET EXPERT" align="text-center"][g5plus_space desktop="65" tablet="45" tablet_portrait="35" mobile_landscape="35" mobile="35"][g5plus_our_team number="10" columns="6" team_padding="no_padding" width="320" height="400" arrows="" autoplaytimeout="5000" items_md="4" items_sm="3" items_xs="2" items_mb="1" is_slider="true" dots="true"][g5plus_space desktop="115" tablet="95" tablet_portrait="75" mobile_landscape="55" mobile="50"][/vc_column][/vc_row][vc_row css=".vc_custom_1478318942224{background-color: #f5f8fa !important;}"][vc_column][g5plus_partner items="6" item_height="220" arrows="" autoplaytimeout="5000" items_md="4" items_sm="3" items_xs="2" items_mb="1" partners="%5B%7B%22images%22%3A%2282%22%2C%22link%22%3A%22url%3A%2523%7C%7C%7C%22%7D%2C%7B%22images%22%3A%2285%22%2C%22link%22%3A%22url%3A%2523%7C%7C%7C%22%7D%2C%7B%22images%22%3A%2284%22%2C%22link%22%3A%22url%3A%2523%7C%7C%7C%22%7D%2C%7B%22images%22%3A%2281%22%2C%22link%22%3A%22url%3A%2523%7C%7C%7C%22%7D%2C%7B%22images%22%3A%2280%22%2C%22link%22%3A%22url%3A%2523%7C%7C%7C%22%7D%2C%7B%22images%22%3A%2283%22%2C%22link%22%3A%22url%3A%2523%7C%7C%7C%22%7D%5D"][/vc_column][/vc_row]

Click classic mode, add code below:

4. Choose Source Data Content For Portfolio,Our Team

4.1 Choose data for Portfolio shortcode

Follow below to create Portfolio item or Category

4.2 Choose data for Our Team shortcode

Follow below to create Our Team item or Category

5. Setting Footer & Create Content Footer

You could consult our video guide on How to build Footer Area

5.1 Settings Footer

Footer Area on the frontend

Go to ThemeOptions >> Footer tab, then setting below

5.2 Create Contact Form 7 for Footer

Go to Contact >> Add New and do follow:

Code for contact here

<div class="form-contact-wrap large-form">
	<div class="row">
		<div class="col col-md-6">
			[text* your-name placeholder "Name"]
		</div><div class="col col-md-6">
		[tel your-tel placeholder "Tel"]
	</div></div>
	[email* your-email placeholder "Email"]
	[textarea* your-subject placeholder "Message"]
	<div class="form-submit">
		[submit class:m-button class:m-button-primary class:m-button-3d "Send us now"]
	</div>
</div>

5.3 Add widgets to Footer 1 area

Go to Appearance >> Widget

Add G5Plus: Logo widget:

Add Text widget:

Add G5Plus: Social Profile widget:

5.4 Add widgets to Footer 2 area

Add Text widget to Footer 2

Code HTML

<div>
	<span>A :</span>
	<span> 40 Baria Sreet 133/2 NewYork City, US</span>
</div>
<div>
	<span>P :</span>
	<span> (00) 123 456 789</span>
</div>
<div>
	<span>F :</span>
	<span>(00) 987 654 321</span>
</div>
<div>
	<span>E :</span>
	<span>info.contact@gmail.com</span>
</div>

5.5 Add widgets to Footer 3 area

Add G5Plus - Post widget to Footer 2

5.6 Add widgets to Bottom Bar Left area

Add Custom Menu widget to Bottom Bar Left area

Add TexT widget to Bottom Bar Left area

Import Demo Content

If you are new to WordPress and have problems with setting up the theme you might want to import the demo content file that comes with the theme. The following actions will import some dummy posts and pages from the live preview:

Go to menu Tools > Import
Select WordPress from the list
If you haven't installed the WordPress import plugin, a popup window will appears and ask you to install it. Just click Install Now. When the installation progress is completed, click Activate Plugin & Run Importer. If you have installed this plugin, skip to next step.
Click Browse and select demo-data.xml file from the download package
(Example: Creative Agency on path: g5plus-orion\assets\data-demo\creative-agency, so the same for others)
Click Upload file and import
When you are asked to import author, you can create new author or import to existing author. You also should check the Download checkbox and import file attachments.

Select WordPress from the list

Continue with steps in image

You would be asked to assign author, please selected and continue

After completing all above steps, open frontend screen to see your result.

If you don't want to use the demo content pack, you can read the instructions on how to work with our theme built-in Page Builder below to make your own pages.