New Warp 5.5 framework

We updated 20 templates to our brand new Warp 5.5 theme framework

Aug

Over the last couple of months we developed the new Warp 5.5 theme framework which is the new foundation of all our YOOtheme templates. In this time we have rewritten the complete Warp theme framework to make it more modular, flexible and also extendible. Currently all Warp 5 templates are updated and six more will follow in the next days so all our templates since 2009 run on the new framework. This means 20 templates will use Warp 5.5! In this article we want to highlight some of the key features of our new Warp 5.5 theme framework. Enjoy!

Framework Core

Basically Warp 5.5 provides a rich toolset for crafting a modern template. We designed the new framework in a way that every tool or helper as we call them in Warp, is a modular component doing a single task. Like the good' old unix philosophy: "Write programs that do one thing and do it well." So we created a bunch of helpers to do just a single task for example like rendering layouts, minification, caching or XML parsing. This makes the framework really flexible as we can use only the helpers we need when creating a template, the framework also ensures that only helpers are loaded which are currently used. Since every helper has a modular design its makes it easy to add new helpers anytime to extend the frameworks functionality. Also we extracted the framework from the template, so now the new Warp framework is placed in a separate directory called "warp" in the templates directory. Applying updates or patches to the framework is easily done now, because all the generic framework source code can be updated independently from the individual template code.

CSS/JS/Image Compression

With Warp 5.0 we introduced a really great feature to automatically combine, cache and compress stylesheets and javascripts of a template. You can find more information about it in the "Faster loading with Warp5" article. As a result a template will speed up its overall loading time in the browser, because it needs less HTTP requests and also all resources are compressed on-the-fly using the GZIP data stream compression. Warp 5.5 takes this concept even further and now minifies stylesheets and javascripts. This means all unnecessary characters are removed from the stylesheets and javascripts sources. These unnecessary characters usually include white space characters, new line characters and comments which are used to add readability to the code during the development, but are not required for it to execute. The minification is now a part of the caching process and its enabled by default so you don't need to worry about it. Finally the minified stylesheets and javascripts will save some more KB's of bandwidth to improve the templates loading times.

But that's not all! We like to introduce a brand new compression feature: Data URIs! Since Warp5 we already minimize the image requests by merging image slices into so-called CSS sprites. This means that we put as many image slices as possible into a single image file which significantly reduces the loading time of your website. But of course there are still some neccesary image request left. With Warp 5.5 we use Data URIs to get rid of them. Data URIs allow to include images and other files in-line in HTML and CSS as if they were external resources. This means that all template images which are smaller than 30KB are now embedded into the templates CSS and there no extra HTTP request required to load the images. In most cases only 2 HTTP file requests (CSS + JS) are necessary to load a template. That's it! Isn't this awesome? This feature is only available for modern browsers (Firefox, Safari, Chrome, Opera, IE8). But you don't have to worry about older browsers like IE7. They are still loading the images the normal way.

Mootools 1.2 ready

The recently released Joomla version 1.5.20 adds support for using Mootools 1.2 as your primary Javascript library. Therefor Joomla now includes a new plugin called "mtupgrade" which will include Mootools version 1.2.4 instead of the old Mootools version 1.1.2. With the new Warp framework 5.5 we included native Mootools 1.2 implementations of all the template Javascripts! Further the framework auto-detects if your are using the Mootools upgrade plugin or not and will include the compatible scripts to match your Mootools version.

Presets

We introduce a new preset parameter in the template configuration. With presets you can define and load a specific configuration of the template parameters. Currently the presets only change the "Template Color" parameter but future templates we will use more options than just the "Template Color". Further you can "Allow dynamic presets", which means a preset configuration can be loaded adding a HTTP get parameter to your website link like: &preset=blue. And last but not least you can disable dynamic presets so it is not possible to change the preset by adding the &preset parameter to a link. This means it is no longer possible change the color variation of your template if you don't want to allow it.

New Versioning

When updating all our templates we also changed the template versioning. The first two numbers are now referring to the Warp framework version and not the Joomla version which the template is created for. So you can immediately check which framework version the template is using. We did this to avoid confusion in the future because the new Warp 5.5 theme framework not depends on the current Joomla version.

Future

Currently we are very focused on our Warp framework and a lot of development is going on. With Warp 5.5 we updated the whole php code base. Now Warp is a platform independent CMS theme framework. This improvements on the framework level were very important to add more features in the future. This means you can expect more Warp updates soon... :-)

We hope you like the new Warp theme framework as much as we do! Enjoy!

By Steffan | 17 August, 2010 | Posted in Warp

Comments (31)

bigfrontdoor

| Profile | #

WARP is quite simply the best Joomla framework around, and it's great to know it is improving and developing further. Loving it !

reply
darren.kilford

| Profile | #

Wow, this is great news. Really looking forward to digging in and having a look around the Warp 5.5. Man you guys have been busy recently. Keep up the great work. Thanks for making my life easier as a designer/developer.

reply
PunchDrunkLove

| #

Yeah nice - loving the warp to go up to 6, cause you know all the new spaceships driving with 6 ^^

reply
John

| #

The new Warp 5.5 looks awesome. Feature set is thrilling. I'll be joining the Yootheme club in the next few days too - looks like I chose a great time to do so! :D

reply
laura.v.rawson

| Profile | #

Will there be documentation on how to upgrade the older templates if you are currently running them on Warp 5?

reply
Torkil Johnsen

| #

I have not looked at Gantry or Morph to compare, but I'm sure you guys have been checking out the competition! What are the main differences would you say? :)

reply
anthony.tilahun

| Profile | #

awesome work @YT! Keep up w/ the steady updates and keep us informed. Rock on! Already started to mess w/ the new 5.5 and your new blog post seems to explain a bit more in depth. Thanks again!

reply
tqddn_hmzh

| #

which better?
warp from yootheme or gantry from rockettheme.

reply
yi.wen.chen

| Profile | #

I use both, and both provide awesome functionality. Gantry supports an iPhone theme, plus you can redirect IE6 users to a static HTML page automatically. Warp is easier to customize for non-developers, as Gantry stores files in com_gantry and your template folder. This can get messy when trying to make even simple changes. Warps themes load faster, hands down, but they might not have all the bells and whistles found in a Gantry theme. Style wise, I feel YooTheme has an edge over RT. Support is great on both sides. Needless to say, I'm a member of both clubs and will be for the foreseeable future.

reply
- andrew
  
  | Profile | #
  
  I agree with Kevin. I used both and warp loads faster. Both have tones of features
  
  reply
xSpline

| #

Yeah, yeah, yeah!!! Thanks guys!!!

reply
eric.brissette.83

| Profile | #

"With Warp 5.5 we updated the whole php code base. Now Warp is a platform independent CMS theme framework."

Does this mean that Templates written with Warp 5.5 will not have to be re-written at all for the upgrade to Joomla 1.6?

reply
peter Chow

| #

if you have any plan upgrading Phoenix and all old Yoo Templates to warp 5.5

reply
otas.n

| Profile | #

Hi,
can I use Warp 5.5 in old Pinboard template? Thanks for your reply.

reply
mustaq

| #

Phoenix and all template from 2009 to present ( Neo) are using the new framework already

reply
marc.taylor

| Profile | #

Sounds cool, cant wait to check it out when a new project comes up..

reply
expert comptable

| #

Thanks guys :)

reply
opssr

| #

I agree that it would be nice to have support for iPhone themes in the templates. I also think a smart image loading feature like Gantry has would be really nice. Yootheme design work with the icons, etc. is very impressive, but I would like to see this translated in the templates. They look so similar every month, especially the use of module positions and variations. Like to see more creativity. Just my 2 cents.

reply
lordbarron

| #

I've had subscriptions to both YT and RT and i prefer YT as the designs are more of a blank canvas and they dont have all th bells and whistles that RT have. You may think thats a disadvantage but I see it as if i want an iphone theme i'll make an iphone theme and have a plugin to detect when to use it, or if I want to use tracking other than google analytics I can because its not hardcoded into my theme. RT has too much reliance on the menu item ids which is bad practise as I feel its joomla's core weakness in controlling styling, modules etc.

reply
Rogovski Rossini

| #

Could you pls tell me, why exactly WRAP is the best framework around or better than for example the T3 framework? Because I am actually looking for a framework / template. Thx in advance.

reply
shinkendo

| #

I totally agree that iPhone-ready template themes are a must!! It's the only reason I have left to still use gantry.

reply
adrianmelia

| Profile | #

I have just renewed my Yootheme subscription for another 12 months (so yes, I <3 Yoo)

But I would like to see a system where mobile device browsers are detected and a mobile version of the template is displayed. Forgive my non-technical words here. Just that everyone is using Android and similar devices with small screens (me included) and I HATE having to scroll all over the place just to find the content. Yoo themse are not bad on mobile devices but purpose-made would be wonderful.

reply
Omar Kanawati

| #

Very good Joomla frame work ! and thanks a lot for the great update

but i am really disappointed that there is no support for RTL languages !
I am syrian and i want to build my website using yootheme templates but i can't cause there's no support for RTL languages
i hope to see RTL Support in the next update :D

reply
trauncher

| Profile | #

Are you guys testing against Joomla 1.6 yet? if so, is there a beta? Joomla 1.6 resolves several major issues with the design lf joomla (like user groups etc). Just wondering of you all will be aggressively supporting it.

reply
- sascha
  
  | Profile | #
  
  All Warp 5.5 templates will be released for Joomla 1.6 as soon as Joomla 1.6 is stable...
  
  reply
J Taylor

| #

is there any way to download a "blank" warp template? kind of like a blank canvas?

reply
- sascha
  
  | Profile | #
  
  You can find the Warp theme framework in the warp folder of the template. Currently we have no "blank" template but we will do one soon...
  
  reply
- Max
  
  | #
  
  This is what i would like too. Please, give us a "blank" warp template.
  
  reply
Moderator

| #

Hi Guys, I just started my very first website on Joomla and after searching for frameworks I landed on this page. Is seemes to me that the warp framework (modular system) is ideal for what I am looking for. I have no idea how to start, so I could use some help. (I totally understand the menu system) but have no php or html knowledge.

Monique

reply
patobanton

| #

Very Good job ! Thanks a lot

reply
gsuez

| Profile | #

Warp is cool, really a great framework... but I would like a free Warp 5 Template version, like Gantry or T3.
I believe your company will increase its prestige with this product.

reply