I Don't Fear The Chaos!

Questioning Everything and Everyone!

  • Wankers Of The Week Archive
  • For readers outside of Wordpress: Enter your email address to Subscribe to this blog and receive notifications of new posts by email.

    Join 48 other followers

How To Create A Friends List On WordPress

Posted by DeadAnarchistPhil on February 19, 2011

I’ve noticed and heard a lot of people on WordPress, especially those who came over from the old Microsoft Social Network ‘Windows Live Spaces’, say that there is no Friends list on WordPress.

Well today, I’m going to show you how to make your own if you want one!

First of all, you’ll need to following:

(1) You need a ‘Text’ widget, otherwise known as ‘Arbitrary text or HTML’ to display the friends list in. You can get this by clicking Appearance > Widgets on your Dashboard (Home Page) and then dragging and dropping the Text Widget in to a sidebar. ( See below for picture instructions)

(2) The following code is what we’re going to be putting in to the Text widget. 

<a href=”blogaddressgoeshere“><img src=”directlinkcodeforpicturesgoeshere” border=”0″ alt=”blogsnamegoeshere” /></a>

Please note: One Friend per line of code. You will put the blog address, image link and blog name in to corresponding areas I’ve highlighted in red. Obviously you delete the red text and paste in your links and name of the blog in-between the quotation marks. ”  ” <–these are Quotation marks.

(3) If you don’t have Photoshop and you can’t use Windows Paint, you will need a programme to resize your images to make them the size you want for your friend’s list.

Lucky for you I already found one that is easy to use and not large. It’s called: Free Picture Resizer Starter. (You can click the link you wont navigate away from this page, a new window will open). Alternatively you could also use Photobuckt as it has a good photo resizer.

Let’s get started…

Step one: Drag and Drop your Text Widget in to the sidebar (which ever one you choose). Once you’ve done that give it a name like ‘Friends’, ‘Friends List’ or whatever you want to call it. Then press save.

Step Two: Next, copy the code above and paste it in to your Text Widget box. You can post as many codes as you like inside the box, one for each friend. Please note: Because my blog displays quotation marks incorrectly, you will have to delete them and replace them in the Text Widget box after you’ve pasted the code in.

Here’s the difference between them: 

Step Three: Now you have the code and widget, you need to put you web address, picture codes and name of that blog.

First of all, the web address! You can find this at the top left-hand side of the page you want to list as a friend: Here’s an example using mine:

Now you need a picture to represent the friend, make sure it’s something they will like or one they’ve given you. To make all your friends fit in the one sidebar, you will have to use the Free Picture Resizer Starter Programme to shrink your pictures down to:Width: 53px. Height: 75px (px =pixels). Which I think is the perfect size. Of course you could add the pics at any size you want, but, if they’re all odd sizes you’re friends list wont look uniform.

I’ll show you how to use Free Picture Resizer Start.

After installing and updating, the programme will run, just press ‘Open Image’ on the opening screen.

If the box doesn’t open automatically then just press file and ‘Open Picture’ to select an image that way (See below).

Once you have your image you need to go to the resizer on the left hand side of your screen and put in pixel Width and Height (W: 53/H: 75 [make sure you turn off ‘aspect ratio’ before you enter them]). And then press Resize Image to confirm the size change, then click save. You can carry on doing the rest of your pictures this way by pressing ‘Previous’ or ‘Next’ button at the bottom of the programme window.

Once you have all you photos, up load them to Photobucket. Once you have them Uploaded copy the ‘Direct Link code’ and paste it to the part of the code where I wrote “directlinkforpicturesgoeshere”, obviously after deleting what I wrote.

Next, you just write in what you want to be the name of the site where I wrote: “blogsnamegoeshere”. This will show the name of the blog when anyone hovers their mouse over the photo. Like this:

Once you have all the address, direct codes and names for all your friends in the right place, make sure that all the codes are touching, otherwise the pictures wont display properly. Here’s what I mean:

Pic 1 is by itself. Pic 2 are ‘touching’, there should be no gaps. And no, it doesn’t matter if  “Automatically add paragraphs” is ticked up or not.

Once you’ve done the above you can press “Save” on the HTML Widget and go and see how it looks. You should have something that looks like this: 

Obviously I used the same code for all my friends to show you an example, just to save on time, as I’m not creating a friends list of this type yet. Yours will look different as it will have different pictures, but should still display the same way with no white gaps showing.

If you have any trouble with anything here then tell me, I’ll be happy to help! 



HTML scrollbox


8 Responses to “How To Create A Friends List On WordPress”

  1. this blog is ”bookmarked! thanks phil.
    prenin told me how to create my guestbook! and i ‘managed to create one on my first attempt!!!’ ( thanks prenin )
    I did work with HTML code when I was on spaces, I’m not sure how I will get on with replecating your instructions for a friends list, but I will definitely give it a go ( once I get a new ‘theme’ which accomadates more than the ‘ONE’ widget allowance that I have at the moment!
    I am using my one widget for music files, as I can NOT NOT NOT figure out any other way to play music on my page, without upgrading ( at cost )
    I have looked at tutorials, I did manage to set up a player using a demo ”code” but when I tried to set up my own codes I get ZILCH naddar Nothing!
    Is there any poss that you could help me with what i’m doing wrong regarding ‘short codes’ for the music. I use filen for storing my music, the smallest file i tried to use on wordpress was 2MB but is the file still too big? I don’t know how to ‘convert’ my files to ”bit rates”
    Any help would be greatly appreciated Phil. Music was always a big part of my blogging experience, and I do feel lost without it. I’m just so happy to have one wee widget to display a music file, but I definitely need to look for a new ‘theme’ as my present theme only accomadates one widget and NOTHING else in my right hand sidebar.
    I hope all is well with you phil! I ate two very small squares of thornton plain chocolate last night – AND I DIDN’T BLEED!!!!! woooooooooooooooohooooooooooooooooo!
    I took terrible stomach cramps in the middle of the night! I really thought that I was ”for it” but no blood!!! thank god! I really hope that you are doing well too! love to you !
    mags x

    • Hiiiiiiiiiyaaaaaaaaaaaaaaa Mags! :O)

      It’s all very simple Mags, just follow the directions on this page and you’ll have a friends list in no time! 🙂 If you need any help with it then come back and I shall help!

      Let me have a look at your page before I continue, to see what you’re working with. I see, first of all you can have as many widgets in your right sidebar as you like. Just drag and drop HTML widgets to the side and use them.

      I think you may be able to use the widget you’re already using, but I use a simple HTML widget to paste my music code in to. Here’s a tutorial I made: https://deadanarchistphil.wordpress.com/2010/12/02/how-to-get-a-media-player-on-your-wordpress-pageblog/ That will show you everything you need to get a music player on your space. What’s best about it is you don’t have to host anything because everything is already hosted on Youtube! :O) If ya need any help with it then give us a shout! :O)

      I haven’t had Thortons chocolate in a long while! But hey, it’s great news it doesn’t cause a bleed! I had a big Mac the other week! It was so damn good after not having it for ages, and it didn’t set me off. But, to be on the safe side I’m not going to eat it again untill I am off the steroids, that way I can tell if it really effects me! With you though, I think you’re alergic to something, maybe a Gluten alergy or something? I aint sure what it is but get the quaks to chase it up sooner, though they didn’t find anything, doesn’t mean what you have isn’t dangerous for you! So get ear-bashing! 😉

      Hugs to you mate, take care and talk soon! 🙂 xxx

  2. Pete Judge said

    hello….this looks like way too much like hard work but again Phil, I have to say surely your ability to get this down and explain it in plain english would be valuable somewhere….
    Take care mate


    • LOL! If you tried it Pete you’d see how easy it is, but I can see why you’d think it’s a little more complicated. It isn’t your thing anyway, but I will come up with something useful for you to use at some point! 😉

      Nah, no one will give me a Job doing this, this is basic HTML, and I barely know it! And I know next to nothing about CSS, which is sort of the new HTML! I need to do more study on it before anyone would even employ me.

      Hope the new job is going OK for you! 🙂

  3. prenin said

    I always thought you were a clever bugger Phil!!! 🙂

    Thanks for the visit and the comment!

    You have a point about people using your friends list to get at your mates on here, I have no idea how to send you a piccy – the last was taken at one of the Christenings I video recorded and I was pissed as a fart!!! LoL!!!

    On balance, best not to include me just in case we attract a tosser or three – I had a VERY bad experience on Spaces with Quaylood and his deviant posse of incarcerated American Prisoners who posted all kinds of deviant filth in my guestbook until I went friends only – and they kept trying to get in for a year or two!

    I agree about British Gas – I use Npower and I’m on Direct Debit so I get the cheapest rate and £100 per year payback plus whatever they’ve overcharged me by.

    I saved £1,000 over a couple of years and when they paid me back what they’d overcharged I was sitting pretty!!!

    It takes time to get to that position, so if you’re tempted don’t just jump straight in…

    I have no idea who is the cheapest, but after bad experiences with British Gas, Scottish Power etc. and all the lies and psychological mind-tricks off their salesmen I’m happy to stick to Npower…

    Have a great weekend my friend – I plan to race as soon as I have my email sorted.

    It’s truly amazing how addictive it is…#

    God Bless!


    • Hey! You’re the Computer programmer, not me, you’re the smart one! hahaha

      Quaylood? That man was a idiot. He never bothered with me much, if he ever popped up I ignored him or took the piss out of him. Many people on WLS played in to his hands by arguing with him or even giving a reaction! You should’ve ignored him, delete the crap he posted and then report him. He would’ve soon got bored and left you alone.

      But I understand about it, I’ll keep ya off there for the time being, I’m still in two minds of keeping my current large friends list.

      I wont be jumping straight in to any contract with any gas or electric supplier! To me, they’re all out to rip you off. They try to blame the price on whole sale gas, which is rubbish! They just want to maximise profits like every other company. In fact, they do it more because they know we have no choice but to pay up when Winter rolls around!

      Hope you enjoyed the racing man! 🙂

      • prenin said

        Thanks Phil! 🙂

        Yes, I enjoyed the racing until 4am when I ran out of steam.

        I woke at 3pm because the bloody T&RA were having a meeting so it was all slamming doors and the intercom buzzing!!!

        God Knows what time I’ll get to sleep today – I missed a dose of medication and that always messes me up…

        God Bless!


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: