Don't "Just paste this code in your functions.php"

“Just paste this code in your
functions.php”

Rick Radko WordCamp Toronto
r3df.com November 5th, 2011

Slides

Slides will be posted:
 http://www.slideshare.net/r3df

© 2011 Rick Radko, r3df.com 1

Who am I?

I’m
 Rick Radko

 Developer, coder and web designer

 WordPress enthusiast


Who are you?


“Just paste this code in your functions.php”


Automatic theme updates


Oh-oh!


Does it change your theme?

Non-Theme related changes
 Like buttons, thickbox effects, fancy jQuery effects
and addons
 Custom taxonomies, custom post types, at least
partially.

 These changes should be theme independent.

 Changes get lost in functions.php theme items.


Don’t do it!

“Just paste this code in your
functions.php”


Then where?

Child theme
 All theme related changes.
 Changes that should go away if theme changes.

Personal “Site” plugin
 All other additions/changes.
 Changes that should stay even if theme changes.

*“Site” from Otto: http://ottopress.com/2011/creating-a-site-specific-snippets-plugin


Child themes

How do they work?

 Child themes inherit all the features of their parent
theme.

 Child themes override their parent theme by
providing alternate code/files.

 If it’s not present in child, WordPress looks in the
parent theme.

Minimal child theme

What do you need for a minimal child theme?

 A theme folder.

 A file called style.css, with a specific header, and
usually one line of code.

 Not required for a child theme, but a functions.php
will be needed to add php snippets.


Creating a child theme

Lots of ways to create the theme content, here are
a few:
 Text editor and ftp the files into place

 Local development environment and ftp
 Tomorrow’s workshops

 Site hosting’s filemanager and editor
 Common and simple


cPanel


File manager


Create the child theme folder

Create a new folder in /wp-content/themes.


New child-theme folder


Creating a style.css

Create style.css in the theme folder.


The style.css file


Absolute minimum style.css


The new child theme

Now you have a new theme!


The new theme, not quite right

Child Theme

Twenty Eleven


Practical style.css

A style.css that will work a little better:


Child theme activated


Now, it’s the same as the parent


Creating a functions.php

Create functions.php in the theme folder.


Edit the functions.php


Minimum functions.php


It’s done!

We now have a child theme that:
 Looks exactly the same as it’s parent.

 Will maintain updates/changes to it’s:
 style.css
 functions.php
 any other theme file that you want to add
without fear of having them overwritten!


“Grandchild” issues

You cannot make a child theme of a child theme!

 Use a site plugin.


Site plugins

What do you need for a minimal plugin?

 Only a single php file, of any name.

 Plugin defining header in the file.

 Not required for a plugin, but a folder keeps things
neater, especially if you want to include css and js
files.


Creating a site plugin

Go to file manager again


Creating the plugin folder


The new site-plugin folder


Create a site-plugin.php file


The site-plugin.php file


Minimum plugin file


The new plugin


Practical plugin file


Activated final plugin

activate


It’s done!

We now have a complete plugin that:
 Stores code without direct impact from updates.

 Can be extended
 Inject css and javascript files
 Add options pages in admin

 Is portable
 Easily move from one site to another carrying all
your favorite changes.

Timing issues

 Plugins load before themes.
 For most snippets that are hooked to an action
this is not an issue, as the action dictates when
the code runs.
 Occasionally there are issues with code that is not
hooked to an action, so the code snippet in the
plugin may run too early and not work.
 Hook the code to an appropriate action with
add_action().
codex.wordpress.org/Plugin_API/Action_Reference


Extras – Theme thumbnail

Image for theme thumbnail:

 Create an image in png format.

 About 300x225px.

 Save as “screenshot.png” in the theme folder.

 Will be loaded automatically.


Extras – Split loading

Split loading
 admin/front/both
 is_admin()
/* Code needed by both admin and front here*/

if ( is_admin() ) {
/* code for admin only here*/

} else {
/* code for front only here*/

}

Extras – Loading css and javascript

Loading css and scripts

Use actions
 wp_print_styles for css

 wp_enqueue_scripts for scripts

See the codex for more detail


Key Points

Main theme functions.php is:
 Not the best place to put code snippets.
 Overwritten by automatic updates.
 Not used if theme changes.

Some snippets are not theme related.
 Should have a place that is theme independent to
store them.


Key Points: Child Themes

Child themes for theme related changes
 They are easy to create:
 Can be really simple, only what you need.
 Minimum is a folder and style.css.
 Probably will need a functions.php.

 Create once per theme.

 Once it’s set-up, just paste in your snippets.


Key Points: Personal Plugins

Personal plugin for all other additions/changes:
 Also easy to create:
 Can be really simple or quite complex
 Minimum is a plugin php file
 Folder helps keep things organized

 Set-up once per site
 copy across sites!

 Once it’s set-up, just paste in your snippets.

Contact

Rick Radko
 email: wpinfo@r3df.com
 twitter: @r3designforge

Slides at:
 www.slideshare.net/r3df

Code at:
 r3df.com/downloads


Don't "Just paste this code in your functions.php"

Empfohlen

Empfohlen

Weitere ähnliche Inhalte

Andere mochten auch

Andere mochten auch (19)

Mehr von R-Cubed Design Forge

Mehr von R-Cubed Design Forge (20)

Kürzlich hochgeladen

Kürzlich hochgeladen (20)

Don't "Just paste this code in your functions.php"