Handy HTML for WordPress.com Users


So it took me about an hour to figure out how to do something that I figured would have been easier than it turned out to be for me. I wanted to simply put a “Share on facebook” and “Share on Twitter” button at the end of a post, hoping that people will click them to spread my posts around the intertoobs.

Aparently it isn’t as easy as I thought it would be, but I finally got it worked out. While I was looking for a solution I noticed that I am by far not the only person trying to do this on wordpress.com. So I decided that I would share (see what I did there?) with the masses the easy way to get that done. It will require a little work on your end but it gets the job done. If there is an easier way to do this without having to have Fire Fox or something, please let me know.

You’ll need to visit a couple of sites. www.photobucket.com is one, and another is http://bit.ly/. Keep them open on separate tabs while you do this to make it easier.

Here is the code we will be using:

<a href=http://www.facebook.com/sharer.php?
u=”[URL YOU WANT TO SHARE]”><img
class=”alignnone”
src=”[URL OF IMAGE TO CLICK]”></a> <a href=”http://twitter.com/home?status=%5BNAME OF BLOG POST + SHORTENED LINK]”><img
src=”[URL OF IMAGE TO CLICK]></a>

Copy the code above and paste it a couple lines after your post is finished.

First off, let’s deal with the images that people will see and click. You can easily find some on www.photobucket.com and use the direct link to the image. When you find an image you like then click on it and it will list different ways to share it. Copy the Direct Link line. I saved the facebook and Twitter images to my album there so I don’t have to worry about the images being deleted by the original owner. If that were to happen then the image would not display.

You will only be replacing the CAPS information, and you will also get rid of the brackets after replacing text. Starting from the top with the facebook sharing:

[URL YOU WANT TO SHARE] = the URL of your blog post. The URL of your post can be found below the title when you’re editing your post.
[URL OF IMAGE TO CLICK] = the direct link to the picture from photobucket being used to click on.

With the Twitter share:

[NAME OF BLOG POST + SHORTENED LINK] = The blog entry’s title followed by a space. Then shorten the URL to that entry (the same one as above in the facebook URL you want to share) by pasting the URL of it into a site like http://bit.ly/ and paste the new, shorter URL after the title. Be sure to put a space between your title and the new URL.
[URL OF IMAGE TO CLICK] = the direct link to the picture being used to click on.

Again, get rid of the [brackets] in the above info. Once you’ve done that people should see the Share on facebook or Twitter pictures and when they click it then it will take them to their respective sites to repost.

If this was helpful I humbly ask you to try out my Share buttons below to spread the word.

Advertisements
  1. Hi mate,

    I can’t get this to work on my blog. Can you give me some help? Really want the buttons.

  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: