Creating Scroll On Comments

Creating Scroll On Comments, it is based on the idea or prediction that the longer the incoming comments will be growing a lot.. so the blog page will be long. To overcome this it made scrolling list of comments on it, so the blog does not appear elongated downward. The trick may be too complicated for simple.. this depends on your template. If yes.. the same code easy.. but if not the same..
If interested Creating Scroll On Comments, steps like this:

1. Log into your blogger acount, or to the Dashboard
2. Select Layout, then click Edit HTML
3. Find the code like below

/* Comments
-------------------------- */
#comments h4 {
margin:1em 0;
font-weight: bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color: $sidebarcolor;
}
#comments-block {
margin:1em 0 1.5em;
line-height:1.6em;
}
#comments-block .comment-author {
margin:.5em 0;
}

4. Add the following code above the code: # comments h4

#comments {
height:400px;
overflow:auto;
}

5. 400px numbers: it is the height of the scroll box, lives changed in accordance with our tastes.
6. If you already do not forget to Save the template

Note: Each template, the code is different, like on a blog DoFollow Link special Tea made me pretty confused, too, after 2 hours in doing things with new tooling to meet, code like this instead: Try to compare it with the code above, well yes ...

.navigation{display:block; text-align:center; margin-top:10px; margin-bottom:60px}
#comments {
height:400px;
overflow:auto;
}
.comments{color:#000; margin:1.5em 0pt 0pt; padding:0pt}
.comments a{color:$linkcolor}
.comments h3{font-size:1.6em}
.commentlist{color:#000; list-style-type:none; margin:1.5em 0pt 0pt; padding:0pt}
.commentlist li{margin-bottom:2em; padding:0.5em 1em}
.alt1{border:1px solid #F2F0E8; padding:0.5em}
.comment-footer a{color:$linkcolor}

Notice that the blue color is the code that is added to the scroll function of it. How to have a buddy .. difference is also what is not??.
Additional: If the way the above is still not fit, who try this:

1. Find the code like below:

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<div class='comments-singleblock'>
<dt class='comment-author' expr:id='&quot;comment-&quot; + data:comment.id'> 

2. If you have found. precise to add this code:

<div style='overflow:auto; width:ancho; height:400px;'>

3. Give the closing tag of the div that is add the code </ div> after the code </ dl>

You Might Also Like :