Pav Metro Guide
- Created: 03/10/2013
- latest Update: 04/01/2013
THANK YOU FOR PURCHASING OUR THEME! Here are some basics on installing, configuring and customizing the PavTheme, BEFORE WE GO The theme and the sample data is provided "as is". Customizing code and other design related issues can be done as freelance work on a $50-100 hourly rate only with Paypal and/or Skrill, if PavTheme's available. If you are new to Opencart, please understand I cannot fix your site for free. PavTheme would love to help everyone but there is no time. I suggest reading documentation available online regarding using Opencart, server requirements, etc. Thank you! PavTheme Team
Install Quickstart
The Quickstart Package consists on a complete Opencart! + Template + Various Extensions + Sample Content, excellent for beginner users to explore back-end settings and sample content. Installing the Quickstart is just like installing Opencart!, but you will have the full demo of the theme on your server. Once your environment is ready, follow this quick guide:
- Localhost only: create a new folder in the htdocs folder for Xampp (www folder for Wamp). Example: mywebsite
- Unpack all files and folders of the Template Package file and open the Quickstart folder.
- Copy the content (all files and folders) of the Quickstart folder into this newly created folder (htdocs folder for Xampp / www folder for Wamp) or upload them into your sub-domain folder on your live site.
- Open your favorite browser and type in the address bar localhost/mywebsite for localhost or sub-domain.my-live-site.com for your live site sub-domain, then hit Enter.
- Watch this video tutorial on how to install Opencart
Config theme
Goto Admin > System > settings
select store > edit
select Store tabs
Config image
Install Module
1. Please unzip package Module and upload the folder admin,catalog ... from the Module package to the root directory of your Opencart software using an FTP client.
2. Go to Admin > Extensions > Modules . Find and install it or uninstall
Module Using in pav_metro theme
Pav Content Slider
Pav Custom Module
Pav Gallery Popup Module
Pav MegaMenu
Pav Product Carousel
Pav My Twitter
layout
Theme control Panel
PAV Theme Control Pannel
goto admin > Extensions > Modules
edit Theme Control Pannel
Tab Modules- Layouts
Tab Genaral
Tab Font
Content slider module
Pav Content Slider
preview
goto admin > Extensions > Modules
Edit Pav Content Slider
Configuration like images
megamenu
Pav MegaMenu
preview
goto admin > Extensions > Modules
install and Edit Pav MegaMenu
Configuration like images
Create submenu type HTML
Source
<div class="pav-menu-video"><iframe allowfullscreen="" frameborder="0" height="157" src="http://www.youtube.com/embed/NBuLeA7nNFk" width="279"></iframe> <h3>Lorem ipsum dolor sit</h3> <p>Dorem ipsum dolor sit amet consectetur adipiscing elit congue sit amet erat roin tincidunt vehicula lorem in adipiscing urna iaculis vel.</p> </div>
Product Carousel module
Pav Product Carousel
preview - latest product
goto admin > Extensions > Modules
install and edit Pav Product Carousel
Configuration like images
preview - Most viewed product
goto admin > Extensions > Modules
install and edit Pav Product Carousel
Configuration like images
preview - special product
goto admin > Extensions > Modules
install and edit Pav Product Carousel
Configuration like images
Pav My Twitter
Install Pav My Twitter
preview Pav My Twitter Module
edit Pav My Twitter Module
goto admin > Extensions > Modules
install and edit Pav My Twitter
Configuration like images
Category Module
preview
install and edit category Module
Configuration like images :
Banner Module
preview
install and edit Banner Module
Configuration like images :
Custom Module
install and edit Pav Custom Module
Add module
1. slideshow
goto admin > Extensions > Modules
install and edit Pav Custom Module
Configuration like images
<div class="pav-block-welcome"> <p class="pav-arrow-left hidden-phone hidden-tablet"> </p> <p class="pav-arrow-right hidden-phone hidden-tablet"> </p> <div class="row-fluid"> <div class="span7"> <div class="pav-block-left"> <h2>Welcome to Metro Store</h2> <p>Morbi felis ligula scelerisque id ullamcorper fermentum adipiscing donec ac molestie metus.</p> </div> </div> <div class="span5"> <div class="pav-block-right"><a class="btn" href="#" title="By theme now">By Theme now</a></div> </div> </div> </div>
2. promotion
preview
Configuration like images
Source
<div class="pav-block-shipping clearfix"><img alt="Free Shipping" class="pull-left" src="catalog/view/theme/pav_metro/image/free-shipping.png" /> <h3 class="offset3">Free Shipping</h3> <p class="offset3"><span>On orders over $ 99</span></p> </div>
Configuration like images
source
<div class="pav-block-sale clearfix"> <div class="pav-block-content pull-left"> <h3>Sale</h3> <p><span>Up to 70% Off</span></p> </div> <img alt="Sale" class="pull-right" src="catalog/view/theme/pav_metro/image/sale.jpg" /></div>
source
<div class="pav-block-spring clearfix"> <div class="pav-block-content pull-left"> <h3>Spring</h3> <p><span>Shoes Sale</span></p> </div> <img alt="Spring" class="pull-right" src="catalog/view/theme/pav_metro/image/spring.jpg" /></div>
3.Footer Top
preview
Configuration like images
source
<div class="row-fluid"> <div class="span4"> <div class="pav-block-spring-collection clearfix"><img alt="Spring Collection" class="pull-left" src="catalog/view/theme/pav_metro/image/spring-collection.png" /> <h3 class="offset3">New amazing</h3> <p class="offset3"><span>Spring collection</span></p> </div> </div> <div class="span4"> <div class="pav-block-extra clearfix"><img alt="All Products" class="pull-left" src="catalog/view/theme/pav_metro/image/extra.png" /> <p class="offset3">Extrasale 40%<span>for</span></p> <h3 class="offset3">all products</h3> </div> </div> <div class="span4"> <div class="pav-block-new-collection clearfix"><img alt="New Collection" class="pull-left" src="catalog/view/theme/pav_metro/image/new-collection.png" /> <h3 class="offset3">New collection</h3> <p class="offset3"><span>Inspired By nature</span></p> </div> </div> </div>
4. Content Bottom:
preview
Configuration like images
source
<div class="pav-content-bottom"> <div class="row-fluid"> <div class="span3"><img alt="" src="catalog/view/theme/pav_metro/image/static3.png" /></div> <div class="span7"> <h3>100 kindle fire hd <span>$3.99</span> or less</h3> <p>Nunc gavida nisl utrices loborti molis temp tempor quam congue turpis sed psum blandit donec vitae laoreet vestibulum lobortis mattis sapien bero cursus congue urna mauris.</p> </div> <div class="span2"><a class="circlehover with-symbol" data-align="right" data-position="top-left" data-size="" href="#"><span class="text">Find out more</span> </a></div> </div> </div>
5: Footer Center
preview
Configuration like images
source
<div class="pav-social">
<ul>
<li><a class="facebook" href="#" title="Facebook">Facebook</a> <a class="twitte" href="#" title="">Twitte</a></li>
<li><a class="dribbble" href="#" title="Dribbble">Dribbble</a> <a class="vimeo" href="#" title="">Vimeo</a></li>
<li><a class="google" href="#" title="Google plus">Google plus</a> <a class="email" href="#" title="">Email</a></li>
<li><a class="rss" href="#" title="Rss">Rss</a></li>
</ul>
</div>
Configuration like images
Source
<div class="pav-about">
<ul>
<li><a href="#">Dolor sit amet</a></li>
<li><a href="#">Nam cursus nunc</a></li>
<li><a href="#">Fermentum</a></li>
<li><a href="#">Consequat</a></li>
<li><a href="#">Morbi mauris</a></li>
<li><a href="#">Praesent felis</a></li>
<li><a href="#">Molestie nec nibh</a></li>
</ul>
</div>
Configuration like images
Source
<div class="pav-newsletter">
<h4>Sign Up for Our Newsletter:</h4><p>Get the word out Share this page with your friends and family. Enter your email address...</p><div class="subscribe row-fluid"><input name="subscribe" type="text" value="" /> <input type="button" value="" /></div><div class="payment-method"><a href="#" title=""><img alt="paypal" src="catalog/view/theme/pav_metro/image/paypal.png" /></a> <a href="#" title=""><img alt="visa" src="catalog/view/theme/pav_metro/image/visa.png" /></a> <a href="#" title=""><img alt="master" src="catalog/view/theme/pav_metro/image/master.png" /></a> <a href="#" title=""><img alt="amex" src="catalog/view/theme/pav_metro/image/amex.png" /></a></div>
</div>
Pav Gallery Popup Module
preview
goto admin > Extensions > Modules
install and edit Pav Gallery Popup Module
Configuration like images
