Deliverance
Theming websites effortlessly
Aaron VanDerlip
www.jazkarta.com
World Plone Day 2010
There are obstacles, regardless of platform
Example
Apply a design to a
 WordPress site
<div id="header" role="banner">

 <div id="headerimg">
   <h1><a href="<?php echo get_option('home'); ?
>/"><?php bloginfo('name'); ?></a></h1>

 
 <div class="description"><?php
bloginfo('description'); ?></div>
<div id="header" role="banner">

 <div id="headerimg">
   <h1><a href="<?php echo get_option('home'); ?
>/"><?php bloginfo('name'); ?></a></h1>

 
 <div class="description"><?php
bloginfo('description'); ?></div>
HTML is forgiving
<h1><a href="<?php echo get_option('home'); ?>/"><?
php bloginfo('name'); ?></a></h1>
Application code is not
<h1><a href="<?php echo et_option('home'); ?>/"><?
php bloginfo('name'); ?></a></h1>
The current
  compromise
     People competent at both




People that          People that have
have design skills       coding skills
The Deliverance Way


  Web             Web Designers
  Developers



           People that know CSS
Secret Sauce
Where does Deliverance
   sit in the stack?


          Apache



       Deliverance
Where does Deliverance
   sit in the stack?


          Apache



       Deliverance
Deliverance is a tool for moving content using CSS
selectors and a few rules

The only requirements is that the theme and content
source supply HTML

A typical configuration consists of a static HTML file as
the theme as the them resource and an application as the
content provider.
The rules
replace
append
prepend
drop
Content
#content




     Theme
 #page .floatRight
<theme href="/static/lazydays/
index.html" />


<replace
content="children:#content"
theme="children:#page
.floatRight" />
#content
#page .floatRight
<theme href="/static/lazydays/
index.html" />


<replace
content="children:#content"
theme="children:#page
.floatRight" />
Talk is cheap
#content
#page .floatRight
Proxy rule
<proxy path="/blog" class="blogtheme" >
  <response rewrite-links="1" />
<dest href="http://blog.localhost" />
 </proxy>
<replace
content="children:#content"
theme="children:#page
.floatRight" />
Let’s get to work
Special pages
Photo credits

• http://www.flickr.com/photos/
  21896484@N02/2726201320
• http://www.flickr.com/photos/
  disownedlight/3268752278/sizes/l/
Find out more


• http://blog.jazkarta.com
• http://deliverance.openplans.org/

Deliverance talk at plone meetup

Editor's Notes

  • #3 All platforms try to solve the this. The great battle between design minded folks and development minded folks.
  • #5 sample template
  • #7 typical code, you get distracted
  • #11 We create all sorts of extra infrastructure to account for the above, each solution is different.
  • #14 Deliverance is a piece of software that proxies the incoming request from a browser, based on the request, it finds the content and the theme that most closely matches the request and returns it to the browser.
  • #16 These rules apply to matched CSS selectors (or Xpath)s
  • #29 the is the routing