what you should be utilising in the twenty ten functions.php
DESCRIPTION
The slides from my talk at WordCamp Melbourne. Code for the demo theme available here: http://www.sennza.com.au/demo.zipTRANSCRIPT
What you should be utilising in the Twenty Ten functions.php
A.k.a Pimp my theme!
By Bronson Quick
sennza | (07) 3040-1545 | [email protected] | http://www.sennza.com.au/ | Twitter: @sennza
Who Am I?
I contain these $args:
• I live in sunny (floody) Brisbane!
• I’m a partner @sennza http://www.sennza.com.au/
• Have been a geek for about 12 years...crap...I’m old!
• Have used many other CMS in the past...e.g. Joomla, Modx and loads of proprietary CMS
• Co – organizer of the WordPress Brisbane & WordPress Sydney Meetups http://www.wpbrisbane.com.au/ & http://www.wpsydney.com.au/
• Possible/probably/more then likely a co-organizer for WordCamp Gold Coast in late 2011
• Tweet us @sennza – Cool links and occasional blog posts
• Tweet me @bronsonquick – Committing acts of random and bad taste humour...especially during all night coding sessions
rethink | redesign | results Slide 2 of 20
I’m an infatuated WordPress geek
What we’ll cover
We’ll cover:
• What functions.php is and how you can use it in your themes
• add_editor_style();
• Post Formats (Yeah Baby!)
• Post Thumbnails - a.k.a How to save the ‘How do I size a photo’ calls from clients!
• register_nav_menus();
• add_custom_background();
• register_default_headers();
• register_sidebar(); - Get yo’ widget on!
• Questions & Answers
• And den?? NO AND DEN!
rethink | redesign | results Slide 3 of 20
A handful of functions in the functions.php file of the Twenty Ten theme
Functions.php
What is functions.php?
• This file acts like a plugin
• You can add it to any theme
• Loads automatically
• Think about what you’re using and whether it should be in functions.php or a plugin
• If it’s better off being a plugin then maybe it should live in the wp-content/mu-plugins folder?
http://codex.wordpress.org/Theme_Development#Functions_File
http://justintadlock.com/archives/2011/02/02/creating-a-custom-functions-plugin-for-end-users
rethink | redesign | results Slide 4 of 20
A quick recap for those new to WordPress themes
2010 Functions.php
Why bother?
• Well documented
• Lots of tricks and code to refer back to for new projects
• Starkers (Might take a little while for Elliot Jay Stocks to update for 3.1)
http://starkerstheme.com/
rethink | redesign | results Slide 5 of 20
Have you had a read through it?
add_editor_style();
What you need:
And create an editor-style.css with some CSS basic styles in it.
rethink | redesign | results Slide 6 of 20
Add some styles to TinyMCE
add_editor_style();
rethink | redesign | results Slide 7 of 20
Add some styles to TinyMCE
add_theme_support( 'post-formats', array( 'aside', 'gallery' ) );
New and exciting! Supports the following:
• aside
• gallery
• link
• image
• quote
• status
• video
• audio
• chat
http://starkerstheme.com/
rethink | redesign | results Slide 8 of 20
Gorgeousness in 3.1
add_theme_support( 'post-formats', array( 'aside', 'gallery' ) );
rethink | redesign | results Slide 9 of 20
Gorgeousness in 3.1
add_theme_support( 'post-formats', array( 'aside', 'gallery' ) );
rethink | redesign | results Slide 10 of 20
What happens on the frontend
Style it up for your client!
Add icons, change the colour, add an icon...use your imagination!
add_theme_support( 'post-formats', array( 'aside', 'gallery' ) );
rethink | redesign | results Slide 11 of 20
Example
http://31.sennzademo.com/
register_nav_menus();
What’s it do?
• Registers navigation menu positions!
• Ditch your text widgets in the footer!register_nav_menus( array(‘primary' => __( 'Primary Navigation', 'twentyten' ),'secondary' => __( 'Secondary Navigation', 'twentyten' ), );
Then in footer.php add:
<?php wp_nav_menu( array( 'container_class' => 'menu-footer', 'theme_location' => 'secondary' ) ); ?>
http://codex.wordpress.org/Function_Reference/register_nav_menus
rethink | redesign | results Slide 12 of 20
Don’t just use one menu. Be creative!
add_custom_background();
rethink | redesign | results Slide 13 of 20
Give your client some control
register_default_headers();
rethink | redesign | results Slide 14 of 20
Variable logos, quarterly promos, think outside the box!
register_default_headers();
rethink | redesign | results Slide 15 of 20
Variable logos, quarterly promos, think outside the box!
register_sidebar();
What’s it do?
• Registers widget areas!
• Add widgets into your theme to give you client more control. Think of places your client might want to put a promo image, advertisements and more!
• The code for functions.php:register_sidebar( array('name' => __( ‘Cool Widget Area', 'twentyten' ),'id' => ‘cool-widget-area‘,'description' => __( 'The cool widget area', 'twentyten' ),'before_widget' => '<li id="%1$s" class="widget-container %2$s">','after_widget' => '</li>','before_title' => '<h3 class="widget-title">','after_title' => '</h3>',) );
http://codex.wordpress.org/Function_Reference/register_sidebar
rethink | redesign | results Slide 16 of 20
Widget the World Watcher!
register_sidebar();
The code for your theme:<?php if ( is_active_sidebar( ‘cool-widget-area' ) ) : ?>
<div id=“cool" class="widget-area">
<ul class="xoxo">
<?php dynamic_sidebar( ‘cool-widget-area' ); ?>
</ul>
</div><!-- #cool .widget-area -->
<?php endif; ?>
http://codex.wordpress.org/Function_Reference/register_sidebar
rethink | redesign | results Slide 17 of 20
Widget the World Watcher!
register_sidebar();
The results:
rethink | redesign | results Slide 18 of 20
Widget the World Watcher!
Thanks & Questions
rethink | redesign | results Slide 19 of 20
Meetup groups
The Brisbane WordPress Meetup Group
http://www.wpbrisbane.com.au/
The Sydney WordPress Meetup Group
http://www.wpsydney.com.au/
@sennza
@bronsonquick
[email protected]://www.sennza.com.au/Twitter: @sennza
rethink | redesign | results