Home » Blogger Tutorials, Tricks and Hacks » Blogger Graphics / Effects Tricks » Adding Fancy Black Skin for LinkWithin

Welcome to our AllBlogTools.com v.3 new version, We are still in beta, please contact us to report an error.

|| View All Tutorials ||

Adding Fancy Black Skin for LinkWithin

Adding Fancy Black Skin for LinkWithin

1 Star2 Stars3 Stars4 Stars5 Stars

Report Error


One of the fabulous plugins that you can add to your Blogger is showing related stories by posts belonging to similar tag or category is the LinkWithin. It is fast and reliable in encouraging readers to read a lot more then build your page reviews.

Mohammad Mustafa Ahmedzai shows you the way on how you can add this widget to your site. Below are the steps:

Step 1. Add the LinkWithin widget.

Step 2. Apply the Black Skin
1. Go to Blogger Dashboard > Template
2. Click Edit HTML > Proceed
3. Search this tag:


4. Copy and paste this code just above number 3 step.

/*---Related Posts---*/

#linkwithin_logolink_0 {

#lws_0 {

clear: both!important;       

margin: 0 0 20px 0!important;    


.linkwithin_outer {
 margin: 1px 0px !important;
 background:url("http://2.bp.blogspot.com/-UVq8GpplZro/ULPjAiKSKwI/AAAAAAAAIJs/XTh1n7Fyrew/s400/mbt-related-posts.gif") repeat scroll rgb(42, 42, 42);
 height: 260px;

 padding: 0px !important;
 box-shadow: 0px 4px 4px -4px rgba(0, 0, 0, 0.7) !important;
 border-radius: 5px 5px 5px 5px;

.linkwithin_inner {

.linkwithin_text {
margin: 0px !important;
 padding: 10px !important;
 font-family: "Droid Sans",Helvetica,Arial,sans-serif;
 font-size: 1.35em;
 color: rgb(255, 255, 255);
 font-weight: 700;
 line-height: 1.35em;
 text-transform: capitalize;
 background-color: rgb(18, 18, 18);
 border-bottom: 1px solid rgb(0, 0, 0);
 border-top-right-radius: 5px;
 border-top-left-radius: 5px;
 background-image: -moz-linear-gradient(center top , rgb(36, 36, 36), rgb(18, 18, 18));

.linkwithin_posts a {
 margin: 10px 0px 10px 20px !important;

.linkwithin_posts a:hover {
 margin: 10px 0px 10px 20px !important; background:none!important;

#linkwithin_logo_0 {display:none;}

.linkwithin_img_0 {
 border: 1px solid #666 !important;
 padding: 1px !important;
 width: 100px !important;
 height: 70px !important;
 margin-right: 20px !important;
 overflow: hidden;

.linkwithin_img_0:hover {
 border: 1px solid #666!important;
.linkwithin_img_0 div {
 width: 100px !important;
 height: 70px !important;

.linkwithin_title {
 color: rgb(255, 255, 255) !important;
 font-size: 1.1em !important;
 display: block;
 padding: 0px 10px 0px 0px !important;
 font-weight: 700 !important;
 line-height: 1.45em !important;
 margin-top: 10px !important;
 font-family: "Droid Sans",Helvetica,Arial,sans-serif !important;

.linkwithin_title:hover {


5. Click Save.

Note: Always have a backup first before editing your template.

Liked It ? Please Share


5 Responses | Post A Comment | Subscribe To Comments RSS Feed

  1. ajdpadbury says:

    Great tip, I use linkwithin on my blog and I will bookmark this post for when I use a black template in the future. Well done!

  2. yupz this a right

  3. Paragraph writing is also a excitement, if you be acquainted
    with afterward you can write if not it is complex to write.

Comments will be closed off on this post 365 days (1 year) after it is published. Apologies to this, but it's all about avoiding a growing comment spam problem. See our most recent posts where you can comment here