Wordcamp 2010 presentation

WORDPRESS TEMPLATE DESIGN & THEME FRAMEWORKS Jonny Allbut Freelance Crea1ve www.jonnya.net www.twi7er.com/jonnyauk

WORDPRESS -‐ THE ULTIMATE CMS ๏ WordPress as a CMS • Over 10 years working with web • Nearly 6 years as primary CMS ๏ Ease of customisa1on • Theme system • Plugin architecture ๏ Content management facili1es • Custom post types • Taxonomy • User management • Admin area

WORDPRESS V.3 EVOLUTION TO TRUE CMS AND DESIGN PLATFORM

WORDPRESS 3.0 CHANGES EVERYTHING! ๏ get_template_part ๏ Custom post types ๏ New template ﬁles ๏ Custom menu builder ๏ Custom header and background API’s ๏ comment_form()

THE POWER OF TEMPLATE PARTS <?php get_template_part( 'loop', 'index' ); ?>

THE POWER OF TEMPLATE PARTS <?php get_template_part( 'loop', 'index' ); ?> ๏ loop.php

THE POWER OF TEMPLATE PARTS <?php get_template_part( 'loop', 'index' ); ?> ๏ loop-‐index.php

THEME BASICS

WHICH TEMPLATE FILE GETS USED? ๏ h7p://codex.wordpress.org/Template_Hierarchy • Understand the ‘cascade’ -‐ eg category display 1. category-‐x.php 2. category.php 3. archive.php 4. index.php ๏ Custom page templates <?php /* Template Name: My special page */ ?>

LOCATION TESTS ๏ h7p://codex.wordpress.org/Condi1onal_Tags • is_category() • is_page(‘about-‐us’) • is_single(array(17,'my-‐news-‐ar1cle','My News Ar1cle')) <?php if (is_page(‘about-us’)){ echo ‘<h2 class=”highlight”>’. get_the_title . ‘</h2>’; } else { echo ‘<h2> . get_the_title . ‘</h2>’; } ?> • if (is_single() || is_page()) { }

THE ROLE OF FUNCTIONS.PHP ๏ func1ons.php ๏ Code that always executes ๏ Simple/advanced ๏ Portability of theme

THEME DEVELOPMENT PRIOR TO FRAMEWORK WORKFLOW

NON-‐FRAMEWORK WORKFLOW ๏ Grid system ๏ Boilerplate theme ๏ Code toolbox ๏ Includes ๏ LOTS of condi1onal statements ๏ Lots of page templates/complex code

NON-‐FRAMEWORK WORKFLOW LONG-‐TERM ISSUES ๏ Development dejavu? ๏ Aggghhh, Updates!

PARENT/CHILD THEMES

PARENT AND CHILD THEMES ๏ Child theme inherits parent theme func1onality ๏ Child theme overrides parent theme elements if have same ﬁlename

PARENT/CHILD THEME EXAMPLE PARENT THEME CHILD THEME ๏ header.php ๏ header.php ๏ index.php ๏ style.css ๏ sidebar.php ๏ footer.php ๏ comments.php ๏ style.css

STOP HACKING THEMES DANG IT!

CHILD THEME STYLE.CSS <?php /* Theme Name: My Super Child Theme Theme URI: http://jonnya.net/ Description: My child theme Author: Jonnya Freelance Creative Author URI: http: //jonnya.net Template: wonderflux Version: 0.1 */ ?>

INTRODUCING THE THEME FRAMEWORK PRIVATE BETA OPEN EXCLUSIVELY TO WORDCAMPUK DELEGATES THIS WEEKEND!

WHY CONSIDER WONDERFLUX? ๏ Wri7en exclusively for WordPress 3.0 ๏ Unique layout system ๏ LOTS of ﬁlters and hooks ๏ Powerful use of get_template_part ๏ GPL v2 -‐ like WordPress

WHY PARTICIPATE IN THE WONDERFLUX BETA? ๏ Wri7en with the community in mind ๏ Encouraging best coding prac1ce ๏ We love your feedback! ๏ We love WP!!

APPLY FOR THE PRIVATE BETA

Wordcamp 2010 presentation

by Jonny Allbut

Accessibility

Categories

Upload Details

Usage Rights

1 Embed 29

Statistics

Wordcamp 2010 presentation Presentation Transcript