Friday, 5 October 2012

How to install latest comment box to blogger

Now add this cool comment box on your blogger/blogspot without coding knowledge . now i am giving some step that how can add this.
Now follow simple step to add this cool comment box to your blogspot now--->>>

* First go to your blogger dashboard.
* Now click on Design tab and edit HTML.
* Now expand your blogger template now.
* Again find this code ]]></b:skin> with CTRL+F Key.
* Copy below code and paste it just before  ]]></b:skin>

jQuery(document).ready(function($) {
#facebox .b {
background:url(http://bollywooodsargam.googlepages.com/b.png);
}
#facebox .tl {
background:url(http://bollywooodsargam.googlepages.com/tl.png);
}
#facebox .tr {
background:url(http://bollywooodsargam.googlepages.com/tr.png);
}
#facebox .bl {
background:url(http://bollywooodsargam.googlepages.com/bl.png);
}
#facebox .br {
background:url(http://bollywooodsargam.googlepages.com/br.png);
}
#facebox {
position: absolute;
width: 100%;
top: 0;
left: 0;
z-index: 100;
text-align: left;
}
#facebox .popup {
position: relative;
}
#facebox table {
margin: auto;
border-collapse: collapse;
}
#facebox .body {
padding: 10px;
background: #fff;
width: 370px;
}
#facebox .loading {
text-align: center;
}
#facebox .image {
text-align: center;
}
#facebox img {
border: 0;
}
#facebox .footer {
border-top: 1px solid #DDDDDD;
padding-top: 5px;
margin-top: 10px;
text-align: right;
}
#facebox .tl, #facebox .tr, #facebox .bl, #facebox .br {
height: 10px;
width: 10px;
overflow: hidden;
padding: 0;
}
*Now again find </head> tag And copy below code and paste before </head>
<script src='http://www.yourjavascript.com/619041821/jquery-1.2.2.pack.js'
type='text/javascript'></script>
<script src='http://www.yourjavascript.com/291121808/facebox.js'
type='text/javascript'></script>
<script type='text/javascript'>
$('a[rel*=facebox]').facebox() }) </script> * Now find below code
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <b:else/><data:post.numComments/></b:if></a>
* And replace above code with below code now.
<a href='#mydiv' rel='facebox'>NOW ADD YOUR COMMENTS</a>
</b:if>
</div>
<div id='mydiv' style='display:none'>
<b:include data='post' name='comment-form'/>

* Click to save your template now you are done.

No comments: