Atomicant Drupal 6 Theming
Upcoming SlideShare
Loading in...5
×
 

Atomicant Drupal 6 Theming

on

  • 2,468 views

 

Statistics

Views

Total Views
2,468
Views on SlideShare
2,468
Embed Views
0

Actions

Likes
2
Downloads
46
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Atomicant Drupal 6 Theming Atomicant Drupal 6 Theming Presentation Transcript

  • Drupal front-end Marek Sotak
  • Hello Marek Sotak Developer, designer co-founder of atomic ant ltd web design company based in London, Prague and Denmark, operates internationaly. Creator of RootCandy admin theme http://drupal.org/project/rootcandy http://twitter.com/sotak http://facebook.com/sotak http://atomicant.co.uk
  • Theming – Drupal 6 ● Theme = presentation layer – separated from logic – No need to touch the modules if we want to change the output (markup) ● PHPTemplate engine (Smarty, xtemplate, etc...) ● Saving to sites/*/themes/my-theme
  • Theme anatomy
  • Page rendering – suggestions + preprocess
  • theme('hook', $arguments) ● theme_breadcrumb, schoolinafrica_links,... ● Defined in hook_theme() function search_theme() { return array( 'search_theme_form' => array( 'arguments' => array('form' => NULL), 'template' => 'search-theme-form', ), ); }
  • hook = function – suggestions ● themeName_hook($arguments) – schoolinafrica_breadcrumbs($arguments) ● engineName_hook($arguments) – phptemplate_hook($arguments) ● theme_hook($aguments)
  • hook = template – suggestions ● Convert $arguments → $variables ● Search for render functions (theme_render_template) ● Search for the function that sets the template files extension (.tpl.php) ● $variables are passed by reference
  • hook = template – suggestions ● template_preprocess ● template_preprocess_hook ● moduleName_preprocess ● moduleName_preprocess_hook ● engineName_engine_preprocess ● engineName_engine_preprocess_hook
  • hook = template – suggestions ● engineName_preprocess ● engineName_preprocess_hook ● themeName_preprocess ● themeName_preprocess_hook ● Collects suggestions ● Find implemented suggestions (drupal_discover_template)
  • hook = template – suggestions ● theme_render_template ● Put together .tpl.php ● suggestion.tpl.php fallback to ● hook.tpl.php
  • Sub-theming ● .info file with base theme defined is enough – base theme = ninesixty ● Sub-themes can share some of the files from base theme – CSS, js, .tpl.php, overriden functions in template.php ● They don't share – theme-settings.php, logo, color, some of the settings specified in .info file
  • Sub-theming – how to ● Create new folder in the sites/*/themes folder, give it a name – eg. sites/all/themes/schoolinafrica ● Add .info file with basic values name, description,... ● Add “base theme = ninesixty” to .info file ● DONE Subtheming quick and dirty - http://drupal.org/node/441088
  • Useful tips ● DrupalContrib.org – http://drupalcontrib.org ● admin/settings/performance – CSS + js files optimization ● Base themes – Zen, Ninesixty, Genesis,... http://drupal.org/project/Themes
  • Useful tips ● Themer module – http://drupal.org/project/devel_themer ● Firebug – firefox extension - http://getfirebug.com/
  • Links ● Theming handbook d.o - Drupal 6 – http://drupal.org/theme-guide ● Drupal 6.x → 7.x guide – http://drupal.org/update/theme/6/7 ● Mailing list – http://drupal.org/mailing-lists ● Theme garden - http://themegarden.org ● IRC #drupal-themes
  • Q&A
  • Bye and thank you! Marek Sotak Developer, designer co-founder of atomic ant ltd web design company based in London, Prague and Denmark, operates internationaly. http://twitter.com/sotak http://facebook.com/sotak http://atomicant.co.uk
  • Credits ● Slide 4 by Medical Student on flickr ● Slide 44 - http://web.mac.com/moistproduction/flash/index.html ● Slide 61 - http://www.flickr.com/photos/wolfy/2647354470/ ● Website preview: http://letsbuildaschoolinafrica.org