photographyVoter FeedFlare and Bookmark Icon

Social Networking

I typically try to update the site at least once a week for improved functionality or aesthetics. This week, I paid a little attention to the social bookmarking links that are displayed on each post and feed item. Specifically, I've updated the FeedFlare (via FeedBurner) and I've added graphical bookmarking functionality for my favorite social site — photographyVoter. You'll now notice text and graphics links for digg, StumbleUpon!,, and photographyVoter at the end of each post — and the same text links at the end of each feed item.

digg, StumbleUpon!, and are the easy ones. FeedBurner offers options (via FeedFlare) for displaying these text links in your feed and on your post. The text is also dynamic, so it shows the number of votes or bookmarks for that particular post in real-time. On my site, you'll also notice a small graphical button for the same links, and those can be done via the Notable plugin or the Sociable plugin (preferred) for WordPress. There are a whole lot of other options for which social sites you choose to display, but I only display the ones that I use and like. The only social site (that I like) that isn't available is photographyVoter — it's too new and not as widely used. So I fixed that.

Here are three options for integrating photographyVoter links in your blog content.

photographyVoter FeedFlare

The FeedBurner FeedFlare panel allows you to add personal feed flare — you just need to tell it where the XML file lives. If you want to add a link for photographyVoter to your site and feed, follow these instructions.

  1. Download the XML file (pVoteThis.xml) to your computer and upload it to your own server somewhere under the public_html folder. DON'T TELL FEEDBURNER TO REFERENCE MINE! USE YOUR OWN BANDWIDTH!!!
  2. Go into FeedBurner and under the “Optimize” tab, you'll see the “FeedFlare” menu item — click on it.
  3. At the bottom of the list, you'll see a textbox that says “(Enter or paste a Flare Unit URL)” with a button to the right that says “Add New Flare”. Type in the address that locates the XML file you just uploaded to your server and hit the button.
  4. You should see a section below the “Official FeedFlare” that says “Personal FeedFlare”, and you should see something that says “photographyVote This!”. Check the box or boxes for displaying the Flare on your site and/or your FeedBurner Feed.
  5. If you want to change the text or description of the Flare, just edit the XML file — you'll figure it out; it's pretty simple.
  6. Wait 5 or 10 minutes and you should see the Flare appear on your posts and feed items. Test it out to make sure it's working right.

This is just a static FeedFlare link, so it doesn't display the number of votes or anything like the “Official FeedFlare” links do — in other words, it always displays the same text. When you click on it, you'll be taken to step 2 of 3 at the photographyVoter submission page. From here, you just need to fill in a description, keywords, and a category. If the story has already been submitted, you'll be taken to a page that tells you this and offers to take you to the story so you can cast your vote. Unfortunately, that little feature doesn't really work that well and you end up having to sift through every single story to find it.

There are two things I would like to see happen with the FeedFlare and the photographyVoter site.

  1. Fix photographyVoter so that you are taken directly to the voting page if the URL has already been submitted. Digg does a very good job at this. Paul, I don't know how involved this would be, but I'm at your disposal if you need any assistance with the code (I'm fairly well versed in HTML, PHP, C, PERL, and several other languages) — and if anybody else is code savvy and willing to help, let Paul or me know.
  2. I'd like to make the FeedFlare link a dynamic one so it shows the number of votes if it's been submitted already. I only spent about 10 minutes slapping the static Flare together, but I'm sure a dynamic one won't be terribly hard. I'll be working on providing a solution to this, but it may hinge on the item above. And if anybody else feels the need to work on it, let me know if you make any breakthroughs.

photographyVoter Sociable Integration

I just switched over to Sociable from Notable because it has more options and a much better interface. I also spent the extra five minutes to update the plugin so that photographyVoter would be included in the list of bookmark options. These icons will only show up in your real posts (no feed), but they're a bit nicer looking than plain text. If you're on WordPress and you want to try this one out, follow these steps.

  1. Download and install the Sociable plugin.
  2. Download the button image (photographyVoter.gif) to your computer and upload it to the “sociable/images/” folder in your plugin folder.
  3. Download the PHP file (sociable.txt) and upload it to the “sociable” folder to replace the existing file. The download is a text file, so you'll have to rename the extension to .php before uploading. Or just copy the text and paste it into your plugin editor for the sociable.php file.
  4. Now go configure the plugin in the “Options” panel and you should see the “photo-Voter” icon. I had to shorten photographyVoter because the string length broke the configuration interface.

That's it — pretty easy installation. Let me know if you have any problems with this one working correctly. I also fixed a bug with the StumbleUpon! button in the original file — it wasn't working correctly.

photographyVoter Bookmarking Icon

This will only show up in your post (not the feed) and they're a little more eye-catching than the text links. I tested this out by following the steps below and placing the code just before the Notable icon code (before I turned it off and switched to Sociable) If you use WordPress and you want to include the photographyVoter bookmarking icon in your posts, follow these steps.

  1. Download the button image (photographyVoter.gif) to your computer and upload it to your own server somewhere under the public_html folder. AGAIN, DON'T REFERENCE MINE WHEN IT COMES TIME TO CODE! USE YOUR OWN BANDWIDTH!!! It's just good etiquette.
  2. Go to your theme editor and edit the “Single Post” page.
  3. Somewhere below the content function call and above the comments function call, insert the following code:
    <a href="<?php the_permalink(); ?>" title="photographyVoter: <?php the_title(); ?>"><img src="" border="0" width="16" height="16" alt="photographyVoter: <?php the_title(); ?>"></a>
  4. Save the file and go check it out to make sure it's in the right spot and that it works correctly. It should work exactly the same as the FeedFlare link
  5. Now put the same code in the “Main Index Template” so it shows up on the main site in addition to each individual post.

That's it for that one. Placing the code where I've indicated will put the icon on every post, but you can place the code anywhere in the post content (I think) — if you want to be more selective with your bookmarking options. You can also replace the image I provided with anything you want, like a bigger image or something. I hope Paul isn't upset by my makeshift button image taken from the photographyVoter banner — but I don't think it looks too shabby.

photographyVoter Firefox Extension

Eventually I'd like to see this happen, but I think I'd like to see the dynamic FeedFlare working first. I've never programmed a Firefox extension, but I wouldn't mind seeing something like the digg extension. One step at a time I suppose…

So that's it. If you have any issues with any of my links or files, let me know IMMEDIATELY! So who's going to be the first to test out my new photographyVoter button (hint, hint, hint) to make sure it works? I'm also not opposed to a periodic testing of the other buttons and text links… you know, for the sake of clean-coding-practices and whatnot. 😉

[UPDATE: photographyVoter Buttons Via Bookmarks]

I just remembered that one of the photographyVoter users created a bookmark button for submitting articles right from your own browser. It works just like the other site buttons and links, but you can do it straight out of your browser. This bookmark opens photographyVoter in the same window so I modified it in case you want one that opens the site submission in a new window or tab — to use that one, drag the pVoteIt link to your bookmarks and use it the same as the original one.