Adding WPtouch to my WordPress site

Hot on the heels of today’s WordCampSF 2009, a recent survey on Twitter by Matt Mullenweg showed that two of BraveNewCode’s plugins for WordPress took number three and one.

WordTwit is something I’ve been using for some time now, and it’s a must have add-on that automatically posts updates to Twitter when you publish a post. Version 2.0 has brought on some great improvements that keep the plugin simple yet very powerful.

wptouch Taking number one is WPtouch, a plugin that makes your WordPress site optimized for the iPhone, iPod Touch, and Android mobile devices. It’s been available for some time now, and I’ve been very slow to getting it installed onto my site. Call it being lazy because it’s a very quick and easy process to upload it to your WordPress installation, activate it, and you’re done.

Dale and Duane are consistently working on improvements to the WPtouch infrastructure, making it better and better with each release. Keep your eyes on their blog to get the latest news on what’s next.

Designing drop down menus with CSS on WordPress

I designed a WordPress site for my friend Andy at No some months ago, and the final version that we settled on really pushed my personal boundaries of knowledge in terms of PHP and CSS to get some of the things to work that he was wishing for. Never wanting to let a good friend down, I got something to work that came up tonight at WordCamp Fraser Valley.

I’m not sure what the original question was, but my design for No Boundaries had custom drop down menus added to the header so that Andy could easily add and remove pages from where ever he was in the world and have them show up in those menus.

And to be honest, I can’t really tell you how I got it all to work because it was that long ago. However, Stu Nicholls made a great blog post about how to do this with simple CSS. I used this post to hack together my concept for Andy’s site, and the final design turned out to be what he wanted.

Now doing a quick Google search to find this resource again, I came across this WordPress plugin, WordPress CSS Drop-down Menu, that could do this for you without getting into all the code. I have no experience using it, but the author makes reference to the same blog post that I just did, so it might be worth checking out first before you get into the code.

Using CSS to attribute photos in your blog posts

Rebecca recently made a post about using the AddQuickTags plugin for WordPress to display captions on photos in her blog posts, I would elaborate on the CSS styling it takes to get this. The WordPress plugin makes this easier, but I thought it would be useful to share how you can do this with some simple CSS, especially if you don’t have WordPress at your disposal.

First, how do you get this…

John and Becks by duanestorey on Flickr
Photo credit: duane storey on Flickr

to work?

To start with, you need your image and then link it to its origin or creator to attribute credit to. This is just good practice and makes the original author happy. We’ll have to peak at some quick HTML to get a sense of what’s going on here because we don’t like using visual editors. Code might be tough to work with for some, but it’s second nature to us.

<a href=""><img src="" /></a>

Your HTML might look different, but the premise should be the same. It’s a linked image, but how do you get the “Photo by:” tag underneath the image? Let’s start by adding some code to your CSS.

.captioncentered {
display: block;
text-align: center; /*centers text & image*/
margin: 10px auto; /*centers the whole div*/
padding-bottom: 1px; /*this depends of your design*/
font-size: 0.85em;
color: #ccc;

This will make like somewhat simple for you in the long run because this will set the design of your blog to work for all posts you use this styling for. So now what do you do with it?

You just setup a “class” to use in the “div” tag. It works like this.

<div class="captioncentered"><a href=""><img src="" /></a></div>

That centers the image, so now you need to add a little more HTML to this in order to get the credit where it deserves to be. This just requires some text and then linking the words you want linked. However, this extra text must be inside the div tags in order for this to work!

<div class="captioncentered"><a href=""><img src="" /></a>
<br />Photo by: <a href="" />author</a> on</div>

Once you have this, you are able to to display an image, such as a photo from Flickr, with proper attribution. Why? Because it’s the right thing to do, not to mention a legal way to not get yourself into trouble with the original author for taking their content.

The next thing you can do is edit your CSS to make some adjustment to the look of your text or perhaps the background. It really comes down to what you want to do. There might be a better way to do this, but this is how we get this function to work.

Cool WordPress plugin: FeedEntryHeader

Feed Sample I got an email from someone who subscribes to my RSS[wiki] feed that noticed something new in their subscription lately, and you might have as well.

The image here is a snippet of how a post of mine looks in Google Reader. Basically, it’s a simple plugin that provides a copyright stamp at the beginning of every post that goes into your RSS feed. There are a few variations of how you can do this with WordPress, but the one I am using is FeedEntryHeader. It puts a copyright, a link to your site, and a link to the original post at the start of all your posts.

Why would you want to do this? Well the fact of the matter is that there are a lot of aggregator sites that like to take the content from your RSS feeds and put them up on their sites as original content. Better yet, there are some sites that will completely credit you for your content but strip away all the embedded links. This plugin at least puts all this information at the top where it’s slightly hard to miss. At the very least, the URL to your original content will show up on those sites that “borrow” your content.

If you use WordPress and care about the things you publish, you should look at using this plugin. It’s more than just getting credit for what you publish. There is also something to be said about other people making money off of the content you generate, and that’s just inconsiderate.

WP-Cache plugin to help boost page loading time

I’ve installed the WP-Cache NoSymLink plugin to my site for a little experimentation. The goal of this is to cut down on the amount of time it takes to load the various pages and posts within my site, and this plugin is a tweaked version of the original WP-Cache plugin.

If you have a WordPress site that attracts a lot of traffic, this will help speed up page loading by a few seconds. What it does is takes some of the load off your server in terms of generating pages on the fly. With every, single post that you read on any WordPress site, the server it sits on pulls information from a handful of data sources to present you a web page on your browser.

Instead of dragging down server performance and making you wait for all this information to load from a database, the cache stores this data on a temporary basis to get the page to show up on your browser faster. This is really helpful if you have a site with a lot of traffic or host your WordPress blog on a server with a slow connection to the outside world.

Can’t say that I have the worst server or the number of readers that heeds the need for such a plugin, but I’ve noticed a little bit more speed to the load time on my site.

Crossroads and WordTwit plugins for WordPress

Duane has been cooking up some interesting plugins for WordPress lately. I thought I would install them on my blog and try them out.

WordTwit is the first one, and this is a good one for you Twitter users out there with a WordPress website. Basically, it makes twitter updates for every blog post you make. That way tweets are sent out automatically to alert your followers on Twitter about new blog posts. This post will be my first trial, but I think this is much better than doing it manually.

The other plugin is Crossroads. If you like the Flickr and WordPress like I do, then you should really check this out. It allows you to post an entire set within a blog post as you see below.

This is an old photo set of mine, but it helps demonstrate the function of this plugin. Really useful instead of pointing people to Flickr to see the rest of your pictures for something that you have a bunch of pics about. And let’s be honest, people love looking at pictures just like many folks read the newspaper for the funny pages.

Visit both of the links for those plugins to find out more.

Security vulnerability: myGallery plugin for WordPress

The other morning, Rebecca told me about some problems with the RadioZoom site. Essentially, it didn’t want to load at all. There was a consistent error with some PHP in the myGallery plugin that I have been using on the site. I don’t use it extensively, and it was mostly to showcase some photos of a soundseeing episode that I did while wandering through Stanley Park.

Mark Ghosh made a post yesterday that answered a lot of my questions about the problem I ran into.

MyGallery Plugin for WordPress If you are using the myGallery plugin for WordPress to display your pictures, please follow the link above and update your plugin to the latest version. A pretty serious remote code execution vulnerability in the plugin has been found and disclosed and there have been scattered reports of hack attempts. [weblogtoolscollection]

I thought it was fairly strange for a plugin to just stop working, and there was a hunch inside of me that was fearing a hacker trying to get into the site, not that there is a whole lot to really get into. This is why I do regular backups to the site, not to mention keeping an archive of all the episodes that are released.

Even though this “error” completely crippled the site, I was able to remove the plugin physically on the server and gain access again. It disallowed me from getting to my dashboard as well. Everything is updated and appears to be running smoothly. If you use it, I would seriously consider upgrading ASAP. I’m fairly sure that my problem was the result of a hacker, so it can happen.