A lot of people have been asking me to explain some of the new features in WordPress 2.7 – the main ones are the admin Interface and some of the new, movable widget-like items in the post menu and on the dashboard. But, it’s hard to talk about visual changes when, to be honest, you can’t see them. Enjoy this >5 minute screencast on some of the new features included in WordPress 2.7.
Starting with the design concept, we took our WordPress theme from a .psd file to an .html file. Then we started laying the groundwork by commenting and slicing apart the .html file we created into the various .php files.
So, what do those various .php files really do? And what should go in each one? That’s where will shift our focus as we take a look at the beginning of any good WordPress theme, the header.php.
The header, by nature, will be the first file you call in your WordPress theme. Typically, it will contain one or more of the following elements:
The Doctype information should have been automatically included when you started your new Dreamweaver file back in step 2, so that’s pretty self explanatory.
When it comes to your meta information, you want to make sure a few things are covered. As good practice for SEO, make sure your title has good keywords (You can use <?php bloginfo(‘name’); ?> if you want – just make sure that your blog name has those keywords included). The codex also explains how you can set different
Your description is next. If you want to use the description you declared inside of WordPress, use <?php bloginfo(‘description’); ?>. Once again, make sure you make great use of those keywords!
And finally, your keywords (yes, I know I’ve talked about keywords quite a bit – can you sense a trend?) should only be the keywords that best describe your site. Only use a few of them, and don’t pad the ones in you know won’t describe your content – Google doesn’t like that.
Your RSS Feeds are next. Yes, I said feeds, but if you only have one, that’s fine. At least call your WordPress feed in the header:
<link rel=“alternate” type=“application/rss+xml” title=“<?php wp_bloginfo(‘name’); ?>” href=“<?php wp_bloginfo(‘rss2_url’); ?>” />
The relevance of the link, the type (RSS+XML), the title, and the URL. This puts that nice little RSS icon in your Firefox toolbar also (but don’t forget to actually link to it in your blog!)
Next you should link to your CSS stylesheets. This should be taken care of inside of Dreamweaver, but if you want to release the theme for the public, you can use “<?php wp_bloginfo(‘url’); ?>/wp-content/themes/THEMENAME/style.css”. In fact, use this anyway – it’s a great way to get it right no matter what! (are you seeing a trend in not hardcoding your theme links? Makes it easy to port to other sites.)
Any JavaScript you need to use can go after the CSS stylesheets. But then again, if you’re using JavaScript, you know that already.
Finally, have <?wp head(); ?> right before your </head> tag. It’s called a “hook”, and it does just what it sounds like: lets functions and plug-ins that are called in the header do their thing. A lot of plug-ins use this, so make sure it’s there.
Now, here’s where the gray area comes into play. You’ve ended your head tag and started your body tag. Should you include anything else in your header? Well, ask yourself this question: are there elements (such as the navigation, logo, and other such items) that you want to be able to show on every page? If the answer is yes (and it pretty much always is with those elements) then go ahead and put them in. Usually you want to stop the header RIGHT BEFORE your content div starts.
Sounds like a lot of elements, but having a great theme means taking care of all of the geeky stuff beforehand. That all taken care of, you can let the rest of your theme really shine out.
Next time we’ll talk about the footer.php, the possibility of “footer widgets”, and what other goodness you should include.
I spent days (literally) looking for a good lifestreaming plugin for WordPress to showcase some of the exploits that I have my hand in on a daily basis (videos, twitter, pictures, etc). The ones I found had certain features that I liked, but none of them really LOOKED (format-wise) how I wanted it to.
Enter Friendfeed. They have a slick looking widget/badge you can embed on a site to display the items that are broadcast to your Friendfeed. BUT, in the initial code, you can’t make it do everything you want.
With some fun hacking, I’ve got the FriendFeed widget doing what I want. So, if you want a great, easy way to show your lifestream, here’s the 4-1-1:
That’s all well an good, but it’s only showing 10 entries and it looks weird. Change the “num=10” to something bigger like “num=100” Also, make sure to add a special div to your script – you want to be able to target CSS to customize it; might as well give it a canvas hook to work with! You can also delete the <noscript> section too.
and
and delete it (those lines included). Copy your final script, which should look something like this:
and paste it where those php calls were. Make sure you also include the code to create a page template in WordPress:
at the top of the page. Save your changes.
Here’s the UStream file of my first session that happened at BarCampMemphis. The second session lost the stream, and (therefore) my recording was cut. Sorry!
Free video streaming by Ustream
And here are the slideshows:
Dave Barger graciously invited me to speak at Memphis’ BarCamp, so I will be making the voyage from Nashvegas to Graceland tomorrow. Not sure what the plans are for tomorrow night, but Saturday’s going to be an action packed day. I’ll be speaking on blogging 101 (specifically with WordPress) and then doing an advanced tactics session for WordPress, so all you junkies be ready to get your WordPress fix!
And, as always, my slides are available (or at least in some form or fashion) right now on SlideShare!
I got the awesome news today via email:
We recently added your site to Alltop (http://wordpress.alltop.com/). Alltop is an “online magazine rack” that aggregates RSS feeds about popular topics.
If you don’t know what Alltop is, it was created by Guy Kawasaki to aggregate the “egos” of certain topics (Fashion, WordPress, Venture Capitalists, etc). Your site gets reviewed before it is included, and upon inclusion gets aggregated onto a page that works like, well, a magazine rack! Makes it really easy to find great posts on whatever topic you want.
And, lo and behold, there I am! Right in the middle on the bottom of the list (i cut a lot of them out in the picture above, hence the double lines). That, and I wanted to be near Lorelle and Matt themselves – what can I say, right?
Post them here! I’ll put mine up live.
WP-Supercache – cache your site to be digg-protected and avoid traffic spikes.
Increased Sociability – Catches Digg and StumbleUpon users and gives them a call to action.
Well, after twittering off my question on whether I should separate my blog into business/personal or mix them, I have come up with a wonderful compromise.
I’m going to create a WordPress blog (big surprise, eh?) that will house my personal posts. I’ll try to cross promote and cross-link them to be able to get some sort of traffic going, but I want people to know that I have other things going on besides just design, and I have lots of things to talk about – I just don’t want them mixed thoroughly with either.
So, I’ll have a new blog up and running soon. Don’t know when, but I’m sure it’ll be soon.
So, after doing some research on my part, I realized that I was doing my commenters a huge disservice by allowing WordPress to put the dreaded rel=”nofollow” into every hyperlink. Well, no longer!
I installed the DOFOLLOW WordPress plugin. I checked my grade on the Website Grader and I have a PageRank of 4. That means that anyone with a PageRank less than me benefits when they post a comment on this page (that is relevant).
So, I’m opening up my doors to you. Along with the DOFOLLOW policy, I’m also instituting a “You Comment – I Comment” Policy for anyone who leaves a relevant comment with a legitimate website. I am all about sharing some linklove, and it’s high time we got something out of it!
I’ve been playing around with some really cool features in WordPress lately. With my site, and a few others i’ve been working on, I’ve been toying with the “Page Template” feature that allows me to customize which elements show up on a page (like, a sidebar, specific headers, a footer, etc). But, while working specifically on The Film Talk for Jett Loe, I developed/discovered a technique for keeping visitors in your page but giving them the luxury of a Google Search.
