Template Creating Manual
Creating Zimplit template
Zimplit uses normal HTML pages as templates. To use your own template, upload your HTML page to the root catalog (same catalog where is zimplit.php) of your server. The HTML must be named index.html, otherwise Zimplit redirects you to Zimplit template page. Zimplit will add all necessary tags to your HTML and makes it editable through Zimplit.
Add editable area
To make area editable in your template, add class “ZEditableArea”. NB! If your html template don´t contain any “ZEditableArea” class, all template will be editable. Example:
<html>
<body>
<div> not editable area</div>
<div class="ZEditableArea">editable area</div>
</body>
</html>
In example div with “ZEditableArea” class is editable in Zimplit. To use “Change template” function in Zimplit, we give to every area extra class name:
class="ZEditableArea ZContentType_mainContent" - main content area class="ZEditableArea ZContentType_sideContent" - sidebar content area class="ZEditableArea ZContentType_leadContent" - lead content area class="ZEditableArea ZContentType_logo" - logo content area class="ZEditableArea ZContentType_footer" - footer content area
Add menu
To add menu items to your page, use menu class:
class="mainMenu" - main menu class="mainMenuLi" - main menu with "list" tag
For example, if you want to use HTML template with existing menu, with code:
<div id="menu"> <ul> <li class="current_page_item"><a href="#">Homepage</a></li> <li><a href="#">Blogs</a></li> <li><a href="#">Photos</a></li> <li><a href="#">About</a></li> <li class="last"><a href="#">Contact</a></li> </ul> </div>
Delete all “li” items and add menu class into “ul”
<div id="menu"> <ul class="mainMenu"> </ul> </div>
Zimplit will generate menu items automatically.
To add static link or make static menu, use class=“ZMaskedLink” in link tags.
<a class="ZMaskedLink" href="http://www.zimplit.com">Zimplit</a>
This link is clickable in Zimplit admin area.
