How's everybody doing?
Sleepy 'cause it's after noon
and then you have lunch and you're all tired
and not retaining any knowledge?
This is going to be awesome!
My name's Tracy Levesque.
I'm from Philadelphia
(Cheers from Philly peeps in the audience)
Right! That's right!
I co-own a Web design and development company
called YIKES, Inc.
What I do personally is Iove creating themes for WordPress
I've been making websites since 1996
and working with WordPress since 2006
I would consider myself a Power User, right?
I'm in /wp-admin/ at least several times a day
I know pretty much everything you can do in there
I manage some content
I do a lot of WordPress administrative stuff
I install plugins and activate themes
so I would consider myself a Power User
I also know HTML, 'cause I'm a designer
I really love making themes for WordPress
so I have that skill set as well
HTML and CSS 'cause you have to know CSS
if you know HTML
I don't know PHP -- I really don't
I can, like, see kinda what's going on
and I can move things around and sorta follow it
but if you gave me a blank file
and said "do Hello World in PHP"
I'd be like "sorry"
So I imagine there's a bunch of folks in this room
that have similar skill sets
or maybe you've never even used WordPress yet.
We can do cool stuff for WordPress, too.
We can also use WordPress' more advanced functionality
That they're talking about in the room upstairs
and has also been mentioned down here as well
So, what I'm gonna do
is I'm going to go through a few key
WordPress development terms
that have been thrown around in this room and upstairs
and I going to explain what they are,
what they do and how you can take advantage of them as well
First off...The WordPress Template Hierarchy!
According to the Codex:
The translation of that is
Often times -- at least once -- on someone's slides
during a WordCamp, this chart that shows
exactly how this naming convention works shows up
It looks something like this
Oh my God, holy crap look at that!
It's like what?
It looks kinda complicated and overwhelming
and when I see it come up in a slide
people are like "woah"
But it's really pretty simple
You just follow along the chart
to see exactly what you need to name your template file
in order to have it apply to a certain kind of page
So in this example I m going to talk about
Category Archives, meaning that when you click on a post
and see the categories and you click on a category
and see that page of posts
So first I want to talk about template files
So when you have a theme
Like Twenty Twelve
Your theme is made up of all these PHP files
And some of these PHP files are template files
They are the files that determine how your content
is going to look on a page or post
It could be a part of the page
or it could control the entire page and how it's going to look
It's kinda like frames for your content, right?
Here on one side we have picture on left/words on right
That's what your template files do
They determine how the pages are going to lay out when they load
So these template files control the way different pages look
For instance, the main blog page, meaning the page you go to
When you see a list of all your posts, the default page for WordPress
A regular, plain old content page.
Archive pages - what an archive page is
Is when you have a post and you have
tags, categories or author or date
and you click on those those different parts of a post
and you see all posts related to that tag, category, etc.
That's called an archive page
And other pages as well they are all controlled
by template files
So going back to the WordPress Template Hierachy
How does that work?
Well, if I have a category called "kittens"
I just have a file named "category-kittens.php"
And if that file exists - when I click on that category archive
it's going to use that file.
If that file doesn't exist, it's going to look for "category.php"
That is the template file used to render all category pages
If that file doesn't exist then it's going to go to "archive.php"
That is the page for all archives
For tags, date, author, category...if it doesn't have
a file that applies to it it's going to use that file
And then, at the end of the road, is index.php
And that is the file used to display typically all your posts
Like your "blog" page
That's the end of the road in the Template Hierarchy
If no other no other file exists it's going to default to that one
So, in this example, I have plain old Twenty Twelve
I have some sample content in it
And here I have this one categorized as "kittens"
And this one I did make a "category-kittens.php"file
It uses the category slug
meaning if you look at your list of categories and it says "slug"
You can use "categories-[slug]" or you can use the category ID
So for that category I used this lovely template of awesome kittens
And then I also took off the sidebar
So that is my special template for that "kittens"category
If I click on "Dogs"it just uses the default "category.php"
Which is regular content/sidebar - everything's normal
So WordPress Template Hierarchy, how can we all use it?
Power Users, look for themes or theme frameworks
that allow you to create these template files
and apply special styles to or different layouts to
specific categories or tags or certain pages of a site.
There are theme frameworks that will allow you to do it without code
all drag-n-drop
And designers, just make them!
You should be using a theme that's meant to be changed or
a child theme of another theme that is not meant to be changed
but you can actually go in and just make these files yourself
and make your website look awesome
Next up is The Loop!
Codex says:
The Loop is really just a set of instructions that lives in a template file
that grabs content and displays in on a page
Or The Loop's kinda like making sandwiches
So when you assemble a sandwich you have a certain set of ingredients in a certain order in which you put them
And then you repeat the process, repeat the process until you have as many sandwiches as you need
It's called a "Loop" because you can repeat this loop more than once on a page
So in a WordPress loop there's the 2 main components
There's "Title" and "Content" for a page or post
They're like the slices of bread in our sandwich
And then there's additional content, aka "Metadata" which is like the ingredients in our sandwich
You can have author, date, featured image, categories or tags for posts, etc. etc.
There's a lot of additional information you can put in a page or post
When you are making sandwiches for people what if somebody's vegan
What if somebody wants wheat bread instead of white bread?
You can do this as well with your loop, you can have specific instructions as to what information is going to show in the loop
So you can say "only show posts from a certain category"
Or if a post has a certain tag add this style to it
Or if a post is tagged with a certain tag, don't show it at all
Here is an example of a custom loop we did for this movie blog site called "Movie Fanfare"
Instead of the usual layout we're using , for instance the featured image for every post
We're only showing tags, we're not showing categories
And we're using the Excerpt instead of the full content of the post
So this is a customized loop
So how everyone here can use it.
Power Users, same thing, use a theme or a theme framework that will allow you to modify your post page
And designers, just do it yourself. They WordPress Codex has a really great article called "The Loop in Action"
It'll show you how to modify the WordPress Loop
Custom Post Types!
We talked about Custom Post Types a lot in this room today
They're one of my favorite things about WordPress
The Codex says:
The translation is, you know how you have pages and posts, right?
Everybody familiar with Page and Posts?
Well you can actually make up your own
In addition to Pages and Posts you can make up your own post types
Page and Post are both Post Types
They're similar in that they have their own item in the Admin area
They have consistent input, meaning that when you when you enter a post
you have Title, Content, Tags, Categories, Excerpt...
You have these fields in the admin where it's consistent from one post to another
and you can choose to use as many as you want
And then they have, for the most part, a consistent output
You have template files that render page and posts a similar way every time
So you can really control how these things look and how they're entered
The information is cleaner
Instead of having a big content area you have these sections
So with Custom Post Types you can do the same thing
You can create a Custom Post Type, in addition to pages and posts, that follow the same rules
They have their own sets of fields, they're in the admin, they have their own little icon on the left hand side -- a cute little graphic for it
They're consistent, you can put information into fields
And then they render on the front of the site they are consistent there as well
You can make them look however you want with templates
So instead of just Pages and Posts you can have stuff like
Staff, Recipes, Products, Jobs...really anything that would benefit from having this consistent set of fields
that's easy to enter in all the data instead of a big content area
Also, along with Custom Posts Types, there are also Custom Taxonomies
All a taxonomy means is it's a way to group things together
WordPress by default has 2 taxonomies, categories and tags
They're a way to group information together - to group posts
With Custom Post Types you can also create these custom taxonomies
So let's say we has a post type called "Movies"
We could create custom taxonomies called Genre, Year, Director, Rating, etc.
The advantage to that is if you had a movie post you could then click on Genre, Year, Director, whatever
And see all of the posts related to that director, all with that rating
And then you could browse all of them in a list
An example of custom post types is we make a site for Static Guard
and we made them a site with 3 Custom Post Types: Products, Tips and Stylists
For the people who have to manage the site going forward, it's really easy
Instead of having to put everything into a big content area and hope that they format it correctly
We just made them a custom post type to enter in all the information in the back end
We made them a template that renders all the information in the way they want it to look
And then another nice thing about the custom taxonomies is that you can browse by the different taxonomies
We have Occasions and Seasons
And they can create these, add these and manage the navigation on the left-hand side
It's a really great way to make content management easy for site owners
How can you take advantage of Custom Post Types?
Power Users - There is a plugin made by Brad (WebDev Studios). He made a plugin that allows you to create Custom Post Types without code
You can just do everything visually in the admin and there are similar plugins
And themes that have Custom Post Types built into them where you can create them yourself
And designers, code your own - really! Really, you can code your own.
I have another talk all about custom post types for designers it's on wordpress.tv and you can check it out
With no PHP skills, well, very little, you can make Custom Post Types yourself
And it's really empowering and fun
I always say that WordPress makes me fancier than I really am
Here's the big one - Hooks, Actions and Filters
The Codex has a lot to say about Hooks, Actions and filters. I'm not going to read it all to your now.
But pretty much it says Hooks, Actions and Filters allow you to change WordPress functionality without breaking it
The #1 rule of WordPress development is never, ever, EVER change Core code ever!
Just don't do it
The great thing about WordPress is it allows you to tap in to it's existing functionality through hooks and then modify it
A hook is just a point at which WordPress allows you to tap into existing functionality and safely modify it
Some examples - WordPress does a lot of things, right?
It shows excerpts, you admin menus, custom post types, sidebars...
You have all these things, all these functions that happen when WordPress does its thing
Hooks are points at which WordPress allows you to make a function that hooks into that and changes it
There's two ways that you can change it
An Action is a hook that makes something new happen when it's triggered
For instance, let's say you want to add a little bit of content or a sharing button after every post
You can make a little function that says "when you show a post add this content after it"
That's an Action - something new is happening when WordPress functionality is triggered
Filters - a hook that modifies a WordPress function when it's triggered
Instead of making something new happen it modifies an existing function
For instance "excerpts" in WordPress are by default 55 words long
You can make a filter that says "instead of using 55 words I want you to show 75 words" or "I want you to show 30 words"
That's a filter, because you're changing functionality instead of making something new happen
This is now when I'm going to ask my friend Courtney to come up
I'm going to show you a visual illustration of Hooks, Actions and Filters
This is Courtney
Courtney: Hi
Ok, Courtney, so wave to everybody
Alright, so, waving is a typical function that human beings do, right?
Most people wave
Well, what if we put hook on her waving functionality?
So I wrote a little function that says "When you wave say Hello"
This is an Action - something new is happening in addition to the regular waving
Let's try it out, let's run this function
Courtney "Hello, Hello, Hello"
Awesome, my code worked
Alright this is an example of a filter - I am going to change her default wave
it says "When you wave wiggle your fingers"
Let's try it
Alright - yay! Thank you
Do you understand? Is it making sense?
Good, awesome - Hooks / Actions / Filters
Thank you, Courtney
What do Hooks, Actions and Filters do? They make WordPress awesome
They're the reason that WordPress is a fantastic way to build a website
Really, the sky's the limit with what you can do with WordPress because of Hooks, Actions and Filters
Power User, if you've ever used a plugin you're already using Hooks, Actions and Filters
Plugins hook into WordPress to do new things, additional things
Designers, you can just add functionality to your themes
There's a great article in the WordPress Codex on theme development
But really, if you do things like add sidebars, add menus, add post types you'll be taking advantage of Hooks, Actions and Filters
I have some resources: The WordPress Codex, I'm in there 50 times a day it feels
It has the best information on using this functionality and what it is and how to do it
There's also articles on more WordPress terminology than just the 4 I covered today
And then there's this really handy Custom Post Type Generator
It's web-based and you put all the information and then you hit a buttons and it creates all the code for you
And then there's a great article on WordPress theme frameworks for all you Power Users out there
To find different frameworks, what they can do and what they allow you to do without knowing code
And, that's the end
(Applause) Thank you!
Moderator: Very Cool, we've got time for some questions
You know everything you need to know now, right?
Audience member: Hi, I've always been puzzled about tags and categories. When would you use a tag, when would you use a category - when would you use one over the other
I guess there is some personal preference to it, but I use categories for major groupings of posts
I had a blog about a Green Building project that we did
And I had major categories like "building"or "insulation" -- major groupings of information
Tags I think more of keywords - terms that would bring your posts up in a search
Like "red" not something that is a major grouping of information, but more like keywords
If people were searching by keywords your posts would pop up
Does that make sense? Cool
Moderator: Anybody else?
Audience member: When you're setting up custom post types, say, like you had your example "recipes"
So you'd have name, ingredients, something like that
What's the next mechanism to get that to output? You have to make a template for that?
Tracy: You have to make a template, yes
Audience member: So you create a template just for that and then link those together
Tracy: Right, and if you even know just HTML it's not hard.
You can make little "if there is content in this field then show it"
And you can put all your nice html tags around it and style it all pretty and now you have a recipes page
And it uses the WordPress Template Hierarchy - that first thing we looked at
To show your Custom Post Types and Custom Taxonomies
That's in the mix as well
Audience Member: Hi thank you for giving us hope that you can do all this without knowing PHP number one
And number two you keep mentioning there's a plugin for this, there's a plugin for that, but you're not mentioning any plugins. Can you mention a few?
Tracy: Yes, well, all the slides are up on Slideshare and there I have a lot more words in the slides and I have lots of links to the different plugins
The one plugin by Brad, who's here, is called "Custom Post Types UI"
and that's how you can make a Custom Post Type in the WordPress admin
Without code
Audience member: I went through the learning curve of doing a website for the first time
and then I purchased some plugins and then I found out that in doing so
they can make your website less secure coud you speak to that?
Sure, just like Kathryn talked about earlier, you really have to vet the plugins that you're using
You look at the ratings, you see how often it's updated, how often support tickets are resolved, how many people have downloaded it...
That's a good way to vet a plugin
But still, even plugins that are well supported can still have security vaunerabilites
At that point you have to look to your hosting.
WPEngine are here today and they have really great security measures in place
They have plugins that they just don't allow you to use
So you can feel better that your site's going to be fast and it wont get hacked
Because they have a firewall in place for your website
You shouldn't load your website down with plugins, that could be true or not, the plugins could be great
You have to make sure you have a good hosting solution that provides an extra layer of safety
And then just keep on top of things
You can sign up for different WordPress twitter accounts, blogs or RSS feeds -
and the news gets out pretty quickly if there's a security vulnerability found in a plugin
So that's a good way to keep on top of those things
Moderator: One last question if anybody has one
Audience Member: Great talk. So the part I struggle with with Custom Post Types
Is in the admin section, how to make custom fields so my client for example has say a custom post type called "Testimonials"
And every time they have to add just like the author, or not like a big content piece but almost the size of an excerpt
Where do I begin to dabble in that so I can manipulate the admin area
Tracy: If you don't want to do it at the code level, or even if you do
there's really great tutorials out there that show you exactly how to style meta data in the admin for Custom Post Types
There's also a really great plugin called Advanced Custom Fields - it was mentioned earlier in the day
But that's a great plugin. So if you don't want to mess around with code and figure out how to render your metadata in your Custom Post types, use that plugin
It has awesome things like date pickers - it has a really nice interface
And it allows you to pretty much drag-and-drop add these meta data fields - that's a good way to go
Audience Member: Great talk, thank you very much I appreciate it
Other than Brad's plugin which I am familiar with which is great
There's a fantastic set or package of plugins which you don't have to fool with PHP
Called WP Type and Views including forms and everything
They're even working on Hooks and Filters without having to mess with any PHP whatsoever
It's pretty cool you can build listing sites with them
Your own themes using it without knowing any PHP
I just wanted to put that out there
It's called Types and Views and they're doing a fabulous job on the development of it
It's pretty cool
It's a plugin
Moderator: Another huge round of applause. Thank you very much, Tracy