Posisoft inc
PT
SP
EN
FR
CONTACT
PROMOTION
INFO
HOME
SENSLIGHT
UK
FR
HOME » LOREM  » FAQ
Prologue
FAQ
You just downloaded the Sesnlight template. You are about to discover a turnkey template, but also brand new elements and a specific code we need to review together.  The forum will obviously remain the main troubleshooting source. Should the template be paid or free, some parts will be reviewed winthin this FAQ.  

Home page
As you can see in the Home page preview (index), we included a slider (text + pictures).
To achieve this outcome, and because developpment elements were missing (will be processed in the next few weeks), we had to resort to a certain number of solutions: - a new "responsive elements panel" element (ID WE1a8887b1d4 responsive elements panel)
- a visual code block containing a specific code (ID WE78f76b1c5b slider code block)
- a source code block containing the full process necessary for the slider effects (Javascript BXSLIDER_JS block code)
-elements panels specific to each part of the slider located in the page footer (slide down the page to modify it)

Responsive elements panel
The panel includes brand new options that will be detailed. You most importantly have to understand its use.  Height and width of the element will cover the full browser page, whatever the size of the responsive elements panel. We included different options with a large panel of cases:
How to behave and settings
Minimal distance:  
Minimal space between the lower part of the elements panel and the internal content. It is the internal margin in the lower part of the Container style zone (Styles -> Personalization). Can include units in pixels, em, vh etc. 
 
Minimal height distance:  
Minimal space between the higher part of the responsive elements panel and the internal content. It is the internal margin in the lower part of the Container style zone (Styles -> Personalization). Can include units in pixels, em, vh etc. 
 
Include footer height: 
You need to tick this box for the last panel of the page. Reduce the footer height as soon as possible (lower content section) so the footer can fit in the screen with the panel. 
 
Inclure la hauteur du Header: 
You need to tick this box for the last panel of the page. Reduce the footer height as soon as possible (higher section, if activated in the page sections - Reponsive icon) so the Header can fit in the screen with the panel.
 
Include elements heights: 
You can add a list of IDs separated by a comma which are elements that have to be displayed in the Responsive elements panel page (screen). The panel height will be reduced accordingly. That is what we did with our new WEMENU element (an element panel). It takes into account the height of these elements and is perfectly included in it. The specified ID will match with the ID of the template menu.
Once the element imported in your page, if you whish a centered element, you will have to include inside an Elements panel (standard element in the Elements list on the right). It will automatically include an  oerp-inner-content specific class.
DO NOT DELETE IT, otherwise you will lose the horizontal and vertical adjustment. 
Once in the element panel, you will be able to activate the relative (we strongly advise it for a responsive developpment of a website) or absolute mode.

We included in the reponsive elements panel, an elements panel with a visual block code.


The visual block code (bxslider)

The code is as below:

<ul id='bxslider' class="bxslider"> 
<li></li> 
<li></li> 
<li></li> 
</ul>



It allows to use the BxSlider plugin and will trigger the slider effect in a certain number of elements, that is in elements panels in the page footer (down the page).
The number of  <li></li> also shows how many panels are to be managed by BxSlider. It is thus set by default on 3 (3 elements panels are thus taking advantage of the BxSlider effect). You are free to add or remove them.
According to your choice, you also will have to change these informations contained in the BXSLIDER_JS Source code block.

The source code block