Adding Fancy Black Skin for LinkWithin

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:

]]></b:skin>

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

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

#linkwithin_logolink_0 {
display:none!important;
}

#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;
 width:590px!important;

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

important;
 border-radius: 5px 5px 5px 5px;
 }

.linkwithin_inner {
width:590px!important;
}

.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 {
 border-right:0px!important;
 margin: 10px 0px 10px 20px !important;
}

.linkwithin_posts a:hover {
 border-right:0px!important;
 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;
 background:#666!important;
}

.linkwithin_img_0:hover {
 border: 1px solid #666!important;
opacity:0.8;
}
.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;
 text-decoration:none!important;
 width:120px!important;
}

.linkwithin_title:hover {
text-decoration:underline!important;

}

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