Dear friend,
If you are not a blogger you may want to click away now, go on I won't be offended I promise. But if you are a blogger then this could be exactly what you are looking for. Have you ever noticed how some bloggers have a list of linkies under their post and thought, how did they do that? If like me, you are a bit linky mad then you may have done. Shinners and the Brood did too and contacted me to ask just that.
I got fed up of adding or rather forgetting to add the link badges to my posts so I decided to add a permanent linky list. It took me a night of internet research to work out how to do it but I liked the result and it has saved me a lot of time too.
How to add a linky list under each post
The first line of code puts a border around the links. (Red)
<div style="border: 3px solid #e6e6e6; padding:1px;">
<center>
Insert here the code for the badges you want to have.
<br/></center></div>
Copy the linky codes from the linkups you take part in
Top tip! You need to remove some code.
Every linky badge code has a centre part at the beginning and you do not need that so remove the green bits before inserting. (Using the badge code for #ablogginggoodtime)
<div align="center">
<a href="http://www.diaryofanimperfectmum.com/p/family-fun-linky.html" rel="nofollow" title="Diary of an imperfect mum"><img src="http://i1026.photobucket.com/albums/y327/animperfectmum/IMG_2753_zpsscovh0ri.jpg" alt="Diary of an imperfect mum" style="border:none;" /></a></div>
The final code will look like this:
<div style="border: 3px solid #e6e6e6; padding:1px;">
<center>
<a href="http://www.diaryofanimperfectmum.com/p/family-fun-linky.html" rel="nofollow" title="Diary of an imperfect mum"><img src="http://i1026.photobucket.com/albums/y327/animperfectmum/IMG_2753_zpsscovh0ri.jpg" alt="Diary of an imperfect mum" style="border:none;" /></a>
<br/></center></div>
This is the hard bit – if you want all the badges to be the same size. You have to add a small bit of code. style="width: 60px;"
I have all of mine set to around 60px (because I wanted them all to fit on 1 line) but you can play with sizes until it looks right. You normally add this to the end of the linky code just before the final
/></a>
But if the linky code already uses a style = reference you need to do it before. For example:
<a href="http://www.diaryofanimperfectmum.com/p/family-fun-linky.html" rel="nofollow" title="Diary of an imperfect mum"><img src="http://i1026.photobucket.com/albums/y327/animperfectmum/IMG_2753_zpsscovh0ri.jpg" alt="Diary of an imperfect mum" style="border:none;" /></a>
<a href="http://www.diaryofanimperfectmum.com/p/family-fun-linky.html" rel="nofollow" title="Diary of an imperfect mum"><img src="http://i1026.photobucket.com/albums/y327/animperfectmum/IMG_2753_zpsscovh0ri.jpg" alt="Diary of an imperfect mum" style="width: 60px;" style="border:none;" /></a>
It sounds complicated but it isn’t. Really!
I added the code to the main part of the blog just under my post so it appears under every post but not on my main page.
This code makes a table with badges for: #ablogginggoodtime, #POCOLO
<div style="border: 3px solid #e6e6e6; padding:1px;">
<center>
<a href="http://www.diaryofanimperfectmum.com/p/family-fun-linky.html" rel="nofollow" title="Diary of an imperfect mum"><img src="http://i1026.photobucket.com/albums/y327/animperfectmum/IMG_2753_zpsscovh0ri.jpg" alt="Diary of an imperfect mum" style="width: 60px;" style="border:none;" /></a>
<a href="http://www.morganprince.com/p/pocolo.html" title="Post Comment Love"><img src=" http://i1302.photobucket.com/albums/ag124/MorganPrinceCom/post-comment-love-badge_zpsuix9kuvy.png" alt="Post Comment Love" style="width: 60px;" style="border:none;" /></a>
<br/></center></div>
Good luck!
96