Demo

Blog

Layouts

Warp comes with a sophisticated layout system to create any kind of sidebar or widget layout. You can easily manage the sidebar's positions and widths in the theme administration. Widgets can have different styles and be placed in any position offered by this theme. Each position has its own layout. You can align widgets side-by-side, stack them or choose your own grid layout. Show or hide widgets on mobile devices, while the grid adapts perfectly to your layout.

Warp Layout System

Icons

YOOtheme is a well-known template and extension provider for Joomla and WordPress who helps you to create professional websites. But to make your website or interface design a real eye-catcher there was one thing missing: Icons! Icons are an essential tool to simplify user interfaces and today almost every major website uses icons to highlight important parts in their content.

This is why we created a great resource of beautiful and handcrafted icons for web and print projects. We got commercial icon sets including e-commerce, community, hosting and tool icons and many more as well as many freebies.

As a member of our icon club you will get access to hundreds of handcrafted and detailed icons.

Visit Website

Club Icons

  • Pixel perfect design
  • 8 PNG sizes from 16 to 512 pixels
  • Optimized for each size
  • Scalable vector sources
  • Easy to customize

UIkit

Title

Lorem ipsum dolor sit amet, consetetur sadipscing elitr.

Title

Lorem ipsum dolor sit amet, consetetur sadipscing elitr.

Article title

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-info
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.

Dummy Content

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

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.

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.

Parallax

To use our unique parallax effect, just add the .parallax class to a <div> element and modify it the way you want with the data-* attributes.

Syntax name Description Default value
data-sizeratio="" Defines the height in relation to the width. 0.38
data-ratio="" Defines the effect speed. The higher the value, the more slower the effect speed. "1" is the natural scroll speed. 8
data-maxdiff="" Defines a maximal scroll height. false
data-start="" Defines a starting position. 0
data-mode="" Defines, when the parallax effects begins. "inview" starts once the parallax is in view of the browser frame. "dock" starts when the browser frame top docks to the parallax. inview
data-childanimation="" Defines, if the child element is animated with "true" or "false". true
data-childdir="" Defines the direction of child elements. "-1" will scroll to top. "1" will scroll to bottom. 1
data-childratio="" Defines the speed of child elements. "-1" will scroll to top. "1" will scroll to bottom. 3
data-childopacity="" Adds or removes a fade-out effect from child elements by using the value "true" or "false". true

Parallax example

<div class="parallax" id="parallax-top-image" data-childopacity="false" data-sizeratio="0.12" data-childdir="1">
   <div>This is the child element</div>
</div>

Custom Widgetkit Styles

We created a custom style for our Widgetkit Slideset, perfectly fitting the theme. To apply this style, follow these steps:

Slideset

  1. Download and unzip the bonus styles package for Widgetkit available in the download area
  2. Copy the folder slideset/styles/capture
  3. Joomla: Paste it to media/widgetkit/widgets/slideset/styles
    WordPress: Paste it to wp-content/plugins/widgetkit/widgets/slideset/styles
  4. Now you can select the style "Capture" in the settings of your Widgetkit Slideset

Social Icons

Use the modifier .uk-icon-button class to create an icon button.

Here is a little code example how to add them:

  <a href="#" class="uk-icon-button uk-icon-twitter"></a>
  <a href="#" class="uk-icon-button uk-icon-facebook"></a>
  <a href="#" class="uk-icon-button uk-icon-google-plus"></a>

Here is an overview of all icons provided by Font Awesome.

Weitere Beiträge ...

  • 1
  • 2

Premium Themes for

WordPress & Joomla

Contact Us

Award 2013

2013 Warp Framework

YOOtheme won again the J.O.S.C.A.R for the best Joomla Template Framework.

Award 2011

2011 Warp Framework

Our first J.O.S.C.A.R was won on the J and Beyond event in Kerkrade, Netherlands.