{* 
* @Module Name: Leo Elements
* @Website: leotheme.com - prestashop template provider
* @author Leotheme <leotheme@gmail.com>
* @copyright Leotheme
* @description: LeoElements is module help you can build content for your shop
*}
<div class="panel panel-default">
    <div class="panel-heading">
        <h4 class="panel-title">
            <a data-toggle="collapse" href="#collapse1">
                <span class="glyphicon glyphicon-collapse-down"> </span><i class="icon icon-tags"></i> {l s='Guide' mod='leoelements'}</a>
        </h4>
    </div>
    <div id="collapse1" class="panel-collapse collapse ">
        <div class="panel-body">
        	<h4>{l s='1. Create Profile' mod='leoelements'} :</h4>
	<p>{l s='First you have to create a profile. The profile can be used as a homepage or a landing page. you can make a new url for your profile' mod='leoelements'}</p>
	<p>{l s='When you build a new profile, we will automatically create a Position (including header, content, footer) for it' mod='leoelements'}</p>
	<p>{l s='You can create sperator profiles for desktop, table and mobile' mod='leoelements'}</p>
	<h4>{l s='2. Create Positions' mod='leoelements'} :</h4>
	<p>{l s='Position is a part of a profile. Each profile will have a header, content home page, and footer.' mod='leoelements'}</p>
	<p>{l s='A Position can be used for one or more profiles.' mod='leoelements'}</p>
	<h4>{l s='3. Build content for each hook' mod='leoelements'} :</h4>
	<p>{l s='A position can have one or more hooks.' mod='leoelements'}</p>
	<p>{l s='For example: Header will have hooks such as:' mod='leoelements'} displayBanner,displayNav1,displayNav2,displayTop,displayNavFullWidth.</p>
	<p>{l s='Please install module leoelements to build content for each hook.' mod='leoelements'}</p>
        </div>

    </div>
</div>