Page tree
Skip to end of metadata
Go to start of metadata


Template is based on the Warp 7 framework which is fast and powerful template engine.

Template Configuration

Template settings can be accessed under Joomla backend template configuration:

Extensions -> Templates -> cd_product


Most of the settings has not been changed and set to default.


BOTTOM-C position is set to BLANK


Sidebars columns are set to default:


Position Appearance


Modules styles has been set accordingly:

There are several styles available for each module. The basic ones are Box Primary and Box Secondary. For each module header additionally an icon can be set.

Top Header

Place a custom HTML module under TOOLBAR-L position:

Have any Questions? Call us: <span style="color: #fff"><i class="uk-icon-phone"></i> 0 800 555 5555</span>

Place a custom HTML module under TOOLBAR-R position:

Login | Register

Logo must be placed in the LOGO position for the menu to be seen in the Menu position.


Logo custom HTML should be placed without any extra tags like <p> otherwise it may appear as two lines. Editor should not be used to place it, just plain HTML e.g.

<img src="images/logo.jpg" alt="logo" />

When using Editor additional <p></p> tags are being added causing additional height. 


Logo Small 

Logo small can be placed on the LOGO-SMALL position to show on the mobile menu  


Place Menu Module under MENU position

Login, Cart, Add New Buttons


Place Login module under LOGIN position.


Add custom HTML code under CART position:

<div data-uk-dropdown class="uk-button-dropdown" aria-haspopup="true" aria-expanded="false" role="button">
    <a href="#" class="uk-button uk-button-small"><i class="uk-icon-shopping-cart uk-text-large"></i> <strong>0</strong> Items</a>
    <div class="uk-dropdown uk-dropdown-bottom" style="top: 30px; left: 0px;">
        <p>Cart is empty</p>

Add New

Add custom HTML code under ADMIN position:

   <a href="#" class="uk-button  uk-button-small"><i class="uk-icon-plus uk-text-large" style="color: #1c94f3;"></i></a>


Responsive Menu

In order to make the menu responsive, create a copy of the MAIN MENU and place it in OFF CANVAS position.

Maps Wide

In order to use this view you need to have an Ajax Map Search Module paid addon

Create an empty page with no content e.g. empty article and assign an Ajax Map Search Module for that menu, set MAP WIDE layout and MAP HEIGHT to 100vh:

Additionally template must be set in Full Width Content mode. It can be done by creating another profile and enable the Full Width Content switch and Hide System Output:

This new layout must be assigned for the created menu at the bottom of the page:

When edits are finished click SAVE on top of the page.

Create a custom HTML module, and place it under FOOTER position:

<div class="uk-float-left">
Copyright 2015 - <strong>PRODUCT</strong> - Best Deals Around The Internet By: <a href="" title="Joomla Cart">COMDEV</a>
<div class="uk-float-right">
<a href="#" class="uk-icon-button uk-icon-github"></a>
<a href="#" class="uk-icon-button uk-icon-twitter"></a>
<a href="#" class="uk-icon-button uk-icon-dribbble"></a>
<a href="#" class="uk-icon-button uk-icon-html5"></a>



  • No labels