WordPress 1 Minute Wonder – Styling Author Comments

This is the first in the series of my 1 Minute Wonder series for WordPress where I’ll be showing simple and quick tricks for WordPress to add a little extra to your blog or WordPress powered website. And in this series debut I’ll be showing you how to add extra styling to the comments made by the post author.

So a quick caveat… this trick depends on your theme’s implementation… hopefully it’s been created with all the correct semantic markup needed. If you find this doesn’t work then to resolve the issue may take slightly longer than the one minute.

So here we go, all you really need to do is add the following to your current theme’s style.css file (usually located in ~/wp-content/themes/<theme_name>/ directory);

.commentlist li.bypostauthor {
  background: #f1f1f1;
  border:1px solid #999;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  -o-border-radius: 10px;
  border-radius: 10px;
  -moz-box-shadow: 3px 3px 7px #999;
  -webkit-box-shadow: 3px 3px 7px #999;
  -o-box-shadow: 3px 3px 7px #999;
  box-shadow: 3px 3px 7px #999;
}

What we’ve done here is added extra styling to give the author’s comments a background specific background colour with a nice rounded border and a subtle box shadow. The rounding of the corners and the shadow are created using CSS3 so may not show on older browsers.

Styled Author Comment
Styled Author Comment

This styling can be seen on this very blog over at this post on the Responsive TwentyTen child theme for WordPress. Of course the comment can be styled in any manner of ways depending on the CSS you apply.

[jbox color=”blue” vgradient=”#fdfeff|#bae3ff” title=”Found this useful?”]If you’ve used this technique on your site for styling comments then please leave me a comment below with a link so I can take a peak.[/jbox]

Information as requested, Or not!

Did I receive Spam Mail from Keith Griggs?

I received a mail today from a gentleman wanting to start up a joint venture with me. The proposal was based around creating an SEO business (something he said that he was already very good at). So how did I respond to the mail?

I suppose I could’ve been flattered by his approach, I mean it seemed financially to not be such a bad deal (apart from the 100 quid I’d have to fork over to show my commitment of course)… but even before I started looking into the key content of the mail 2 things struck me which meant I didn’t think that this guy really wanted to start a business with me.

Firstly he didn’t address me by name… this is something that unless you’re hidden deep in a large organisation, shouldn’t be too hard to find out. Yup, this was (content aside) starting to smell of a mass mail campaign.

Second up (though I should really have spotted this first) was the email subject line “SEO Experts – Information as requested”… so there we have it… I have never asked for any information from these guys. I honestly have never understood why spammers use such subject lines. Perhaps they think that my business is so big that someone else (who I don’t talk to but knows that I’d want the information) passed a request on for me?

Either way I filed it under spam and Keith Griggs can go suck an egg and see just how well this article will rank for “Keith Griggs send me spam mail”. I’ll check back in a few days to see if google index me for that.

I have also tweeted Keith Griggs to ask him to not send me spam… at the time of writing he hadn’t responded.

I don’t know for sure that this is spam… but to me it sure seems like it.

The Developer’s Linux Setup

A quick foreword, this is how I’ve got my relatively new Linux setup running so please, please leave comments to let me know what I’ve overlooked.

As someone who flits between different computers it’s nice to have a common set of tools to help me as a developer… and have a new Ubuntu setup in my home office I thought I’d document those which really help me in day to day work etc.

Development Tools

SciTE – As an all-round editor I just love SciTE (and it’s fun to say it’s name too). It’s a no-nonsense editor with a vast amount of languages supported.

Eclipse – OK, so I don’t really like eclipse but as a tool for developing for Android it does it’s job just fine.

Firefox – Yup, an excellent browser which also hosts some excellent add-ons (Firebug, Web Developer, ColorZilla)

Designer Tools

Balsamiq – For wireframing websites, web apps and mobile applications Balsamiq is pretty good.

Communication

Tweetdeck – What can I say about Tweetdeck apart from it’s a brilliant client for Twitter and Facebook.

Skype – The current Skype client on linux is a little ‘clumsy’ in my opinion and is a fair few releases behind it’s Windows counterparts. As a basic VoIP client though it’s second to none.

Utilities

Adobe Air – This cross platform runtime environment enables you to take advantage of some really super tools and applications.

Dropbox – This is just one of the dandiest apps around… brilliant cloud based storage with cross platforms clients. If you haven’t got it yet what are you waiting for… go get Dropbox now!

EvernoteEvernote is a brilliant cloud based note taking and management app

Filezilla – A few linux fans might not appreciate me mentioning GUI (s)FTP clients such as Filezilla but as an ex-Windows user having familiar tools to winSCP makes the migration much easier.

How to get Dropbox on Linux Working through a Proxy

I was recently a little stumped on getting Dropbox working on my Ubuntu 10.10 install (Maverick Meerkat) through our corporate proxy…. having got it working though I thought I’d share with you.

Dropbox Logo

In a terminal start Dropbox with the following command.

dropbox start
Starting Dropbox...
The Dropbox daemon is not installed!
Run "dropbox start -i" to install the daemon

This tells us that the Dropbox daemon needs to be installed… so run the command as suggested

dropbox start -i

This will start the installer and if you have a proxy in the way then this process will throw you an error. What you need to do is specify the proxy settings (including username and password. For some reason setting it via Gnome (System->Preferences -> Network Proxy) does not seem to work and we need to set the Environment variable http_proxy.

export http_proxy=http://username:password@proxy:8080

If you re-run the dropbox start -i command now the install should proceed as required and you’ll have a nice working install of Dropbox running. Note also that during installation it is possible to set the Proxy information that will be used by Dropbox for everyday running so there is no need to put the previously mentioned export command in your .bashrc file.



[jbox color=”blue” vgradient=”#fdfeff|#bae3ff” title=”Get Dropbox”]If you haven’t got Dropbox yet go grab it from here.[/jbox]

5 Tricks to Spice up your WordPress Blog

By adding a few lines of code or installing a plugin or two you can add some extra spice to your WordPress blog (or other WordPress powered site) and at the same time  bring a lot more value to your readers.

Wordpress LogoOf course these tips are dependant on your ability to install plugins/widgets etc and some are also only applicable to themes with certain functionality, but you should see at least one tip here that you can apply nice and easily.

1) Enhance your Sidebar

If your blog has a sidebar (and let’s face it most blogging themes proide at least one) then this gives you prime screen real estate to give extra information to your readers about you and your blog or subject matter. There are many, many plugins out there which cater for all sorts of users and content type.

As you can see on my sidebar I provide a list of events that I’m attending, giving hopefully some more context to the things that I’m interested in. This is powered by the My Lanyrd Widget and as such pulls information from my Lanyrd account.

As I’ve said, there are many sidebar widgets available… so what are you waiting for, go get some!

2) Put Widgets in your Posts

Following on from Step 1 is the perfect tip for adding extra “dynamic” content to otherwise fairly static blog posts or pages… Add your widgets to them!

All you need to do is install the Widgets on Pages plugin and then add the widgets that you want to the newly created sidebars and then place a simple shortcode in your post content and your widgets will be displayed inline. For example I’m displaying my “posts calandar” right here

[widgets_on_pages id=4]

3) Shortcodes

Shortcodes can be extremely powerful and can provide you with a quick way to add extra content/design to your posts and pages. There are many “shortcode” plugins available and a lot can be downloaded for free from WordPress.org. A simple example is the J Shortcodes plugin which among other things enables you to quickly add styled areas to your posts.

[jbox]This text is in a nice styled box using the J Shortcodes plugin[/jbox]

4) Customise your Feed

A key way to give your readers more is to improve the default RSS feed that goes out to them. This is done by adding some short code to the functions.php file (located in your WordPress theme’s directory). I add the featured image to my articles as well as a short finishing line to thanks the reader for the time and to send them to my blog.

The options here are really only limited by your imagination, you could add links to related posts for example.

The code to add a nice sign off is as follows;

function feedFilter($query) {
if ($query->is_feed) {
add_filter('the_content', 'feedContentFilter');
}
return $query;
}
add_filter('pre_get_posts','feedFilter');
function feedContentFilter($content) {
$content .= '<p>Thanks for reading, check out <a href="'.
get_bloginfo('url') .'">'. get_bloginfo('name') .
'</a> for more from Todd Halfpenny</p>';
return $content;
}

5) Make it Device Ready

With every day that goes by there are more and more Internet-ready devices on the market and these come in all sorts of sizes. And it’s with this in mind that having your blog ready to display optimally on this wide range of fixed and mobile devices you should really start thinking about making your blog “responsive”… or at least mobile phone friendly.

There are various free and paid for ways of getting your site to work well for readers who aren’t just using their PC at home or work, but I’m gonna focus on just 2 here.

Make you Site Responsive

This is the best place for your site to be… it means that your site is future-prrof (ish) for devices of all various sizes to access it. Implementing this generally means having to get a theme tweaked to utilise media queries and various other CSS techniques… but I have a cunning plan for those using the default TwentyTen WordPress theme… the Responsive TwentyTen plugin. This plugin (free) instantly turns your site into a responsive one and means that as the browser window size changes your site re-formats itself to display in the most optimal fashion. Don’t believe me? Just try it on this site.

WordPress Mobile Plugins

There are several plugin available which will server up optimised content for mobiles. A decent review of different plugins and approaches can be seen over at WP Candy.

[jbox color=”blue” vgradient=”#fdfeff|#bae3ff” title=”Get Started”]So what are you waiting for?

Get downloading the great Widgets on Pages plugin and check out check out how to make your site look good on mobiles.[/jbox]