Jan 26, 2016 Design + Creative

CSS-Tricks is a Poster Child WordPress Site

Howdy! Like a lot of you, I run a website. It’s hosted right here on Media Temple. A whole bunch of years ago, I chose WordPress to run it on, and I’m sure glad I did. These days, it takes advantage of a huge array of WordPress features to handle all the things I need the site to do.

Let’s walk through a bunch of those features. By the end of it maybe you’ll agree: CSS-Tricks is a poster child for WordPress.

IT’S A BLOG.
First and foremost, WordPress is a blog. Many WordPress advocates spend a lot of time convincing the world that WordPress isn’t just a blog, which I agree with, but it still ships with features that are particularly well-suited toward blogging.

1

I use WordPress to blog nearly every day. I even do most of my writing directly in the browser, since it does such a good job of saving work even when I forget to or go offline.

THE DEFAULT TAXONOMIES WORK FOR ME.
Which are categories and tags.

This gives me useful URL’s like all posts that are interviews or all posts that have something to do with SVG.

And if I needed my own distinct taxonomies, I could do it.

IT HAS (THREADED) COMMENTS.
I embrace the comments on CSS-Tricks. I’ve set the tone over the years to encourage thoughtful and helpful discussions and critique. Anything else is removed.

css-tricks2

Bonus information like this is a regular occurrence on CSS-Tricks. A modern day miracle. I keep the threading level at 2 (a comment and replies) to keep the conversations understandable (uckcgkh, infinite nesting drives me nuts.)

IT SUPPORTS MARKDOWN EASILY.
Jetpack (an official plugin) makes it easy to support Markdown, which I highly recommend. For legacy reasons, I actually don’t blog in Markdown on CSS-Tricks, but do on every other WordPress site I work with. I do, however, support Markdown in the comments and in the forums.

css tricks 5

Speaking of forums…

WORDPRESS SUPPORTS FORUMS.
bbPress! It’s a plugin that enables powerful, feature-rich forums. I started a forum on CSS-Tricks many years ago to help solve the problem that I got too much email asking for help with web design problems, and I wanted to let people help each other so that more of it could happen. Not to mention do it publicly, which is good for lots of reasons: community, searchability/findability, traffic, etc.

3 copy

IT HAS PERMISSION LEVELS FOR DIFFERENT TYPES OF USERS.
I’m not the only person who manages CSS-Tricks. There is a whole team, and even that isn’t everyone with access. The default WordPress permission levels serve us well:

  • Administrators, like me, who are all-powerful and can do anything on the site.
  • Contributors who can write (and edit) new content, but not publish it directly or see/edit anybody else’s content.
  • Authors who are like contributors but can control publication.
  • Editors who can write, edit, and publish any content on the site.

There are also forums-specific roles that allow me to grant forums users moderation abilities. We even have a custom role (via plugin) we use to designate a user as “Staff” with capabilities to match.

IT HAS PAID MEMBERSHIP AND RESTRICTED CONTENT.
Part of the business of CSS-Tricks is offering membership to the site, what we call The Lodge. It’s things like video tutorials that only members can see. That means having published content that is locked down so that only active members can see it.

This is the kind of thing a plugin is perfect for. We use Restrict Content Pro. It allows me to use simple logic like:

<?php if (rcp_is_active()) { ?>
  Show content for members.
<?php } else { ?>
  Show content for non-members/
<?php } ?>


css tricks 6

I can use that logic in the templates I build for the various content around the site. Speaking of which…

I CAN HAVE AS MANY CUSTOM PAGE TEMPLATES AS I NEED.
For example, I use plenty of the traditional “CMS” abilities of WordPress as well. The most common example is a “static” page, like an about page. Pages like that don’t need to have a comment thread. They don’t need to go out over RSS. They might even be styled differently or have different layout. That’s no problem. Whenever I need a specially designed page, I just make a template like <code>page-about.php</code> and let WordPress know it’s a special page template through code comments:

<?php
/*
Template Name: Special Cool Page Template 
*/

That template then becomes available to any “page” from a drop-down selection.

css tricks 7

I use that feature regularly. For example, all videos on the site have a special layout that puts the video large and in charge at the top of the page.

css-tricks 4

FEEDS FOR FREE.
RSS. I love it. I know it had a hard time being adopted by more than the techy crowd. But hey, the CSS-Tricks crowd is a techy crowd, and I know (I’ve done polling) that a ton of people read the site that over RSS. That’s fine with me! I don’t have to do much work at all to get an RSS feed out of WordPress.

That feed is sort of like a read-only API. It’s syndication. It makes a lot of stuff possible. Not just reading through a feed reader, but, just as one example, the weekly newsletter that goes out through MailChimp is generated from that RSS feed.

I USE CUSTOM CONTENT TYPES AS WELL.
I do make heavy use of “posts” and “pages”, but I also use some completely custom post types. One of which is “shifts”. At the moment, we’re experimenting with a perk of being a Lodge member called Office Hours. Staff members hold live themed Q&A sessions at certain days/times.

I created a custom post type for the “shifts”, and then customized the input screen with Advanced Custom Fields. Now we have a way to collect exactly the content we need for this specific feature.

8

This is a tremendously useful feature of WordPress, allowing it to be adapted to any sort of CMS need.

I CAN SELL STUFF.
I use WooCommerce (also an official plugin) to sell physical products from the site.

9

Like The Lodge, I need to collect payment information, but since these products need to be shipped, it’s a more complex checkout flow that handles collecting addresses, calculating shipping, saving payment information, and things like that.

I CAN EXTEND IT TO HIGH HEAVEN.
Even though I use so many of the default WordPress features, I certainly customize things to my liking as well. For example:

  • I customize the markup that the Media Uploader outputs when I add an image to a blog post.
  • I customize the markup that is output for comment threads.
  • I customize the RSS feed to link directly to the article I’m talking about when the blog post is in the “Link” category.

That’s just a few of the dozens of little customizations I do, without manipulating WordPress itself. I use my own functionality plugin, not to mention a good couple dozen other plugins.

I’M NOT CLOSED-MINDED ABOUT OTHER CMS’S
I’m particularly fond of static site generators like Jekyll and Middleman. The fact that there is no live database or server side languages doing stuff live feels is a really clever way to handle things. Less moving parts! Fast! Secure! Inherently backed up!

I’d reach for those CMSs in a second for certain projects. Something like a personal site is a great use case for that. Or any site where “No.” is the answer to “Do I clearly need a log in system for myself and/or users?” Since my answer is “Yes.” I’ll need to stay.

REBUTTAL TIME!
I’ve never written anything about any CMS without people extolling the virtues of their favorite CMS in response. Wonderful, I say! Let’s hear about your considerations in the comments.

About the Author Chris is a web designer and developer. He writes about all things web at CSS-Tricks, talks about all things web at conferences around the world and on his podcast ShopTalk, and co-founded the web coding playground CodePen. More by this Author