Theme Features

Styles

6 different theme styles for a good start.

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

Enjoy

Enjoy

Festival

Festival

Roadtrip

Roadtrip

Sunday

Sunday

Spectrum

Spectrum

Page Appearance

Features Page Appearance 01
Features Page Appearance 02
Features Page Appearance 03
Features Page Appearance 04

JOY Theme allows you to display the site's wrapper with small, medium, large as well as full width. These options can be selected in the Warp administration.

Navbar nav left Navbar nav center Navbar nav right

This theme comes with three different navigation layouts and some additional options. The main menu can be centered or aligned to the left or right.

Navbar absolute

You can place the menu on top of the content and it will automatically turn transparent. The navigation can also be inverted for better display. If the navigation is fixed, it will maintain its default color.

Navbar fixed

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.

Navbar dropdown overlay

Another option allows you extend the main navigation dropdown to the width of the entire browser window. A subtle overlay will be applied to the rest of the site while the dropdown is open.

Hero Blocks

Hero Blocks

The additional Hero positions at the top and bottom of the theme feature a number of custom settings.

Image or Color

You can enter a background image path or color value (RGBA or Hex) for each hero position.

Color animation

Enabling this option will add an animation to the you background color, rotating it through a spectrum of automatically generated hues.

Particles color

Add your own color value (RGBA or Hex) to the particles animation.

Particles animation

Enabling this option will add an animation similar to snow falling upwards.

Class

You can add custom classes here and they will be applied to the block. For example, add the .tm-top-hero-gradient class to the top-hero section to fade it out towards the bottom.

Block Appearance

To give you more flexibility, JOY theme provides a number of settings for each module position. You can apply different background colors, paddings, content widths and place a divider between blocks.

Block background

Background Colors

Muted, Default, Primary, Secondary

Content width

Available Widths

Full, Default, Small

Block padding

Padding

None, Small, Default, Large

Divider

Divider

Checkbox (true or false)

Widgets

  • Features Slideshow 02
  • Features Slideshow 03
  • Features Slideshow 01
  • 01
  • 02
  • 03
/ 03

Slideshow

The custom Slideshow widget features a display announcing the number of items as well as the active item.

The conjoint slidenav can be positioned to the top left, top right, bottom left or bottom right of the Slideshow.

  • Heading 01
  • Heading 02
  • Heading 03

Slideshow Panel

The custom Slideshow Panel widget features the same additions as the Slideshow, i.e. the numeration and special slidenav.

Typewriter effect

JOY theme comes with a fancy typewriter effect for headings. Just add the data-tw attribute to a text element and the letters of each word will be displayed successively.

Enjoy your Life

Animation

By default, the letters just pop in. But you can use any of the classes of the Animation component from UIkit to apply an effect, like a fade or scale.

	
		<p data-tw="{cls: 'uk-animation-scale-down'}">...</p>
	

Speed

To adjust the speed of the letters coming in, add the data-tw="{cls: speed: 1}" attribute. The higher the numeric value, the slower the animation will progress.

Run, Forrest!

data-tw="{speed: 1}"

Hakuna Matata

data-tw="{speed: 200}"

Article Style

Article

JOY theme comes with an optional alternative blog layout. The default blog layout is also still available.

Custom Classes

Class Description
.tm-title-large Add this class to a text element to apply the heading's font family and to increase the font size.
.tm-text-color-1
.tm-text-color-2
.tm-text-color-3
.tm-text-color-4
.tm-text-color-5
These classes apply different colors to text elements, for example to emphasize a <span> element.
.tm-top-hero-gradient This class will apply a gradient fading out the bottom of the Top Hero position. Go to Templates > yoo_joy > Options > Layouts. Scroll down to Hero Blocks and type it in the class field of the top-hero section.
.tm-title-dash Add this class to a heading to indent the text and add a dash in front.
.tm-subnav-line Add this class to a Subnav element to add dashes between nav items.
.tm-title This class applies a custom styling to headings, adding a bottom border as a sort of separator. Page titles are automatically given the same style in Joomla.
.tm-button-link Add this class to a button or anchor to indent its text and add a dash in front.
.tm-shadow Add this class to an element to apply a box shadow to it.
.tm-margin-large-top This class applies an additional 100px space to the top of an element on medium or large viewports.
.tm-margin-large-bottom This class applies an additional 100px space to the bottom of an element on medium or large viewports.
.tm-icon-google-plus
.tm-icon-facebook
.tm-icon-youtube-play
.tm-icon-instagram
.tm-icon-twitter
These classes apply the appropriate corporate color to each social icon button.
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


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

Built with UIkit


Article title

UIkit

Lorem ipsum dolor sit amet.

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

<div class="myclass">...</div>

text-muted
text-primary
text-success
text-warning
text-danger
a element
em element
strong
code element
del element
ins element
mark element
q inside a q element
abbr element
dfn element

Badge 1 Success 4 Warning 3 Danger 4

h1

h2

h3

h4

h5
h6

Lorem ipsum dolor.

Someone famous
  • Author

    May 2, 2090 at 1:55 pm

    Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna.

Divider

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Header

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Box

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Box primary

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Box secondary

Lorem ipsum dolor sit amet, consectetur adipisicing elit.

Info message

Success message

Warning message

Danger message

55%
55%
55%
55%
Form states
Form styles


  • List item 1
  • List item 2
  • List item 3
  • List item 1
  • List item 2
  • List item 3
Table caption
Table Heading
Table Data
Table Data
Description lists
Description text.
Description lists
Description text.

Title

Lorem ipsum dolor sit amet, consetetur sadipscing elitr.

Title

Lorem ipsum dolor sit amet, consetetur sadipscing elitr.

About

Mettiti in contatto con me

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.

Il mio indirizzo email è
Questo indirizzo email è protetto dagli spambots. È necessario abilitare JavaScript per vederlo.

La mia intervista

Chi sei?

Di origine salentine, classe 1973, mi chiamo Salvatore Coluccia. Sono appassionato di fotografia da quando ero piccolo.

Cosa usi per la fotografia?

Nikon D800 e le mie ottiche NIKKOR.

Cos’è la fotografia per te?

Un’espressione artistica, è desiderio di creare e di documentare, che si alternano e a volte si mescolano.

Fotografo fai da te o hai frequentato corsi?

Autodidatta, se escludo quando, da piccolo, ero in compagnia di un fotografo professionista e delle sue reflex che prendevo in prestito.

Un aneddoto:

Portare a casa uno scatto da una vacanza, voler applicare un determinato effetto in post-produzione precedentemente letto su di un libro di fotografia, e accorgersi solo dopo che la mia foto era stata scattata nella stessa città, dalla stessa torre e con uguale inquadratura di quella che il libro aveva proposto come esempio.

Chi è Adams? e Bresson? e Carminati?

Modelli da studiare approfonditamente. Spesso lo facciamo in modo molto superficiale, commettendo un errore. Chi ama la fotografia dovrebbe amare maggiormente i grandi fotografi, ancor prima di amare la propria macchina fotografica.

La tua prima fotografia: ce l’hai ancora?

Sfortunatamente no, ma ricordo di averla scattata con la mia scuola durante una visita in un’oasi del WWF.

La tua ultima fotografia: vediamola!

Ieri. Tornavo in macchina dal Salento, e poco prima di arrivare a casa, noto dal finestrino dell’auto il paesaggio della Ciociaria; mancava poco all’alba…

Il tuo capolavoro o lo scatto preferito?

E’ lo scatto di una mandria di cavalli, sempre durante un’alba. National Geographic lo ha inserito sul proprio sito tra i migliori scatti di maggio, con mio grande piacere.

Hai una musa ispiratrice?

Otranto, dove sono nato e cresciuto. La sua terra, i luoghi, il mare, sono sempre lì ad aspettarmi, per essere fotografati. La tipologia di fotografia preferita Credo di esser rimasto fedele alla fotografia paesaggistica per molto tempo, ora è il ritratto ad attirarmi.

Un’ora per una foto o 10mila foto all’ora?

Un’ora per una foto, immaginata, sognata. Ma poi le più belle sono sempre quelle del tutto inaspettate.

Un desiderio: Cosa o chi vorresti fotografare?

Ho la fortuna di poter viaggiare molto, ma poi, paradossalmente, ho come la sensazione di viaggiare poco. Se potessi vorrei fotografare in un viaggio senza sosta. Ci sono tanti luoghi e popoli che vorrei fotografare. Continuo ad essere affascinato dall’Afghanistan, ci tornerei volentieri.

La foto è fatta in macchina fotografica o al computer?

Nell’era digitale, così come in quella analogica, postprodurre uno scatto è un procedimento importante, a cui non è possibile rinunciare. E’ solo diventato più facile e più accessibile rispetto a prima. Per cui, la fotografia parte dall’occhio del fotografo per poi attraversare la macchina fotografica ed arrivare in camera oscura, o camera chiara.

Domanda a risposta libera: che ti passa per la mente?

Voglio migliorarmi, in quello che faccio.

Qualche suggerimento per i lettori?

Stampate le vostre foto migliori, che siate fotografi o amanti della fotografia. Se poi siete neo-genitori, fatelo maggiormente per i vostri figli. Quando saranno grandi vorranno vedere le vecchie foto, e non solo quelle che li ritraggono, ma quelle che ritraggono loro in vostra compagnia, nei luoghi dove sono cresciuti. Non fidatevi troppo del formato digitale, potrebbe presto diventare obsoleto o andare irrimediabilmente perso. Fatelo!

Video

 

Altri articoli...

Seguimi

Sei un tipo social? Ora puoi facilmente trovarmi sui maggiori social network e iniziare a seguirmi.