Istituto Tecnico Statale Economico e Tecnologico "Emanuela Loi" - Via Emanuela Loi n. 6 - 00048 Nettuno - Tel. 06121126540

 LogoComunitaEuropeaStemma RepubblicaItalianaLogoMinisteroDellIstruzioneDellUniversitaDellaRicercaLogoCittaDiNettuno
I.T.S.S.E.T.
EMANUELA LOI

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 theme 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

Default

Blueberry

Blueberry

Material

Material

Organic

Organic

Galaxy

Galaxy

Salmon

Salmon

Animations & Backgrounds

Each style includes a unique background style or animation.

Blueberry Background
Material Background
Organic Background
Galaxy Background
Salmon Background

Theme Tags

This Theme features the option to assign different colors to tags, highlighting the tagged content.

Warp administration

Go to the "Tags" section in the "Settings" panel and enter your tag in the field. You can choose from ten predefined colors.

For more information on how to use tags, take a look at the WordPress or Joomla documentation.

Warp Settings

Navbar

Tagged menu items of the main navigation automatically adapt the appropriate color and display a matching border below the navbar.

Navigation color 1 Navigation color 2 Navigation color 3

Use Tags

A number of different UI elements can be styled using tags in this theme. For example, you can add one of the .tm-tag-* classes to a container, like a panel, to modify badges. Or you can apply a different border color to each item of a tabbed navigation.

      
      	  <!-- Badge -->
          <div class="tm-tag-1">
              <div class="uk-badge">...</div>
          </div>
          
          <!-- Tabs -->
          <ul class="uk-tab" data-uk-tab>
              <li><a href="/"></a></li>
              <li class="tm-tag-2"><a href="/"></a></li>
          </ul>
      
	

Highlight text

Additionally, you can highlight headings or text elements in your tag color. Just add one of the .tm-tag-color-* classes.

  			
            <h1 class="tm-tag-color-1">...</h1>
  			
		

Custom Widgets

Monday theme comes with the content creator Widgetkit 2. In addition to all default widgets, it features 5 custom renderers – Tabs, Slideshow Panel, Slideshow, Grid, Twitter and List.

Tabs

Tabs

Monday features a custom Switcher widget. The tabbed navigation displays a border whose color will automatically adapt to the item's tag.

Slideshow panel

Slideshow panel

This Slideshow Panel provides the option to display each item's tag above the content.

The slidenav can be positioned at the top right, top left, bottom left and bottom right of the Slideshow Panel.

Slideshow

Slideshow

This Slideshow widget comes with a custom thumbnail navigation. Tags will be displayed as a colored border on top of every thumbnail, while the content appears on hover inside a panel on top of the item's image.

Grid

Grid

The custom Grid widget places images in a teaser layout above or in alternating order above and below the content.

Tags will be displayed as a colored border on top of the content.

Twitter

Twitter

This Twitter widget publishes your latest three tweets inside a Slideshow.

List

List

The List widget allows you to add tags to list items. This is useful when publishing an overview of latest posts in the Sidebar.

Stampa Email

Block Footer

Block Footer

In this theme we have created a special footer position that is separated from the boxed layout. You can apply different background colors and vertical padding to this block in the Layouts section of the Warp administration.

Panel Style

Panel Style

This theme comes with a number of additional panel styles. You can apply a different header, which can be combined with the different boxes and add some extra padding to the panel.

Grid Options

Grid Option

Monday theme allows you to apply a different gutter to each widget/module position or to remove the spacing altogether.

Article Style

Blog Layout

Monday theme features its own blog style that places the featured image and content side by side. Tags will also be colored according to the scheme set in the Warp administration.

Navigation Layout

You are able to choose from 2 different navigation layouts. One aligns the logo and menu to the left. The other one centers both in a stacked layout, which is ideal for big logos.

Navigation center
Navigation left

Dropdowns

Another option allows you extend the main navigation dropdown to the width of the entire browser window.

Navigation center
Navigation center

Sticky navigation

Of course this theme provides the option to apply a sticky navigation. When scrolling the page it will remain at the top of the browser window.

Navigation center

Custom Classes

Class Description
.tm-text-uppercase This class will transform your text to capital letters.
.tm-margin-xlarge,.tm-margin-xlarge-top,
.tm-margin-xlarge-bottom
Add 50px top and/or bottom margin to elements.

Video: 1736 by Christiaan Welzel, License: CC BY 3.0