1. About Us
  2. About Leo Food Template
  3. Installing Template and Extensions
  4. Module Configuration
  5. Thirtparty Extension Configuration
  6. Mega Menu
  7. Recommendation

Leo Gift Template - Userguide

Leo Gift Template - Userguide

First of all, we would like the thank you for using our work.

Leotheme - a website where you can find the best Joomla! Template, Prestashop theme. We are proud of our high rated themes. As the leader in the RESPONSIVE prestashop theme designer, as well as Joomla!, we continuously improve our products and make some contribution to the web designer world.

Leotheme is also famous for custom work, if you have trouble or help with your website, coding, .... you can find us on Leotheme.com then we will support you or give you suggestions.

Things to Know Leo Gift Template

Leo Gift Template - Userguide


Things to Know Leo Gift Template
  1. You - our customers please read the Overview article of the template. This article will give you a quick and complete overview of the template that including template detail information (demo link, version, support link ...), template features and extensions come with the template.
  2. Making a New Site ? - If you are planning to make a new site, we suggest you to use our Quickstart package. The Quickstart packgae contains sample data so once you install the quickstart successfully, you will have a website like our demo. The next step, just replate the demo content with yours. Install Quickstart Package.
  3. 3rd Party Extensions: This template has custom styles for K2 Component. You will need to download K2 from its site and install referring to the userguide below.
  4. Installing on your live site ? - If you are planning to use this template on your already live site. Then you should follow How to make your site look like demo site guide first to know about the steps involved. Then you can follow up the userguide below.

Download Template

From the homepage of http://leotheme.com, navigate to the Download section the select to download type ( single licensed or membership).

Download page

Know your Module Positions :
  1. View Module Position Image (used positions only).
  2. Use Module Position Overlay in Template(used & empty module positions).

Main aspects in the userguide:
  1. Installing Template and Extensions in your Joomla
  2. Installing included extensions and Custom HTML Modules.
  3. Mega Menu configs
  4. Thirt Party Extensions Configuration

Installing Template and Extensions in your Joomla

1. Installing Template and Extensions in your Joomla

1.1 Installing Template
  1. Download template from the Download page.
  2. Install the Template: after downloading the template to your PC, install it on your Joomla! 2.5 system. THIS GUIDE will show you step by step instruction with screenshot to install Joomla! 2.5 template.
Note: It Does not look like Demo Site?

On comparison with the demo site. You will see that it does not look like the demo site. So, what’s Missing?
This guide will show you more detail about this and also guide you How to Make the Template Like the Demo Site

1.2 Installing Extensions
  1. Free Extensions : (aka complimentary / included extensions). We use many extensions in our demo site to provide greater flexibility and features. These are provided for free to our members.
  2. Custom HTML Module : To match the design of the template, we also style (CSS) for Custom HTML modules using different div classes. You will need to check the HTML codes and make sure to use the recommended HTML markup to get correct display. We provide the HTML code in this userguide.
Installing and Configuring Included Extensions :
  1. How to install plugin for joomla 2.5
  2. How to install module for joomla 2.5
List of modules / plugins used in Leo Watches Template Demo :
  1. Leo VM Scroller Module
  2. Lof K2 Scroller Module
  3. Lof SlideShows Module
  4. Lof UserPanel Module
  5. Tabs GK5 Module
  6. Optimized FB Like Box
  7. Modules go with K2 Component
  8. Module go with Virtuemart Component

Installing included extensions and Custom HTML Modules.

2. Installing included extensions and Custom HTML Modules.

2.1 Installing included extensions

1. Leo VM Scroller Module

Code: 
Module Position:showcase-top 
Module Suffix: NOT USED

Backend Settings
Front-end Appearance


2. Lof K2 Scroller Module

Code: 
Module Position: showcase-bottom 
Module Suffix: NOT USED

Backend Settings
Front-end Appearance


3. Lof SlideShows Module

3.1 Showcase

Code: 
Module Position: content-top1
Module Suffix: NOT USED

Backend Settings
Front-end Appearance


3.2 SlideShows

Code: 
Module Position: top1 
Module Suffix: _slideshow

Backend Settings
Front-end Appearance


4. Lof UserPanel Module

Code: 
Module Position: topmenu
Module Suffix: _login

5. Tabs GK5 Module

Code: 
Module Position: content-top2 
Module Suffix: _tabs

6. Optimized FB Like Box

Code: 
Module Position: user13  
Module Suffix: NOT USED



7. VirtueMart Products Module

Code: 
Module Position: tab2
Module Suffix: NOT USED

8. VirtueMart Products Module

8.1 Featured products

Code: 
Module Position: tab2
Module Suffix: NOT USED

8.2 Most popular

Code: 
Module Position: tab2
Module Suffix: NOT USED

8.3 Best Seller

Code: 
Module Position: tab1
Module Suffix: NOT USED

9. Virtuemart Currency Selector Module

Code: 
Module Position: toppos-right 
Module Suffix: _currencies

10. VirtueMart Shopping Cart Module

10.1 Shopping Cart in position: cart-top

Code: 
Module Position: cart-top
Module Suffix: _cart-top


10.2 Shopping Cart in position: right

Code: 
Module Position: right
Module Suffix: _menu color_pink



11. K2 Comment Module

Code: 
Module Position: right
Module Suffix: NOT USED


12. K2 Content Module

Code: 
Module Position: right
Module Suffix:  color_green

13. K2 Tools Module

13.1 Category K2

Code: 
Module Position: right
Module Suffix:  color_green


13.2. Category K2

Code: 
Module Position: right
Module Suffix:  color_green

2.2 Custom HTML Modules

1. Advertising

Code: 
Module Position: right
Module Suffix: _advertising

HTML Code: 
<p><img src="images/stories/img/advertising.png" border="0" alt="" /></p>
  • Front-end Appearance


2. Banner 1

Code: 
Module Position: top2
Module Suffix: NOT USED

HTML Code: 
<p><img src="images/stories/img/banner1.png" border="0" alt="" /></p>
  • Front-end Appearance


3. Banner 2

Code: 
Module Position: top2
Module Suffix: NOT USED

HTML Code: 
<p><img src="images/stories/img/banner.png" border="0" alt="" /></p>
  • Front-end Appearance



4. Follow Us On

Code: 
Module Position: toppos-right
Module Suffix: _follow

HMTL Code: 
<div style="display: inline-block;"><a class="facebook" href="#">facebook</a> <a class="twitter" 
href="#">twitter</a> <a class="linkedin" href="#">Linkedin</a> <a class="google" 
href="#">Google</a></div>
  • Front-end Appearance



5. Image1

Code: 
Module Position: user1
Module Suffix: NOT USED

HTML Code: 
<p><img src="images/stories/img/image1.jpg" border="0" alt="" /></p>
  • Front-end Appearance


6. Image2

Code: 
Module Position: user2
Module Suffix: NOT USED

HTML Code: 
<p><img src="images/stories/img/image2.jpg" border="0" alt="" /></p>
  • Front-end Appearance



7. Image3

Code: 
Module Position: user3
Module Suffix: NOT USED

HTML Code: 
<p><img src="images/stories/img/image3.jpg" border="0" alt="" /></p>
  • Front-end Appearance

8. Feature Products

Code: 
Module Position: user9
Module Suffix: _truck

HTML Code: 
<p>Donec it amet</p>
  • Front-end Appearance

9. Feature Products 1

Code: 
Module Position: user10
Module Suffix: _light

HTML Code: 
<p>Donec it amet</p>
  • Front-end Appearance


10. Feature Products 2

Code: 
Module Position: user11
Module Suffix:_gift

HTML Code: 
<p>Donec it amet</p>
  • Front-end Appearance

11. Feature Products 3

Code: 
Module Position: user12
Module Suffix:_lock

HTML Code: 
<p>Donec it amet</p>
  • Front-end Appearance

12. Donec vel

There are 3 same modules, they are assigned to positon: user14, user15, user16. Here we just give configuration of one module.

Code: 
Module Position: user14
Module Suffix: _listmenu

HTML Code: 
<ul>
<li><a href="#">Fusce hen</a></li>
<li><a href="#">Proin imper</a></li>
<li><a href="#">Sed non sem </a></li>
<li><a href="#">Nunc vel</a></li>
<li><a href="#">Eleifend</a></li>
<li><a href="#">Dignissim aliquet</a></li>
<li><a href="#">consectetur </a></li>
</ul>
  • Front-end Appearance


13. Newsletter

Code: 
Module Position: user17
Module Suffix: _newsletter

HTML Code: 
<p>Send your email a newsletter.</p>
<div><input class="inputbox" type="text" name="email" value="" size="31" alt="username" /><input class="button" 
type="submit" name="Submit" value="Go" /></div>
  • Front-end Appearance


14. Contact Us

Code: 
Module Position: user17
Module Suffix: _contact

HTML Code: 
<p>Send your email a newsletter.</p>
<div><input class="inputbox" type="text" name="email" value="" size="31" alt="username" /><input class="button" type="submit" name="Submit" value="Go" /></div>
  • Front-end Appearance

15. Free Shopping

Code: 
Module Position: user5
Module Suffix: _free

HTML Code: 
<div class="free-left"><img src="images/stories/img/img-free2.png" border="0" alt="" /> </div>
<div class="free-left"> 
<p class="text1">Free</p>
<p class="text2">Shopping</p>
<p class="text3">Donec accumsan hendrerit orci id congue it amet</p>
<p class="&quot;text4">Lorem ipsum dolor sit amet, consectetur adipiscing elit nulla blandit nulla felis semper sit amet.
Facilisis tristique ante lectus eu sem. Integer ipsum leo.</p>
</div>
<div class="free-right"> <img src="images/stories/img/img-free1.png" border="0" alt="" /></div>
  • Front-end Appearance

Thirtparty Extension Configuration

Thirdparty Extension Configuration

I. K2 Component Configuration

1. Install K2 component

  • Download K2 component form the website: getk2.org/
  • If you are new to K2, use the GUIDE to install and configure the component in your Joomla! system.
2. Configure K2 component

From back-end of your Joomla! system, navigate to the Components >> K2

2.1 Global Configuration

After access to backend of K2 component, click on the Option button on the top right corner to go to the global settings of the component.

Backend Settings
2.2 Category Configuration

All categories in K2 use default template.

To build your website like our demo, navigate to Administrator >> Component >> K2 >> Categories


K2 Category List Page


K2 Item List Page


Back-end Setting for Categories

Leo Gift category

Showcase category
Feugiat dolor category
Note: other categories have same setting with category: Feugiat dolor

II. VirtueMart component

1. Installing

If you are new to this Joomla! component, please read this guide.

1.1 Reference
2. Configuring VirtueMart component

After installing the component successfully, you need to configure the component as you expect for your shop. If you have trouble, back to the Reference section where you can find the link to the support left and get support or find the answer for your trouble because you may have trouble that many others also have.


2.1 Global Configuration[/URL]
2.2 Category Configuration


Front-end Appearance


Item List Page in front


Items Detail Page in front

Mega Menu

3. Mega Menu

All of our templates support multiple Menu styles. In the user-guide, we will show how to config Mega Menu ( a missing feature in Joomla! )

Front-end Appearance


Backend Settings

1. Main Menu Items


2. Detail Settings for Main Menu Items

Recommendation

Recommendation

The guide above supports you to configure for template like our Demo site. The references are also included in the guide, so please read them if you have trouble when configuring.

To get support, you can raise your issues in our Forum or send us email through the Contact Form or send directly to the following email: leotheme@gmail.com . We will try to answer and solve problems for you as soon as possible (within 2 days)