Senin, 27 Agustus 2012

Modif Tombol Comment Pop-up untuk Blog

·
Secara Default URL Blogspot Comment Pop-up itu kaya gini:
http://www.blogger.com/comment.g?blogID=5529811974956695357&postID=4684471717731621984&isPopup=true

Cara nyari blogID sama postID yang gw pake:
Di Blogspot dengan Template Standard, biasa ada..
di Bagian Head:
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://www.blogger.com/rsd.g?blogID=5529811974956695357" />
di Widget Blog:
<a name='4684471717731621984'></a>

Gw pake JavaScript buat ngambil yang gw butuhin dari situ:
<script type="text/javascript">

var linkHead = document.getElementsByTagName('head')[0].getElementsByTagName('link');

for(x in linkHead){
  if(linkHead[x].rel=='EditURI'){
    var IdBlog = linkHead[x].href.split('=')[1];
    break;
  }
}

var IdPostBlog = document.getElementsByClassName('post')[0].getElementsByTagName('a')[0].name;
var commentPopUpUri = 'http://www.blogger.com/comment.g?blogID='+IdBlog+'&postID='+IdPostBlog+'&isPopup=true';


//Hasilnya..
document.write('<a class="tombol-komen" href="'+commentPopUpUri+'" target="_blank">Write a Comment</a>');

//Atau untuk Pop-up window..
document.write('<a class="tombol-komen" href="javascript:void(0)" onClick="window.open(\''+commentPopUpUri+'\',\'komentar\',\'width=400,height=600,scrollbars=yes\')">Write a Comment</a>');


</script>

Untuk tampilan Tombol sebagai contoh gw pake CSS ini..
<style type="text/css">
.tombol-komen{
  display:inline-block; 
  font-family:"lucida grande",tahoma,verdana,arial,sans-serif;
  font-weight:bold; 
  font-size:11px; 
  color:white; 
  padding:1px 7px; 
  margin:0 2px;
  border:1px outset darkblue; 
  cursor:pointer; 
 -moz-border-radius:3px; 
  border-radius:3px; 
  background:#629BF0; 
}
.tombol-komen:hover, .tombol-komen:focus, .tombol-komen:active{
  border:1px outset black; 
  background:#32373C; 
  color:yellow; 
  text-decoration:none;
  outline:none;
}
</style>

Jadinya kaya gini.. Write a Comment




Buat nempatin tombol komen sesuai dengan tempat yang gw mau,
biasa gw bikin element dengan id="tempat-buat-tombol-komen"
<span id="tempat-buat-tombol-komen"></span>
Terus gw tempatin element ini dimana gw mau.

Buat ngisi element itu, gw tinggal nambahin di script yang tadi..
document.getElementById('tempat-buat-tombol-komen').innerHTML = '<a class="tombol-komen" href="javascript:void(0)" onClick="window.open(\''+commentPopUpUri+'\',\'komentar\',\'width=400,height=600,scrollbars=yes\')">Write a Comment</a>';


See Basic JavaScript How To at

0 komentar:

Posting Komentar

handapeunpost