Theme Features

This theme is built on the Warp framework, a well-engineered theme framework for WordPress and Joomla, and utilizes all of its latest features. The user interface is powered by UIkit, a lightweight and modular front-end framework, which provides the theme's styling. The theme also comes with a wide range of different layouts and widget variations.

This theme is available for JoomlaJoomla and WordpressWordPress including the same features on each system.

6 different styles

We provide lovingly crafted style variations to give you a glimpse of what is possible with this theme. The built-in theme customizer allows you to modify colors, fonts, sizes and much more without any CSS knowledge. Just choose your colors with the color picker and adjust the theme with only a few clicks. Click on one of the images to see the style.

Default
Beach
Cloud
Lilac
Rose
Yellow

Block Appearance

This theme provides a number of settings for each module position. You can apply different background colors and vertical paddings and remove horizontal padding. Each block can have a default, large or full width layout and can be aligned to the left or right.

Block Apperance
Theme Features Block Appearance 02

Default

Theme Features Block Appearance 05

Large

Theme Features Block Appearance 03

Left

Theme Features Block Appearance 04

Right

Theme Features Block Appearance 05

Full


Custom Widgets

Edge provides three custom Widgetkit 2 plugins to match the theme – the Slideshow Panel, Slider and Slideshow.

Slideshow Panel

Slideshow Panel

The Slideshow Panel Edge applies an offset to the content, so that the panel overlaps the image. Media can be aligned to the left, right or top of the content. The conjoint slidenav can be placed at the top or bottom of the image.
Slider

Slider

The Slider Edge widget links the item’s title inside the overlay. Additionally you can select a custom button that appears centered inside the overlay.
Slideshow

Slideshow

This Slideshow places the content inside a custom panel on top of the image instead of the overlay. The panel can be aligned to the left or right.

Navbar Layouts

Edge theme features four different layouts for the main navigation. The menu can be centered and aligned to the left or right. Additionally, it can be centered with the logo above the menu. You can apply a sticky navbar on desktops and on mobile devices, so it will remain fixed at the top of the window when scrolling. Another option extends the dropdown to the width of the entire browser window.

Navbar Layouts
Theme Features Navbar Layouts 02

Centered

Theme Features Navbar Layouts 03

Left

Theme Features Navbar Layouts 04

Right

Theme Features Navbar Layouts 05

Logo on top


Article Layout

Edge theme comes with an optional blog layout. You can now decide whether your image will be positioned to the left or to the right of your content. The title and meta data of the article are enhanced with a border that slightly overlaps the image.

Article Layout

Text Highlight

To set apart headings or other text elements, add the .tm-text-highlight class to a <span> element. Add the .tm-text-highlight-contrast class, so it will work on dark backgrounds.

<h1><span class="tm-text-highlight">...</span></h1>

Since 1978


Image Border

As a little visual extra, Edge features the .tm-image-border class. Adding it to a container element with an image inside, will apply an offset border that matches the panel box styling.

<div class="tm-image-border"><img src=""/></div>
Demo

Title Border

You can apply the same border style from the blog layout to any other heading. Just add the .tm-title-border class to a container element. We also provide responsive alignment classes, e.g. .tm-title-border-small-left to overlap image and heading inside a grid until they stack.

Title Border
  
    <div class="tm-title-border tm-title-border-medium-left">
        <h1>...</h1>
    </div>
  
ClassDescription
.tm-title-border Add this class to a <div> element to create the border around your title.
.tm-title-border-left Add this class to create an offset to the right.
.tm-title-border-right Add this class to create an offset to the left.
.tm-title-border-small-left The offset to the right only affects device widths of 480px and higher.
.tm-title-border-small-right The offset to the left only affects device widths of 480px and higher.
.tm-title-border-medium-left The offset to the right only affects device widths of 768px and higher.
.tm-title-border-medium-right The offset to the left only affects device widths of 768px and higher.
.tm-title-border-large-left The offset to the right only affects device widths of 960px and higher.
.tm-title-border-large-right The offset to the left only affects device widths of 960px and higher.

More Custom Classes

ClassDescription
.tm-graphic Add this class in the General section of your widget to display a rectangular on top of the image as a graphic element.
.tm-text-uppercase This class will transform your text to capital letters.
.tm-margin-xlarge,.tm-margin-xlarge-top,
.tm-margin-xlarge-bottom
Add 80px top and/or bottom margin to elements.
UIkit Framework

UIkit Framework

A lightweight and modular front-end framework for developing fast and powerful web interfaces.

Visit Website

Warp Framework

Warp Framework

A fast and slick theme framework which is built on the latest web techniques.

Visit Website