.
,Sejarah jam gadang, danau singkarak, danau maninjau, hotel, tujuan wisata sumatera barat,daftar,jam gadang, fort de kock,West Sumatra, Sumatera Barat, Tourism

Distinguishing Feedback Writers And Visitors With jQuery

Posted By admin Sunday, March 27, 2011

Distinguishing Feedback Writers And Visitors With jQuery
Much has been discussed about how to distinguish the comment author with comments of visitors, even if we look at the search engines with keywords such then we will find thousands of bloggers to discuss the issue, from the master to the newbie. Tips blogger hack trick this time will not be using the same techniques (which have been discussed most bloggers using XHTML), but this time it will involve jQuery as its styler (read; giver touch). With some advantages of course, among others, more simple code used; more easily be modified, and please find yourself another advantage.
Requirements for Modifying Comments
Below are some things that must be applied before modifying comments, including:

* You must have a widget Blogger profile / about / about congenital bloggers.
* Templates you have already installed the jQuery library.

JQuery Code Comments
Step 1
Login to Blogger
Step 2
Go to "Design - Edit HTML"
Step 3
Checklist "Expand Widget Templates"
Step 4
Find the code below:

</ Head>

Step 5
Enter jQuery library below the above code in step 4:

<script src='http://code.jquery.com/jquery-latest.min.js' type='text/javascript'/>

Step 6
Find the code below (code below is available if you have a widget blogger profile):

<b:widget id='Profile1' locked='false' title='xxx' type='Profile'>

Enter (copy and paste) the code in step 7 here (which is on the block "xxx" as naming you provide)

<b:else/> <! - normal blog profile ->

Step 7
Enter (copy and paste) the following jQuery code between the code in step 6:

<script type='text/javascript'>
$ (). Ready (function () {
$ ('Dl # comments-block dt a'). Each (function (i) {
if ($ (this). attr ('href') == '<data:userUrl/>') {
$ (This). Parent ('dt'). AddClass ('author-comment'). Next ('dd.comment-body'). AddClass ('author-comment'). Next ('dd.comment-footer' ). addClass ('author-comment');
}
});
});
</ Script>

Step 8
Save the template and proceed to the next step ...

CSS Code Comments
Step 9
Find the code below:

]]></ B: skin>

Step 10
Enter (copy and paste) the CSS code below the above code in step 9:

dl # comments-block-comment {dt.author
background-image: none;
background-color: # EDE5BE;
margin-bottom: 0px;
padding: 6px 0 6px 10px;
border: 1px solid # ccc;
border-bottom: 1px solid # FFF7CF;
}

dl # comments-block-body.author dd.comment-comment {
color: # 593622;
background-color: # EDE5BE;
margin-top: 0px;
margin-bottom: 0px;
padding: 10px;
border: 1px solid # ccc;
border-top: 1px solid # CBC4AC;
}

dl # comments-block-footer.author dd.comment-comment {
background-color: # CBC39C;
padding: 3px;
margin-top: 0px;
border: 1px solid # ccc;
border-top: none;
}

Step 11
Save the template and preview your blog


Related Post



Follow by Email