Theming websites effortlessly with Deliverance (CMSExpo 2010)

  • 2,160 views
Uploaded on

Learn how to theme any CMS in 5 minutes with Deliverance, a tool that makes theming easy. It takes content from a CMS and inserts it into placeholders in a theme destination.

Learn how to theme any CMS in 5 minutes with Deliverance, a tool that makes theming easy. It takes content from a CMS and inserts it into placeholders in a theme destination.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
2,160
On Slideshare
0
From Embeds
0
Number of Embeds
2

Actions

Shares
Downloads
14
Comments
0
Likes
2

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

  • All platforms try to solve the this. The great battle between design minded folks and development minded folks.

  • sample template

  • typical code, you get distracted




  • We create all sorts of extra infrastructure to account for the above, each solution is different.



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

  • These rules apply to matched CSS selectors (or Xpath)s












  • the is the routing


  • Marketing dept wants to make a landing page.



Transcript

  • 1. Deliverance Theming websites effortlessly Nate Aune (@natea) www.jazkarta.com CMSExpo 2010 - Chicago
  • 2. There are obstacles, regardless of platform
  • 3. Example Apply a design to a WordPress site
  • 4. <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>
  • 5. <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>
  • 6. HTML is forgiving <h1><a href="<?php echo get_option('home'); ?>/"><? php bloginfo('name'); ?></a></h1>
  • 7. Application code is not <h1><a href="<?php echo et_option('home'); ?>/"><? php bloginfo('name'); ?></a></h1>
  • 8. Are you a f ’ender or a b’ender?
  • 9. The current compromise People competent at both People that People that have have design skills coding skills
  • 10. The Deliverance Way Web Web Designers Developers People that know CSS
  • 11. Secret Sauce
  • 12. Where does Deliverance sit in the stack? Apache Deliverance
  • 13. Where does Deliverance sit in the stack? Apache Deliverance
  • 14. Deliverance is a tool for moving content into a theme 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 resource and an application as the content provider.
  • 15. The rules replace append prepend drop
  • 16. Content #content Theme #page .floatRight
  • 17. <theme href="/static/lazydays/index.html" /> <replace content="children:#content" theme="children:#page .floatRight" />
  • 18. #content
  • 19. #header h1 #page .leftColumn #page .floatRight
  • 20. <theme href="/static/lazydays/index.html" /> <replace content="children:#content" theme="children:#page .floatRight" />
  • 21. Talk is cheap
  • 22. #content
  • 23. #header h1 #page .leftColumn #page .floatRight
  • 24. Proxy rule <proxy path="/blog" class="blogtheme" > <response rewrite-links="1" /> <dest href="http://blog.localhost" /> </proxy>
  • 25. <replace content="children:#content" theme="children:#page .floatRight" />
  • 26. Let’s get to work
  • 27. Special pages
  • 28. Benefits • Use any design with any CMS, without touching either one. • Designer and developer can work in parallel without stepping on each others toes. • Designer doesn’t need to know anything about the CMS. Can use their design as is. Less custom theme code to maintain. • Theme multiple applications using a single theme. Makes changes in only one place.
  • 29. Credits • Aaron VanDerlip for the slides • Ian Bicking for making Deliverance Photo credits • http://www.flickr.com/photos/21896484@N02/2726201320 • http://www.flickr.com/photos/disownedlight/3268752278/sizes/l/
  • 30. Find out more • http://deliveranceproject.org/ • http://blog.jazkarta.com