How to add a linky list under your blog post

/


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!


My favourite link ups...

Reflections From Me Rhyming with Wine Diary of an imperfect mum #PointShoot Tammymum Diary of an imperfect mum Post Comment Love You Baby Me Mummy OneDad3Girls Laura's Lovely Blog The Me and Mine Project
©animperfectmum ~ www.diaryofanimperfectmum.com 2014 - present day. Unauthorized use and/or duplication of this material without express and written permission from this site’s author is strictly prohibited. Excerpts and links may be used, provided that full and clear credit is given to animperfectmum with appropriate and specific direction to the original content.
Back to Top