Comment Button Pop Up Comment Button Pop Up

Minggu, 29 Januari 2012

Modif Tombol Comment Pop-up untuk Blog Modif Tombol Comment Pop-up untuk Blog

Diposkan oleh AYIIEPH di 05.52 ·

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

Langganan: Poskan Komentar (Atom)