Buid an example

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

Note: You need Wordpress, ORGANIZ & plugins are already. Building other homepages process are similar.

Overview elements area on page

Building

BUILDING HEADER AREA

You can consult this video guide on How to build Header Area. This process is similar to building Header Area on ORGANIZ theme.

Setting header

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

Note:

Add widgets to Top Bar Left area

Go to Apperance > Widget and do follow:

Add widget: G5plus:Login-Register to the Top Bar Left widget area:

Add widgets to Top Bar Right area

Add widgets Text to Top Bar Right area.

and then add content to Text widget as below:

Code HTML for Text Widget in Top Bar Right:

<div class="custom-dropdown-list fold-out hover">
	<a href="http://dev.g5plus.net/organiz/my-account/" title="My Account">My Account  <i class="fa fa-angle-down"></i></a>
	<ul class="fold-out-drop drop-shadow">
		<li><a href="#" class="organiz-mailchimp-link-popup" title="Newletter">Newletter</a></li>
		<li><a href="#" title="Help">Help</a></li>
		<li><a class="organiz-login-link-sign-in" href="#">Login</a></li>
		<li><a class="organiz-login-link-sign-up" href="#">Creat Account</a></li>
	</ul>
</div>

<div class="custom-dropdown-list fold-out hover">
	<a href="#"><img class="iclflag" src="http://dev.g5plus.net/organiz/wp-content/uploads/2017/03/en.png" alt="en" title="English">English  <i class="fa fa-angle-down"></i></a>
	<ul class="fold-out-drop drop-shadow">
		<li><a href="#"><img class="iclflag" src="http://dev.g5plus.net/organiz/wp-content/uploads/2017/03/en.png" alt="en" title="English">English</a></li>
		<li><a href="#"><img class="iclflag" src="http://dev.g5plus.net/organiz/wp-content/uploads/2017/03/fr.png" alt="fr" title="French">French</a></li>
		<li><a href="#"><img class="iclflag" src="http://dev.g5plus.net/organiz/wp-content/uploads/2017/03/de.png" alt="Ger" title="German">German</a></li>
		<li><a href="#"><img class="iclflag" src="http://dev.g5plus.net/organiz/wp-content/uploads/2017/03/ja.png" alt="Japan" title="Japanese">Japanese</a></li>
	</ul>
</div>

<div class="custom-dropdown-list fold-out hover">
	<a href="#">USD  <i class="fa fa-angle-down"></i></a>
	<ul class="fold-out-drop  drop-shadow">
		<li><a href="#">EUR</a></li>
		<li><a href="#">GBP</a></li>
		<li><a href="#">INR</a></li>
	</ul>
</div>

Upload logo

Go to Theme Options > Logo Setting tab, do follow:

Create menu

Go to Apperance > Menus, do follow:

Setup Header Custom

Go to ThemeOptions > Header Customize, do follow:

Building footer area

Settings Footer

Footer Area on the frontend

Go to ThemeOptions > Footer tab, then setup general options for Footer area and Bottom Bar area.

Add widgets to FOOTER 1 area

Add G5Plus: Logo widget and Text widget: and G5Plus: Profile widget.

Setup these widgets as below:

and then add content to Text widget as below:

• Text 2

		<ul>
			<li><i class="fa fa-map"></i> 101 W 22nd St #300, Kansas City, MO 64108 , USA</li>
			<li><i class="fa fa-envelope"></i> jacskstac.com - support@domain.com</li>
			<li><i class="fa fa-phone-square"></i> ( +214 )6 8989 8745 - ( +214 )6 8989 8746</li>
		</ul>
		

Add widgets to FOOTER 2 area

Add Text widget to FOOTER 2 widget area

Add Widgets to FOOTER 3 area

Add Custom menu widget:

Add Widgets to FOOTER 4 area

Add Instagram widget:

CSS Class:

instagram-grid-3-columns

Add Widgets to BOTTOM BAR LEFT area

Add Text widget:

CSS Class:

pd-top-5

Add Widget to BOTTOM BAR RIGHT area

Add Text widget:

CSS Class:

widget-bottom-bar-right xs-text-center

Code HTML for Text Widget in Bottom Bar Right:

• Text

		<a href="#"><img class="iclflag"img src="http://dev.g5plus.net/organiz/wp-content/uploads/2017/03/visa.jpg" loading="lazy" alt="VISA" title="VISA"></a>
		<a href="#"><img class="iclflag"img src="http://dev.g5plus.net/organiz/wp-content/uploads/2017/03/master-card.jpg" loading="lazy" alt="Master Card" title="Master Card"></a>
		<a href="#"><img class="iclflag"img src="http://dev.g5plus.net/organiz/wp-content/uploads/2017/03/jcb.jpg" loading="lazy" alt="JCB" title="JCB"></a>
		<a href="#"><img class="iclflag"img src="http://dev.g5plus.net/organiz/wp-content/uploads/2017/03/delivery.jpg" loading="lazy" alt="Cash on Delivery" title="Cash on Delivery"></a>
		<a href="#"><img class="iclflag"img src="http://dev.g5plus.net/organiz/wp-content/uploads/2017/03/smartlink.jpg" loading="lazy" alt="SmarkLink" title="SmarkLink"></a>
		<a href="#"><img class="iclflag"img src="http://dev.g5plus.net/organiz/wp-content/uploads/2017/03/123pay.jpg" loading="lazy" alt="123Pay" title="123Pay"></a>