How To Customize Linkwithin Related Post Widget

In this tutorial we will  add some background colors of the thumbnail images, change the font size and color text  of your Related Post titles, adjust the margin, add hover effects of your preferences, and if you want remove the  linkwithin credit and logo  link that appears  at the right bottom corner  of the widget.   In the  codes below ,we used a blue theme but as I said you can change it as you like or  add your creative new looks to match  perfectly with your blog looks and feel. Lets get the ball rolling!

How To Customize Linkwithin Related Post Widget

If you have not yet installed this widget, please click here for assistance
Step 1. Go to Blogger >> Template (Backup your template)
Step 2. Click Edit HTML
Step 3. Find the Code (Control F) below

]]></b:skin>

Step 4. Just above that code, paste the  code below

/* -----Linkwithin Stylesheet by http://bloggingtipsandtrix.blogspot.com/----- */ #linkwithin_logolink_0 {
display:none!important;
}
#linkwithin_logo_0 {display:none;}
#lws_0 {
clear: both!important;        margin: 0 0 20px 0!important;  
}

.linkwithin_outer{
margin: 0 8 20px 0!important;  
}
.linkwithin_text {
color:black!important;
font-size:20px!important;
padding-bottom:5px!important;
}
.linkwithin_posts a {
background: blue  !important;
border:5px,5px,5px,5px solid #404040!important;
margin:0px,10px,0px,0px ;
}
.linkwithin_posts a:hover {
background: dark blue !important;
}
.linkwithin_img_0 {
 border: 3px solid #dddddd !important; padding:1px !important;  width:100px!important; height:100px!important;
margin:0px,10px,0px,0px ;
}
.linkwithin_img_0:hover {
border: 2px  solid #333333 !important; padding:2px !important;
}
.linkwithin_title {
color:#020202!important;
font-family:'tahoma', sans-serif !important;
font-size:11px !important;
line-height:14px !important;
text-decoration: none;
border-top:1px solid  #ddd !important;
}
.linkwithin_title:hover {
border-top:1px solid  #333 !important;
}

Step 5.  Preview first and if it is working then save your template

Short Customizations:

Tip.  Use this tool to make changes to the color theme

• To change the color of the text "You May Also Like"  change the text black
• To change the font size edit 20px
• To change the container background color in active mode edit the text blue
• To change the container background color in mouse hover mode edit the text  dark blue
• To change the border across each thumbnail in active mode edit #dddddd image
• To change the border in mouse hover mode edit #333333
• To change the post title links color edit #020202
• Remove the  text in red in the above code if you want that the credit and logo link of  linkwithin  will appear in the plug- in

See your blog and see if it matched perfectly!  Enjoy!
Credits goes to My bloggertricks with little modification by me

About the Author:

Hello folks! This is GOLDEN WORKS TV, the admin of this blog. No words could described my grateful appreciations to all newbie and professional bloggers around the world and most especially to Almighty God who gave me the wisdom...Read More

Follow him @ Twitter |Facebook