Chester Theme

February 2016 YOOtheme club theme

Feb
01
Chester Theme

Make yourself at home with Chester, our February 2016 release. This theme travels light, focusing on essential design elements and paying special attention to detail. It features four custom widgets, the additional Sidepanel position, different main navigation layouts and a bunch of useful little helpers. With its spacious layout and elegant typography, Chester will perfectly represent a hotel, inn or any other grastronomy business, though it's versatile enough to work great with any kind of website.

Navbar Layouts

Chester theme features two different navigation layouts. You can either place the logo on top of a centered main menu, making space for a big logo as well as the additional headerbar position. Or you can display both in a single row to save space. In both cases you have the option to apply a sticky navigation, so it remains at the top of the browser window when scrolling.

Chester Navbar Layouts

Custom Widgets

Of course Chester comes with Widgetkit 2, our content building toolkit. In addition to the standard plugins we've created four custom widgets that perfectly fit into the theme's overall styling.

Slider

This slider applies a three column layout, centering the active item and adding generous spacing between the images. That way they are cut off by the browser window, which creates a trendy and elegant look.

Chester Slider Widget

Popover

The Popover Chester widget provides a custom toggle icon and alignment options, so that the dropdowns are aligned by their corners instead of their sides.

Chester Popover Widget

Switcher

This custom Switcher features a special navigation that allows you to use thumbnails and the items' titles to switch through the panels. Additionally you can apply different widths to the content through an option in the widget's administration.

Chester Switcher Widget

Switcher Nav

The second custom Switcher comes with another special navigation. You can use an image, like an icon, the item's title or both to navigate trough your content. It is also possible to select the content width for this Switcher in the widget settings.

Chester Switcher Nav Widget

Sidepanel position

To allow quick access to important content, like a booking form, Chester provides the new Sidepanel position. A button, which remains fixed on the left side of the browser window, toggles any content that is published inside this position, so it will slide into view. You can display multiple widgets/modules inside the Sidepanel.

Chester Sidepanel Position

Blog Layout

Chester theme also comes with an optional blog layout. It displays the featured image and the article content side by side and places the create date iconically next to the image. Of course, the default blog layout is also available.

Chester Block Layouts

Additions

Chester theme comes with 6 style presets and a number of additional options to change the position appearance of each section. Some useful utility classes and theme components will help you arrange your content. For a full list of these classes and a more detailed overview of the theme's features, check out the Theme page.

  • 2 different navbar layouts
  • Custom Slider, Popover and two Switcher widgets
  • Additional Sidepanel position
  • Optional custom blog layout
  • Demo pages built with Widgetkit 2
  • Full UIkit components styling
  • 6 pre-built style variations
  • Easy customizer and LESS integration
  • WooCommerce support

Joomla Demo WordPress Demo

By Franziska | | Posted in Themes | 8 comments

Avanti Theme

January 2016 YOOtheme club theme

Jan
04
Avanti Theme

Happy new year everyone! We will start 2016 with Avanti. This noble theme includes two different navigation and two different footer layouts, three custom widgets, modification classes, many other options and of course the latest Warp and UIkit features. Avanti comes in 6 different styles and polished demo pages, which make it suitable for all kinds of websites.

Styles

Avanti Theme Styles

Slideshow

Avanti comes with a modified Slideshow widget, which works perfectly inside the theme's header layout position. The Slideshow features a brand new numnav which counts items automatically. You are able to set a width for the overlay content. And on top of this, we also added an animated letter option for each item's title.

Avanti Slideshow Widget

Slideshow Panel

With the Widgetkit 2.5 release we have added the Slideshow Panel widget. Avanti uses a slightly modified version perfectly fitting for any portfolio, case study or product presentation. The Slideshow Panel features a content max width setting for large view ports. This option might be very useful, if you are using a full width block layout setting.

Avanti Slideshow Panel Widget

Grid

For Avanti we have added a modified Grid widget to customize our output, especially the one we can not control, like WordPress or Joomla system content. We've added a truncate option for the title and content, which makes it easier to control the data output and height. The grid also features a divider option, adding borders between the items. Finally, we also added the option to display tags from the WordPress/Joomla content providers.

Avanti Grid Widget

Navigation

The main navigation of Avanti Theme supports the latest UIkit sticky navigation component features. You are able to select from 3 different navigation behaviors/styles and 2 layouts. The styles and the layouts can be combined. This makes 6 different navigation combinations. To make the navigation a little more unqiue we added a subtle but nice animation for the sticky navigation.

Avanti Navigation

Footer

In this theme you can choose from two different footer layouts and combine them with the fixed footer option. When enabled, your website will scroll over the footer.

Avanti Footer

Block Appearance

Avanti supports some useful options for all block layout positions. All settings can be combined for a block position. If you need different block settings for different pages, you can use layout profiles and assign them to your menu items. The options inlcude different background colors, background-image path field, blend and opacity options, various spacing options, full width and full height support and an option to add custom CSS classes to customize your content.

Avanti Block Appearance

Additions

Avanti has some helper classes and modifiers to slightly upgrade and control the content display. You can use them to modify your content. Just remove them, if you prefer the regular UIkit rendering.

Avanti Additions

You can find a comprehensive list of all features here. And you will also soon find answers from our support to your Frequently Asked Questions.

  • Slideshow, Slideshow Panel and Grid widgets
  • Two navigation layouts and three behaviors
  • Two footer layouts with position fixed option
  • Different block appearance settings
  • Custom blog layout
  • Demo pages built with Widgetkit 2
  • Full UIkit components styling
  • 6 sophisticated pre-built style variations
  • Easy customizer and LESS integration
  • WooCommerce support

Joomla Demo WordPress Demo

By Danny | | Posted in Themes | 22 comments

Uniq Theme

December 2015 YOOtheme club theme

Dec
01
Uniq Theme

As Christmas draws nearer we end the year with Uniq, our December 2015 release. This elegant, clean theme includes three custom widgets, different layouts for the main navigation and a number of additional theme specific options. Its extreme versatility is reflected in the sophisticated style variations. Each style is thematically matched to a different industry, for example a bakery or a wedding website.

Slideshow Panel

Uniq features its own custom version of the new Slideshow Panel widget. Unlike the ordinary Slideshow it allows you to place content next to the image instead of displaying it in an overlay. The Uniq Slideshow Panel has a rounded content border overlaying the image and an animated button for the link.

Custom Widgets

Gallery Uniq

The custom Gallery Uniq widget includes a special overlay effect, similar to the one in the Slideshow Panel. The new slideshow lightbox option creates a fullscreen modal, presenting content and image side by side. Additional content can be displayed here as well as a second image instead of an enlarged version.

Custom Widgets

Switcher Panel

Another new member in the Widgetkit family is the Switcher Panel, also represented as a custom widget in this theme. It places the image in a teaser alignment at the top of the panel with an overlaying navigation to switch through the different content panes. The custom Uniq Switcher Panel provides a heading for the tabbed navigation.

Custom Widgets

Navbar Layouts

The main navigation of Uniq theme supports the the latest UIkit Sticky and Smooth Scroll component features. This combination offers you the possibility to use Uniq as a slim one-pager as well as a more complex site. Additionally, you are able to choose from 3 different navigation layouts in the Warp administration.

Custom Widgets

Avatar Styling

Another little gimmick is the .tm-timeline-avatar class. It applies a circle shape and a border to images and moves it up by 80px. This is great to integrate an avatar or similar into a vertically split layout, evenly placed between the top and bottom half. You can see this in the About section of our theme demo.

Custom Widgets

Blog layout

Of course we wouldn't skip the opportunity to create a custom blog layout for this theme. It places each article inside a panel with the featured image attached to the top border like a teaser.

Custom Widgets

You can find a comprehensive list of all features here. And you will also soon find answers from our support to your Frequently Asked Questions.

  • Slideshow Panel, Gallery and Switcher widgets
  • Three different navbar layouts with sticky and smooth scroll options
  • Different block appearance settings
  • Custom blog layout
  • Demo pages built with Widgetkit 2
  • Full UIkit components styling
  • 4 sophisticated pre-built style variations
  • Easy customizer and LESS integration
  • WooCommerce support

Joomla Demo WordPress Demo

By Sergej | | Posted in Themes | 14 comments

Finch Theme

November 2015 YOOtheme club theme

Nov
02
Finch Theme

Adventurers, globetrotters, and outdoor friends, check out Finch, our November 2015 release. This sophisticated theme provides tons of custom options and additional features to make browsing through your website a true experience. Its rich, textured widescreen layout makes it perfect for any kind of travel blog or magazine.

Custom Widgets

Finch comes with our own content builder Widgetkit 2, including three exclusive new custom widgets. The Popover widget allows you to position items through coordinates on top of a main image, which is chosen through the widget settings. Content will be displayed inside a dropdown triggered by each item. The custom Slider provides a special layout, placing the item's title outside the overlay and the custom Slideshow couples the navigation to its content.

Custom Widgets

Special Features

With Finch we allow you to say goodbye to simplistic, flat designs and bring graphical richness and depth back into your layouts. You can add background images or textures to each module position. Even border images will be added to your textured blocks. Widgets/modules have additional options, like opacity and alignment. And as a neat little feature, you can add background textures to your text elements. Just add the .tm-text-clip class and a background image via inline style to the element.

Texture

What else

This theme includes 6 dark, light and colored styles. An additional Socialbar position lets you toggle social icons through a button that sticks to the side of the browser window. And of course, the adaptive navbar provides different sticky and transparency options. You can see all these features and more on a number of custom pages we’ve created to help you as a starting point for your own layouts.

Socialbar
  • Custom Popover, Slider and Slideshow widgets
  • Block appearance options, like background, texture and padding
  • Opacity and alignment options for widgets/modules
  • Clipped background images on text
  • Optionally sticky and transparent navbar
  • Demo pages built with Widgetkit 2
  • Full UIkit components styling
  • 6 pre-built style variations
  • Easy customizer and LESS integration
  • WooCommerce support

Joomla Demo WordPress Demo

By Lisanne | | Posted in Themes | 23 comments

Avion Theme

October 2015 YOOtheme club theme

Oct
01
Avion Theme

Let's get to business with Avion, our October 2015 theme release. With its tiled layout and overall clean design, Avion provides the perfect base for your corporate website. Two navbar layouts, four custom widget plugins and a number of handy features offer you the flexibility you need to present content that is heavy on typography.

Navbar Layouts

This theme features two different header layouts. One places the logo inside the navbar, the other one above it, so that big logos fit easily and maintain their proportions. You can select the presets through the Warp administration and assign them to different layouts.

Navbar Layouts

Custom Widgets

Of course, Avion comes with Widgetkit 2 including four custom widget plugins. A special Gallery widget provides a nice overlay effect and an additional arrow icon. The custom Slideset is great for displaying an events calendar with a hover effect on each item. The tabs switcher fits perfectly with box style panels and the tabbed navigation will always extend to fill the entire panel height. On top of all this, Avion also includes a widget for displaying Tweets from the Twitter content provider.

Custom Widgets

Special Effects

We've created some interactive effects for Avion theme to enhance the user experience. A fancy particles animation with different color modi can be selected for each module. But you can also add this manually via data attribute. Additionally, Avion automatically applies a Google materials inspired ripple effect to a number of UI elements.

Special Effects

Additions

Avion theme comes with the usual 6 style presets and some additional layout options. A number of useful utility classes and theme components will help you arrange your content. For a full list of these classes and a more detailed overview of the theme's features, check out the Features page.

  • 2 different navbar layouts
  • Custom Gallery, Slideset, Tabs and Twitter widgets
  • Particles animation
  • Ripple effect
  • Demo pages built with Widgetkit 2
  • Full UIkit components styling
  • 6 pre-built color schemes
  • Easy customizer and LESS integration
  • WooCommerce support

Joomla Demo WordPress Demo

By Franziska | | Posted in Themes | 32 comments

JoomlaDay Germany 2015

We presented UIkit, Warp and Widgetkit and had a fun couple of days together

Sep
23
JoomlaDay Germany 2015

After 4 years the Joomla community finally gathered in our home town Hamburg again! Last week we came together at Trabrennbahn Bahrenfeld, a local harness racing track, for JoomlaDay Germany and to celebrate the 10th birthday of Joomla! This event is always a great opportunity to meet friends, exchange knowledge and to sit down for some interesting talks. To us this was a particularly exciting as we not only got in touch with users and answered their questions in our tech corner.

We also had the chance to give talks of our own. If you couldn't make it to JoomlaDay or our talks, don't worry! All three sessions on UIkit, Warp and Widgetkit, which were held in German, have been recorded and uploaded to the JandBeyond YouTube channel.

JoomlaDay Germany 2015 Impressions

By Olivia | | Posted in Company | 8 comments

Sun Theme

September 2015 YOOtheme club theme

Sep
01
Sun Theme

Hot off the press we present the September issue of our 2015 theme series, Sun. This theme is heavy on well used typography and will bring your magazine, blog or news website to life. Four additional Widgetkit plugins, as well as a number of little features will help you organize your content with ease.

Flexible Article Styling

Flexible Article Styling

Sun gives you unprecedented freedom when it comes to displaying articles. Not only does it include its own special blog style. You can also use Widgetkit to render articles in, say a Grid widget, and apply the same styling with Widgetkit. That way you can publish different categories on the same page and any position with the theme's custom design.

Theme Tags

Additionally you can assign different colors to tags from within the Warp administration. This allows you to thematically color code your articles.

Weather Shortcode

Weather Shortcode

News are inextricably linked to weather forecasts, which is why a weather feature could not be missed in this theme. Using a shortcode you can choose a location and the unit describing the temperature.

Events Widget

Events Widget

Another Widgetkit addition is the custom Events widget. Add information, like location and time to your content through custom fields and Widgetkit will include them nicely in the rendered layout.

Additions

Sun provides two more custom widgets. The List widget allows you to display different types of content, like a Twitter feed, in a list layout and the Tab widget adds a tabbed navigation to a switcher. When displaying tagged articles, the tag color will be applied as a border to the tab. You can explore all specials of the theme on the Features page and see them in action in our theme demo, which of course includes a number of custom pages.

  • includes custom Tabs, Article, List and Events widgets
  • 5 Different block Styling
  • Weather shortcode
  • Tag Highlighting
  • Demo pages built with Widgetkit 2
  • Full UIkit components styling
  • 6 pre-built color schemes
  • Easy customizer and LESS integration
  • WooCommerce support

Joomla Demo WordPress Demo

By Sergej | | Posted in Themes | 20 comments

UIkit 2.22 released

New video tutorial section

Aug
24
UIkit 2.22 released

It’s been a while, but after some time of tweaking and bug fixing we are happy to finally present the new version of UIkit! The latest release of our front-end framework comes with a number improvements and minor bug fixes as well as a new video tutorial section.

By Sascha | | Posted in UIkit | 7 comments