In this article we have collected 45 fresh WordPress tutorials and techniques, with some hacks, guides and best practices thrown in for good measure. Everyone, not just developers, should take something from this round-up.
The growth and popularity of WordPress continues to spiral to a seemingly endless end. It continually proves itself time time and again that it has very few limitations, and is rapidly pushing itself to being, if not the best, but certainly the most versatile CMS available. Out of the box it is certainly not perfect, but in the hands of the huge WP community, it might just be.
Complete Theme Design Tutorials
In detailed 11 individual lessons this tutorial will show you how to build a powerful, up-to-date, SEO friendly WordPress theme from scratch. At the end of the tutorial, with code in hand, you’ll be able to do almost anything you want. You can even think of the finished Theme as your own personal website development framework for WordPress.
How To Create a WordPress Theme: The Ultimate WordPress Theme Tutorial »
In this Tutorial, you’ll learn how to build a Custom homepage for your WordPress Theme using Page Templates: Complete with a featured content slider, and customizable Widgets.
Custom WordPress Homepage with Customizable Widgets »
This tut shows the process of how to build a custom WordPress theme, from design concept through to completed theme. You will see how the static design is split up into the various WordPress theme files, and discover how the simple PHP snippets can add that dynamic functionality of a blog.
How to Build a Custom WordPress Theme from Scratch »
The tutorial series “WordPress Theme from Scratch” teaches you how to build a WordPress theme, starting with the initial design in Photoshop, converting it to HTML and finally splitting everything into the various WP theme files.
WordPress Theme from Scratch »
Any good website owner knows that they need to be constantly looking at ways to improve their site even through small little tweaks. If you’re using WordPress you’ll notice that it isn’t easy to create a development version without creating a separate installation. Of course, you can make changes directly on a live WordPress site but that isn’t recommended for anything other than minor tweaks.
With the help of an excellent plugin for WordPress called Theme switch and preview, this tutorial will allow you to easily switch between the live site and development versions using two different themes on the same installation of WordPress.
Creating a clean and minimal design can be a difficult thing to master – if you make things too minimal you can end up with a very bare looking design that lacks substance. However, if you can get the balance right you’ll have a design that looks both classy and professional.
This tutorial demonstrates that you don’t need to use lots of fancy effects and fonts to create a clean design – it can still look professional without overdoing things.
Begginer WordPress Tutorials
Your New WordPress Website Step By Step. Beginner's Guide
First of all and when starting on a website, you should understand that WordPress is not just some place where you can post just any kind of updates. This is an amazing content management system that can be used to create any type of website of any complexity. What you usually see online is the 10% usage of the WordPress functionality and capabilities while most possibly you’ll be using only 5% if you just plan to post news from time to time.
Your New WordPress Website Step By Step. Beginner's Guide »
WordPress’s popularity and usefulness as a multi-purpose content management system, continues to grow, and the more people flock to using this CMS the more an understanding of some of the basics of how it operates becomes necessary.
Technically you only need two files for a WordPress theme to work, index.php and style.css.
However, if you would like to make your theme a bit more unique and have some variance in the way different content is presented, you will want to use some other template pages. Now this is where the hierarchy comes into play, because WordPress runs off a Template Hierarchy.
WordPress Template Hierarchy and Conditional Comments »
In this article they discuss the key points you need to cross off, if you wish to setup your own design site. They discuss finding your design sites niche, which plug-ins are the best to use and how to setup your brand image.
The Essential Elements of your First WordPress Design Site »
General WordPress Tutorials
Do you have a bunch of different areas you wish to declare as a widgetized area? Save repetative code by creating a quick array of their names, then loop through that array calling the register_sidebar() function on each one.
Declare Multiple Widgetized Areas »
It seems that once a post has served its initial use for us, that we carelessly discard it to the forgotten areas for the post to die, rather than institute an accessible archive that will allow those past posts to continue to deliver the punch you packed within.
In this post, they offer some great pointers on creating a quality archive section for your blog that will serve as an inspired homage to the awesome content that it contains.
Creating Helpful and Effective WordPress Archives »
It’s common to find an author’s credit and bio at the end of a blog post, especially on blogs that post content from multiple writers. Using a cocktail of WordPress template tags, an info section can be easily put together to showcase the author’s Gravatar profile image, their name, link to their website and short bio.
How to Create an Author Info Section in WordPress »
An events list is just what you would expect; a list of upcoming events, ordered by the date they are taking place on (Not the date they were written on!).
In this post, you are going to create our own events list that will let us add events simply by writing posts and assigning them to an “Events” category.
How To Make a WordPress Events List »
The query_posts command is one of the most useful in all of WordPress. It is this command that allows all the content to be queried (extracted from the database) and then displayed by the loop. It's powerful because it gives an incredibly flexible method for retrieving and filtering the posts and pages in pretty much any way you can imagine.
At its most basic you can use query_posts to grab just the single latest post, or to get the latest 100 posts. At its most complex you could select a random collection of the posts that a specific blog author has posted in a collection of site categories with a specific tag
WordPress query_posts Tips »
What you will do first is create a custom comment callback that allows you to specify the way the comments are output, then lay out the structure for the comment list and reply form, add extra functionality such as author-only styles, implement comment subscription options and spam protection, and, finally, we’ll add nice CSS styling to everything we’ve done.
Advanced WordPress Comment Styles and Tricks »
The first part of this tutorial shows a unique method for displaying tabular data, by cooking up a simple CMS using a little PHP, jQuery, HTML and Google Spreadsheets. The second part explains how it can be integrated into WordPress.
There are a lot of plugins you could use to show random posts, but why use plugins when it’s so simple to do it with just a little bit of coding. Here is how to do it.
Do you ever wished to be able to list your top contributors without using a plugin? Simply paste this code where you want your top contributors to be displayed.
Show Your Top Contributors Without a Plugin »
By adding a small piece of code to a plug-in, and by following these basic steps you should be able to get your categories highlighted when on a single post.
Highlight WordPress Category when on a Single Post »
WordPress is a great CMS, but implementing some features within your theme can require a little lateral thinking. The content for your page or post is usually output by the theme code using a single function call: the_content(args);
But what if you need to split the content into two or more blocks? That might be necessary if your theme requires multiple columns or sections on the page.
How to Split WordPress Content Into Two or More Columns »
Since WordPress 2.5, Shortcodes has proven to be a powerful features that allows for flexibility and customization. However, as with anything that has the word “code” in it, shortcodes are not very user friendly. For people who are used to using WYSIWYG, shortcode usage can be confusing sometimes. This article shows you how to make shortcodes in your themes and plugins more accessible and user friendly.
This article covers the WP topics: multiple column content techniques and associating pages with post content; discusses how to use the “More”-tag, hide standalone categories from the category list and retain the page layout for post views within a category page.
Advanced Power Tips for WordPress Template Developers »
When designing WordPress themes, it can be helpful to add some custom functions to the theme’s functions.php file. This speeds up development time because you won’t have to hunt for and individually copy the same slew of functions for every theme. Just drop in a copy of this functions.php template and build up from there. This takes care of all those little things that always need to be done.
WordPress functions.php Template with 15 Essential Custom Functions »
Custom fields are really flexible. However, they’re not perfectly user-friendly. For instance, if no post or page is currently using a custom field that you’ve built functionality on, the user has to enter the name as well as the value of the field the first time it’s used. The drop-down of field names is dynamically gathered from the fields currently in use. Also, sometimes you want to make things easier for clients by having inline tips, and inputs that suit the field (e.g. a checkbox or select drop-down instead of just a plain text entry).
Control your own WordPress Custom Fields »
And this tutorial you will be shown how you can implement Ajax in your WordPress themes.
How to implement Ajax in WordPress Themes »
AJAX is used in many WordPress themes and plugins. However, not all of those themes and plugins implement AJAX properly. This article reveals 5 best practices in developing AJAX for WordPress.
Dynamic jQuery Feature Post Slider For WordPress
What this slider does is dynamically display posts from the ‘Featured’ category, using the easySlider jQuery plugin. It’s fairly easy to do, and adds a nice animated and dynamic feature to your site.
Dynamic jQuery Feature Post Slider For WordPress »
Images and Thumbnail Tutorials
Let’s say you want to show thumbnails in your blog’s front page. A lot of blogs do that now and it’s a good way of making the page look more alive.
The only problem though is that using custom fields can be complicated and time-wasting. This post will show you how to make your theme generate thumbnails automatically, based on your post’s first image.
Automatic WordPress Thumbnail Without Custom Field »
In this tutorial, you will be shown how you can easily add thumbnails, lead image, and other extras to individual posts in WordPress. These images can be shown on the front page, archives, search pages, etc – but appear outside of the content, giving you full control of their placement and style.
Add Thumbnails to WordPress with Custom Fields »
One of the best ways to liven up a blog, and something that most of the premium themes look to do by default, is adding images to your posts. The usual method of doing this is by adding the image URL via a custom field. But there is a better and more flexible way.
When you upload images in your post they are all added to the database. This makes it very easy to get a list of all the images attached to the post. In addition, WordPress has a built in function to retrieve the appropriate image size as well, meaning you can use a thumbnail on archive pages and a medium image on post pages without messing around with resizing images and adding multiple custom fields.
This script will replace the uploaded image (if bigger than the larger size defined in your settings) by the large image generated by WordPress to save space in your server, and save bandwidth if you link a thumbnail to the original image, like when a lightbox plugin is used.
How to Automatically Use Resized Images Instead of Originals »
Custom Post Layout and Styling Tutorials
This article features two functionial solutions to apply unique CSS styling to an individual page of content
Custom CSS Per Post’/>
With WordPress 2.7 came the post_class function. While this is a fantastic function for changing a post’s display, the classes that it outputs are actually quite limited. Luckily, we can add our own, and we can also add our own dynamic classes.
Styling Different Posts in Different Ways With Post_Class »
Sometimes, a specific post needs to be styled with some custom css styles. Sure, you can directly embed CSS in your post, but that not very clean. In this tutorial, you are going to be shown you how to embed CSS in a clean way, by using a custom field.
How to: Embed CSS in your posts with a custom field »
Here are two ways to include HTML5 elements in your WordPress post content without WordPress’ wpautop function wrapping them in p tags or littering your code with line breaks.
Using HTML5 Elements in WordPress Post Content »
In version 3.0 the developers of WordPress introduce the custom post types. I’m not sure whether it’ll be solely built into the API or also displayed as a GUI somewhere in the settings, but it doesn’t require too much coding skills to add a couple via your functions.php.
Custom Post Types in WordPress 3.0 »
WordPress Navigation Tutorials
In this tutorial you will learn how to enhance you WordPress in a whole new way. Multi-Level or Multi-Dimensional navigation menus can offer your theme and users 2 new things. One, add a nice new type of effect to enhance your theme. Two, allow the users to find things more easily. You will start off by making a HTML version, then making it compatible with WordPress.
jQuery Dropdown Navigation in WordPress »
Making your paginated content in WordPress load using AJAX is extremely easy using a bit of jQuery. Here is how.
Yes, there are many plugins for breadcrumbs, but if you would prefer to use short code snippets, have a look at this tutorial.
WordPress Breadcrumbs Without a Plugin »
WordPress Custom Fonts Tutorials
In this tutorial you will find the simple steps required to integrate Cufón in your WordPress site.
The fonts type that can be used for Safari, Chrome and Firefox3.1+ are .ttf(True Type Font) and .otf(open type font). Both support the @font-face rule that allows stylesheet to point to a .ttf or .otf on server. After declaring the @font-face rule, reference the required font-family property in your stylesheet as outlined here.
WordPress Admin Tutorials
In this tutorial you'll go through the entire process of creating an admin options panel for a WordPress theme, using the excellent WooFramework as an example. You’ll then take things a step further, as you implement jQuery to improve some of the functionality.
How to Create a WordPress Options Panel »
Hopefully, you have some experience working directly with the database, but even if you’re new to it, the simple recipes presented in this DiW article will help you find, replace, and delete specific text content using a few simple SQL commands. This gives you incredible power to make sitewide changes to your posts, comments, or any other database table with a few simple clicks.
Remove/Replace Content from the WordPress Database »
WordPress login logo looks nice, but sometimes you may want to change it, for example when building a site for a client. In that case, you can use a plugin, or simply take advantage of this cool hack.
Customize WordPress Login Logo without a Plugin »
WordPress 3.0 New Features
WordPress 3.0 is scheduled to be released within the nextcouple of monthss. There are some great new features coming, including custom post types, a new default theme, and a menu manager. Read this article to find out what to expect in version three.
10 Features to Look Forward to in WordPress 3.0 »