...
There are several styles available for each module. The basic ones are Box and Box HeaderPrimary. For each module header additionally an icon Icon can be set.
Responsive Menu
In order to make the menu responsive, create a copy of the main menu and place it in off canvas OFF-CANVAS position.
Slideshow
Special template position has been created to display full width image/slideshow: Top-Slide. To place any content on the Top-Slide addionally 2 positions can be used: Top-Slide-Over-A and Top-Slide-Over-B.
For static background image use:
| Code Block |
|---|
<div style="background-image: url("images/Slider/slider.jpg"); height: 280px;" class="tm-image uk-text-center"></div> |
Call Customer Service Box
Custom HTML module placed in Toolbar-L position with content:
...
Toolbars (top page)
Contact us
Custom HTML module placed under HEADERBAR position
| Code Block |
|---|
<div style="margin-right: 50px;" class="uk-margin-top">
Contact Us:
<span class="uk-badge uk-badge-large uk-badge-success"><i class="fa fa-phone"></i> 44 600 530 777</span>
</div> |
Login
Custom HTML module placed under HEADERBAR position
| Code Block |
|---|
<div class="uk-margin-top" style="text-transform: uppercase">
<a href="#"><i class="uk-icon-user"></i> Login</a> | <a href="#"><i class="uk-icon-edit"></i> Register</a>
</div> |
Search
JomOffers search module placed in TOP-A position. Layout set to Horizontal.
Add Offer
Custom HTML module placed under TOP-A position:
| Code Block |
|---|
<div style="width: 100%;">
<a href="http://jomoffers.comdev.eu/front-admin" class="button-add-offer" style="float: right"><i class="uk-icon-plus"></i> Add Offer</a>
</div> |
JomOffers Latest
JomOffers Latest module placed under TOP-B posiiton
Get Connected
Article with content:
| Code Block |
|---|
<div class="uk-text-center">
<h1>Get Connected</h2>
<h2>Everyone who wants to get connected with us regularly, do not hesitate, we are waiting for you!</h2>
<ul class="uk-grid uk-margin-top">
<li class="uk-width-medium-1-5"><a class="uk-social-link" href="#" target="_blank"><span class="uk-social-icon"><i class="uk-icon-twitter uk-icon-large"></i></span><h3 class="ut-social-title">Twitter</h3><span class="ut-social-info"> Follow us on Twitter </span></a></li>
<li class="uk-width-medium-1-5 "><a class="uk-social-link" href="#" target="_blank"><span class="uk-social-icon"><i class="uk-icon-facebook uk-icon-large"></i></span><h3 class="ut-social-title">Facebook</h3><span class="ut-social-info"> Join the Conversation </span></a></li>
<li class="uk-width-medium-1-5 "><a class="uk-social-link" href="#" target="_blank"><span class="uk-social-icon"><i class="uk-icon-google-plus uk-icon-large"></i></span><h3 class="ut-social-title">Google</h3><span class="ut-social-info"> Join Our Circle </span></a></li>
<li class="uk-width-medium-1-5 "><a class="uk-social-link" href="#" target="_blank"><span class="uk-social-icon"><i class="uk-icon-youtube uk-icon-large"></i></span><h3 class="ut-social-title">Youtube</h3><span class="ut-social-info"> View Exclusive Videos </span></a></li>
<li class="uk-width-medium-1-5 "><a class="uk-social-link" href="#" target="_blank"><span class="uk-social-icon"><i class="uk-icon-instagram uk-icon-large"></i></span><h3 class="ut-social-title">Instagram</h3><span class="ut-social-info"> Latest Images </span></a></li>
</ul>
</div> |