No ShrinkWrap Web2.0 Reviews

I love using Wordpress. One of my favorite time-wasters has become flipping through newly-submitted Wordpress themes at places like Weblog Tools Collection (here’s a sample theme post) looking for that perfect theme for my blog. Unfortunately, when I made a list of style elements I liked, not one theme has all the elements I want. So, I started going through my list and decided to add my favorite style elements to any theme. First up – styled author comments.

Styling author comments with a unique look is a great way to allow readers to immediately tell the difference between readers’ comments and an author’s responses. Some popular blogs that style authors’ comments include:

TechCrunch: see the article on Mig33 for a recent example.

ReadWriteWeb: see their ’social graph’ article for a recent example.

Alex King’s blog: see his article on Google’s sharing service for a recent example.

I like the extra panache Alex King’s comments have with the gradient, so that’s what I’ll use.

First, while I’ll be showing how to edit your theme’s files to add custom author comment styles, you could do the same with a plugin like Jan Olsen’s Comment Highlighter plugin (which appears to have moved to Google Code). I personally have struggled with plugin compatibility problems (most of which, it seems, unfortunately stem from Google Sitemaps, one of my favorite plugins). To reduce the chance of conflicting plugins taking down the entire site, I started paring them down to just the necessities – in particular, I stopped using any plugin I could easily re-create with some code in the theme files. In my opinion, the five minutes it takes to copy my code between themes when changing is worth saving potentially hours’ worth of troubleshooting time. If you’d rather use a plugin, or don’t have access to edit your theme files, I’m sure Olsen’s plugin is a good one. Otherwise, make time for five minutes’ worth of easy editing and read on.

To begin, we’ll be editing two theme files: style.css and comments.php, which you’ll find in your /wp-content/themes/[theme name]/ directory. First, in comments.php, find the lines that read:

<?php foreach ($comments as $comment) : ?>
<li class=”<?php echo $oddcomment; ?>” id=”comment-<?php comment_ID() ?>”>

Modify the second line to add a unique style if both the comment author name and email address match a particular blog author’s information (make sure it matches what is listed in the user’s profile):

<li class=”<?php if ($comment->comment_author == ‘AUTHOR NAME GOES HERE‘ && $comment->comment_author_email == ‘AUTHOR EMAIL ADDRESS GOES HERE‘) echo ‘authcommenthighlight’; elseif ($comment->comment_author == ‘ANOTHER AUTHOR NAME GOES HERE‘ && $comment->comment_author_email == ‘ANOTHER AUTHOR EMAIL ADDRESS GOES HERE‘) echo ‘authcommenthighlight2′; else echo $oddcomment; ?>” id=”comment-<?php comment_ID() ?>”>

Now we need to add the styles “authcommenthighlight” and “authcommenthighlight2″ (or whatever you name them) to our theme. Since I’m currently the only author on this blog, I’ll just be adding “authcommenthighlight.” First, create your gradient image. I had the best luck making mine 12×48 pixels, and selected two colors from my theme. I used Photoshop to make the gradient, but you can use just about any photo editing software – for that matter, even Microsoft Word can create gradients. If you’re not sure how to create a gradient, here’s some sample tutorials: Photoshop, Paint Shop Pro, Paint.net and GIMP. Here’s what I ended up with, using the top header (#237AB2) and sidebar (#EEEEEE) colors:

Now, add the “authcommenthighlight” style to your style.css, setting the gradient image to repeat along the top of the comment and the background to match the bottom color of the gradient:

.authcommenthighlight {
background:#EEEEEE url(/images/grad.jpg) repeat-x;
}

To kick it up a notch, try modifying padding, margin, borders, font colors and other style elements. Get an overview of additional CSS elements you can modify at DevGuru and W3Schools.

Now you and your authors will each have your own unique comment style that separates your comments from visitors’ comments. Of course, there’s a downside to styling comments by matching author names and email addresses – if someone knows your username and email address, they can leave a comment that receives the unique style. I haven’t dug into the Wordpress hooks enough to know whether there’s a way to code around this problem – anyone know?

Anyone have different methods of adding unique styles to author comments? I’d love to hear them in the comments below.

Blogsecurity.net updated their site with a list of known vulnerabilities in each version of Wordpress and some popular plugins. I appreciate this list, and hope it’s regularly updated – knowing this information is important when making the decision to update Wordpress. Seeing there are more issues than the admin XSS vulnerability, I decided I should update now before generating more content.

Having updated Wordpress a few times in the past, I’m familiar with the drill – back up database and my files, deactivate plugins (why is this important?), delete old files and upload new ones, then reactivate Akismet as fast as I can. No problem – until I started changing options. After hitting the Update Options button on the General Options tab, I got a nasty 404 error:

Error 403: Forbidden
You don’t have permissions to access this page. This usually means one of the following:

• this file and directory permissions make them unavailable from the Internet.
• .htaccess contains instructions that prevent public access to this file or directory.

Please check file and directory permissions and .htaccess configuration if you are able to do this. Otherwise, request your webmaster to grant you access.

Hesitantly, I modified the permissions for options.php to 777 – no go. I quickly changed them back and headed to Google for an answer, which led me to a posting on mod_security. I recalled my host recently turned on mod_security, so I followed the instructions for creating a new .htaccess file for the wp-admin folder – no more 404.

I have to say again – I appreciate Blogsecurity.net efforts in evangelizing blog security. I think I was a little knee-jerk in reacting before, and am looking forward to more discussion on the survey data and security issues. By the way, someone on slashdot posted how they probably “surveyed” the Wordpress version on blogs:

As a guess, they probably searched Google for the phrase “Powered by WordPress” (in the default template), then pulled the HTML and looked for the following tag in the HEAD segment:
<meta name=”generator” content=”WordPress $version” />

Good point. I’m sure they used something a little more sophisticated than Google, like a spider, but that makes sense. So thanks Blogsecurity.net for giving me the information I needed to decide to update Wordpress and wordpress.org forums for giving me the .htaccess workaround. My update wasn’t painless, but a whole lot less painful than it could have been.

A Lifehacker article today led me to the reCAPTCHA project. This fascinating project creates CAPTCHAs from OCR errors produced while digitizing text, then serves those CAPTCHAs to your site resulting in a seemingly symbiotic process – you prevent comment spam on your site with their CAPTCHA, and they receive assistance from thousands of humans correcting OCR errors. According to reCAPTCHA’s project description,

reCAPTCHA improves the process of digitizing books by sending words that cannot be read by computers to the Web in the form of CAPTCHAs for humans to decipher. More specifically, each word that cannot be read correctly by OCR is placed on an image and used as a CAPTCHA. This is possible because most OCR programs alert you when a word cannot be read correctly.

But if a computer can’t read such a CAPTCHA, how does the system know the correct answer to the puzzle? Here’s how: Each new word that cannot be read correctly by OCR is given to a user in conjunction with another word for which the answer is already known. The user is then asked to read both words. If they solve the one for which the answer is known, the system assumes their answer is correct for the new one. The system then gives the new image to a number of other people to determine, with higher confidence, whether the original answer was correct.

I decided to check out this slick-sounding project. It’s pretty easy to integrate their CAPTCHA plugin into Wordpress:

1. Sign up for an account at reCAPTCHA – as far as I can tell, the service is free
2. Register for an API key, one per domain
3. Download the Wordpress plugin (they have plugins for other applications as well)
4. Upload, activate and set options for the plugin
5. Follow the instructions here to insert the CAPTCHA into your comment loop

You can see the results below. The interface is a little confusing – it would be nice if it used a smaller field and smaller widget, perhaps something more like bot-check. Perhaps reCAPTCHA 2.0 will integrate better into existing forms. As it is, it’s still worth the small added confusion to be helping digitize projects like the Internet Archive.

Unless, of course, people stop leaving comments.

After playing with the plugin a little, I noticed the letters are sometimes hard to discern. For instance, I can’t even make a guess as to what the word on the left must be in this one:

Dave says it’s cit.), – good call.

My guess is this widget’s refresh button will get a lot of use.

What do you think – is the interface too confusing? Test it out and tell me in the comments below.

UPDATE-

I decided to disable the plugin – it’s too cumbersome as it exists now, and I don’t want to make visitors work hard to leave comments. I like the idea of the project though, and hope a version 2.0 is in the works. I’ll leave a screenshot up of the plugin interface.

I read an interesting article via Slashdot today on recently-launched BlogSecurity.net. The article claims the Wordpress community is vulnerable based solely on the basis of the following:

The following statement was taken from WordPress: None of these [WordPress Versions] are safe to use, except the latest in the 2.0 or 2.1 series, which are both actively maintained.

Currently (at the time of writing this article) the latest stable versions are:

• WordPress 2.0.10 and
• WordPress 2.2

This smells of FUD. First off, what does this statement mean?

BlogSecurity incrementally harvested the WordPress software version from 50 blogs

How did BlogSecurity obtain the version information from Wordpress blogs? Which blogs did it select to poll, and what process did it use to select them? Where were these blogs hosted? Those questions, and more, are important to knowing the true impact of Wordpress security flaws and how dangerous they actually are.

Then there’s the issue with defining a “vulnerable” Wordpress installation. The article simply defines old versions of Wordpress carte-blanche vulnerable without providing any information on exactly what vulnerabilities exist. Information on what privileges and access is provided by security flaws, how easy the exploits are to use and other information is pretty important to a claim of a frightening insecurity rampant among an entire community. Additionally, 2.1.3 is defined as insecure by the article because it is replaced by 2.2; however, 2.2 was released only 8 days ago, and provides so many feature updates that I (and probably many others) are waiting before upgrading. If there were important security flaws in 2.1.3, I would expect Wordpress would provide security patches without forcing a feature upgrade.

Don’t get me wrong – articles like this are important, as they raise a more mainstream awareness on security beyond those who constantly read security sites. Frankly, I don’t know enough yet about the specific Wordpress security flaws patched in each version, but as a result of this article I’ll be reviewing them soon. However, basing a security statement of frightening, alarming proportions solely on what version software people are using to drive personal blogs without any further research on what specific security holes exist (and how easy they are to exploit and what privileges or access they give) is, in my opinion, FUD.

The author has promised a new posting “shortly” to address these questions. I’m interested to see what information he has to share, including what version of Wordpress he uses to run his blog.

UPDATE

SecurityFocus has a blurb on the issue, and Matt Mullenweg has joined the conversation. Still no word on how exactly the 50 blogs were selected, what kind of blogs they are, whether they are self-hosted (as opposed to auto-script installed) and how the information was obtained (SecurityFocus refers to it as a survey). With more information and a wider sample size, this could be useful information. As it stands, I still think it’s useless.