You are here

10 Design Changes I Did To My WordPress Blog This Month

1274623_magic_boxIf you haven’t stopped by the actual website for So You Want To Teach? in a few months, er weeks, er days, er hours, you may not recognize it. I have used my summertime to really put in some solid effort into adjusting the layout of the blog. I haven’t done a full-on redesign since March of 2009. Since that time, I’ve added a few widgets here and something else over there, but never really spent a lot of concentrated time really thinking about the layout of the blog. Until recently.

How it all began
Quite frankly, I got bored of looking at the blog each day. I had some stuff there that just really didn’t make sense. It was more cluttered than I was comfortable. So I started looking at sites I like.

Zen Habits
Number one on the list is always Zen Habits. I am always impressed by how quickly his site loads. Why? Because it’s almost entirely text. I’ve been following this blog since the beginning of January, 2007. So almost from the beginning. Leo featured a sort of interview with me once about my perpetually clean desk, but that article has since been removed. Nevertheless, he did link to me in Ask the readers: Best tips for decluttering? and listed my post first among such sites as FlyLady, CNN, and Lifehacker. So I must give him props there.

Mashable
If you go online at all, you should be familiar with Mashable. If you’re not, you should get familiar with it. Mashable is hard to define, it’s a technology/social media/viral content/Google/YouTube/whatever new trend happens to be going on at the time site. It’s a blog. It’s a perpetual online magazine. It’s an information overload. But amidst the noise, Mashable does a fantastic job of throwing all of the information at you in an organized way.

I really used these two sites more than any others in deciding what I wanted to do. So here’s what I did:

  1. Gave search more focus
    I moved the search box from the sidebar to the top of each page. Facebook does it. Mashable does it. Yahoo! does it. Gmail does it. There must be a reason it’s up there. As this blog continues to age, it becomes more and more difficult to find some of the excellent articles buried in the archives. Enter search…
  2. Added more excerpts to main page
    I had 5 excerpts per page, which meant there were 100+ pages of archives. Now I’ve made it to where there are 10 per page.
  3. Pictures, pictures, pictures
    Whereas the “Popular Posts” widget shows just the titles of the 10 most viewed posts over the last couple of days, I find they often get a little bit stale. I had the “Other Readers Liked” section at the bottom of each article, but decided to move it to the sidebar of every page to add a little bit of color and present some articles repeat visitors may not have seen before. Amazon uses a similar feature. I also expanded the “Related Articles” list at the bottom of each article.
  4. More pictures – Avatars
    Since I have quite a few articles written by guest bloggers already on the site, and since more people continue to submit articles, I thought it would be useful to add an author avatar in the header of each article. By the way, if you’ve written something on this site (either an article or a comment), feel free to set up your Gravatar. I also cleaned up the comment section more.
  5. Social
    Every article has a Facebook Like button in the header. Additionally, each article has its own Google Buzz, Twitter, and Facebook Share counters. It seems “sharing” and “liking” are two different things on Facebook. I also have found that the Topsy Retweet numbers are more reliable than TweetMeme. Plus the colors fit in a little better with my design, so that’s what I’ve gone with. On top of that, each article has a “Share the Knowledge” section at the bottom, encouraging sharing on Delicious, Diigo, StumbleUpon, Technoratri, Tumblr, and Digg.
  6. Follow me
    Along the same lines,  I moved the Social Media icons. You know, the ones that tell you to subscribe or be a fan or follow me or whatever. Well, I took them out of the main sidebar and placed them at the bottom of each article. Conventional wisdom says to place an RSS icon “above the fold” on your blog. I have come to believe that blog readers are pretty smart and if they want to subscribe because of an article they read, they’ll see the big orange icon at the bottom of the article and subscribe if they want to. Speaking of smart readers…
  7. Comments
    I have struggled at times with comments simply because moderation was such a chore. I turned them off this spring and had some of the most liberated time I’ve ever had when checking email. But I missed knowing that this blog is helping people. So I begrudgingly turned them back on this summer. Here are some of the things I’ve done to try to fight this:
    1. Removed the section of the comments that allowed a reader to include a URL – Most of my comment spam was coming because people wanted to get a link from this site to theirs.
    2. Removed any links in the displayed comments from previous readers – Before I removed the URL section, hundreds of spam comments made it through the filters. Instead of individually moderating these, I chose rather to simply remove the link back to any site. I hated doing this because so many of you out there do have sites that deserve the link, but my commenting headaches were not worth that. Sorry…
    3. Removed all trackbacks/pingback displays – Again, this was a spam prevention strategy. A bit extreme, but I felt it was necessary if I was going to be serious about turning comments back on.
    4. Reader moderation options – If you happen to be reading through a comment and come across something that doesn’t look right, simply click on the “Flag this comment as inappropriate” link inside the comment box. This “crowdsourcing” concept will help me utilize my reader base to help with the moderating of comments. It is one of the things that convinced me to open them back up, so I’m excited about it!
    5. Conditional comment display in the header – I love the idea of displaying a graphical notification with the comment count on an article, but I always hate seeing the number 0 there. It’s such a lonely number. So I played around with PHP If statements and got it working. If an article has a comment, a little comment count icon appears. If not, it’s not there.
    6. Cleaned up the Gravatar display for comments – I’ve never really been happy with the way that the comment avatars display. Until now. I finally got it to do what I wanted it to do! If you care, the primary thing that allowed me to do this was opening up beyond the sidebar and using the entire width of the blog for the comments.
    7. Integrated Twitter oAuth support – You can now use your Twitter account to login and post a comment, with the option of tweeting out that you posted a comment. I am working on Facebook integration, but it will take a good bit of more work so I can update my database to a more recent version of PHP.
    8. Cleaned up the Comment Submission form – I actually did this last night. Now once you enter an email address, your Gravatar displays in a preview box. If you want to change it, simply click on the link provided and set it up.
  8. Digging through the archives
    I have been going through many of the old articles primarily looking to add images to them. I also am eventually going to work my way through and clean up the tags some, but that is a pretty huge undertaking that I just don’t see as a priority. Really, the search box is the best way to find stuff!
  9. Tags
    It’s kind of frustrating to me that WordPress didn’t have tags at all back in February of 2007 when I first started my blog. They were a bit late to the game there, and when they implemented them, I basically just used them like categories. So as I said above, my tags are a royal mess on this site. I’ve just never really wanted to bother to go back and really fix them. I like categories and search. But I know a lot of people like them, so I’ve been trying to make them more useful. Toward that end, I put a little box at the end of each article reminding me basically that I have neglected them for too long. It also serves the reader by letting you click through to see other articles that are similarly tagged.
  10. Footer: The final frontier
    The footer is the final section that I want to address from a design standpoint. I plan to eventually add some cool graphical navigation stuff but it’s not a hugely pressing issue either.
See also  10 WordPress 2.7 Hacks That Make My Blog Totally Rock Out

So there you have it. A quick and simple guide to navigating this site somewhat. Let me know what your thoughts are on the “new design”/modifications. Comments are open for business!

Also, if you have any questions how I did certain things, I would be more than happy to share with you the tricks. At least if you’re using WordPress…

Joel Wagner (@sywtt) began teaching band in 2002. Though he had a lot of information, his classes were out of control. He found himself tired, frustrated, disrespected by students, lonely, and on the brink of quitting. He had had enough. He resigned from his school district right before spring break of his second year and made it his personal mission to learn to be a great teacher. So You Want To Teach? is the ongoing story of that quest for educational excellence.

Joel Wagner
Joel Wagner (<strong><a href="http://www.twitter.com/sywtt">@sywtt</a></strong>) began teaching band in 2002. Though he had a lot of information, his classes were out of control. He found himself tired, frustrated, disrespected by students, lonely, and on the brink of quitting. He had had enough. He resigned from his school district right before spring break of his second year and made it his personal mission to learn to be a great teacher. <strong><a href="http://www.soyouwanttoteach.com/">So You Want To Teach?</a></strong> is the ongoing story of that quest for educational excellence.
http://www.SoYouWantToTeach.com
Top