MyBlog: Shoutbox Berbasis Blogger

Akhirnya, setelah kurang lebih 2 hari berkutat dengan blog, mengutak-atik rahasia dibalik keterbatasan sebuah blogger. Malam ini, sudahlah, impian saya satu minggu belakangan ini - yang terus terang membuat tidur jadi tak nyenyak -, terwujud juga, meskipun masih ada satu dua yang belum terungkap dan memuaskan hati. Gak apa-apalah.

Shoutbox berbasis blogger malam ini ( 27-DES-2008 jam 10.20 WIB ) resmi di launching. Shoutbox ini mungkin bagi para penggila blogger, biasa-biasa saja, tidak secanggih buatan www.shoutmix.com yang paling banyak dimanfaatkan para netter untuk saling berinteraksi. Tapi terlepas dari itu, ada satu kepuasan tersendiri setelah memanfaatkan shoutbox ini.

Shoutbox berbasis blogger, maksudnya adalah shoutbox yang dibuat dengan memodifikasi sebuah blog dari blogger.com kemudian disulap jadi shoutbox. Koq Bisa...?

Prinsipnya sederhana saja, fasilitas inti dari blogger adalah Posting Artikel, bagian bawahnya ada bilik komentar yang bisa kita isi untuk mengomentari artikel tersebut. Nah bilik komentar ini yang kita otak-atik sedemikian rupa sehingga menjadi sebuah shoutbox berbasis blogger, sementara posting artikelnya kita buang saja. Itu saja.

Pekerjaan yang mungkin agak menyita pikiran dan waktu adalah menjelajahi tag-tag script blogger satu persatu, menerjemahkan maknanya, dan menyaring mana yang perlu diambil dan mana yang perlu dibuang sesuai kebutuhan.

Jika Anda mungkin saja tertarik untuk mengganti atau menambah shoutbox baru, barangkali shoutbox berbasis blogger ini bisa jadi pertimbangan anda.

Rahasianya :

Ikuti Langkah-langkah berikut:
Buka blogger.com, isi account anda

Setelah terbuka jendela admin, klik link Buat Blog, ikuti langkah-langkahnya sampai selesai, sampai mendapat alamat blog baru

Pada admin anda di blogger, pada alamat blog baru tersebut, buka TATA LETAK > PILIH TEMPLATE BARU > PILIH Sample II > SIMPAN TEMPLATE

Setelah itu buka Edit HTML, Centang pada Expand Template Widget, kemudian cari tag berikut body { , kemudian start dari tag tersebut ganti dengan script berikut sampai habis (ingat mengganti bukan menambah)

body {
margin:0;
font-family:Tahoma, Arial, sans-serif;
font-size:7pt;
background:$bgcolor;
color:$textcolor;
}

a:link {
color:$linkcolor;
text-decoration:none;
}

a:visited {
color:$visitedlinkcolor;
text-decoration:none;
}

a:hover {
color:$titlecolor;
text-decoration:underline;
}

a img {
border-width:0;
}

#outer-wrapper {
margin-top: 0px;
margin-$endSide: 1em;
margin-bottom: 0;
margin-$startSide: 0em;
}

h1 {
border-bottom:dotted 1px $bordercolor;
margin-bottom:0px;
color: $pagetitlecolor;
font: $pagetitlefont;
}

h1 a, h1 a:link, h1 a:visited {
color: $pagetitlecolor;
}

h2 {
margin:0px;
padding: 0px;
}

#main .widget {
padding-bottom:2px;
margin-bottom:20px;
border-bottom:dotted 0px $bordercolor;
clear: both;
}

#main .Header {
border-bottom-width: 0px;
}

h2.date-header {
padding-top:15px;
color:$footercolor;
padding-bottom:0px;
margin-bottom:0px;
font-size: 90%;
}

h3.post-title {
font-size: 140%;
color: $titlecolor;
}

.post {
padding-$startSide:5%;
padding-$endSide:10%;
}

.post-footer {
color:$footercolor;
}

#comments {
color:$textcolor;
padding-bottom:0px;
margin-bottom:0px;
font-weight:bold;
}

#comments .comment-footer {
font-size:1em;
font-weight:normal;
color:$footercolor;
margin-$endSide:10px;
display:inline;
padding-right:2px;
}

.comment-author {
margin-top: 1%;
}

.comment-body {
padding-top:1px;
font-size:1em;
font-weight:normal;
border-bottom:dotted 1px $bordercolor;
}

.deleted-comment {
font-style:italic;
color:gray;
}
.comment-link {
margin-$startSide:.6em;
}

.feed-links {
clear: both;
line-height: 2.5em;
}

#blog-pager-newer-link {
float: $startSide;
}

#blog-pager-older-link {
float: $endSide;
}

#blog-pager {
text-align: center;
}

.clear {
clear: both;
}

.profile-img {
float: $startSide;
margin-top: 0;
margin-$endSide: 5px;
margin-bottom: 5px;
margin-$startSide: 0;
}

body#layout #outer-wrapper {
margin-top: 0px;
margin-$endSide: 50px;
margin-bottom: 0;
margin-$startSide: 50px;
}

#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}

]]></b:skin>

<style>
html {
scrollbar-arrow-color: #333333;
scrollbar-base-color: #FFFFFF;
scrollbar-face-color: #F6F6F6;
scrollbar-shadow-color: #F6F6F6;
scrollbar-3dlight-color: #F6F6F6;
scrollbar-darkshadow-color: #FFFFFF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-track-color: #FFFFFF;
}
</style>

<script>

function resizeWindow()
{
document.getElementById('bodi').style.width="170px";
x=document.body.scrollHeight;
x=x+99999
window.scrollTo(0,x);
}

</script>

<script>
function smile()
{
var d=document.getElementsByTagName("em");
for (var i = 0; i < d.length; i++)
{
d[i].innerHTML = d[i].innerHTML.replace(/:m/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF9r7oLE7bjcZFYzUthDn77LP4hGk_bgYLBq_iU27Gpg29i68s-UEnOGx9I3fxQEljO0ScUiYy7cffu5eow9XJ6luOP-ZdMP2-qqga14uOM_q0gbfZuoy7tXjSl4L6sOnZbxtOwcD2sLlJ/s200/1.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:D/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhs8h3YZNMOMx5wsLmd2kkh-M-oxugjtzxFM2r1Xfdun2IMuQyvMpll9MVsnsZIfhtJKL_TXZx1ZSCPlP7qcY41uWvzQ5xw3LbpkhJ17EBtuMd0owNIDTOZwQxUgmYajput8mwF8PqgR645/s200/2.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:b/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheiCojQ3D1zIcJfaY3pfcJN8bJOoH7ea1S9kQ_Xl2-wwn09Mub7W6IXd05PbR3nfDK2pKZAZ7crzH_9S0xfywj_rhTrdsmdjxDwROJDbnEbHscshQeRWFQgIhqo1iVCu07CPcog950mJRW/s200/3.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:c/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7jxciF33XxcCC1ZL4SJxkBDXPXxusRe98dWEd5i53T2vrQGZk0pLgFvdurAkgbkKyzLKG-ZLVbXIp8X-cqesEbXVW3pZpvKoe4GL5izjA8me41uhGb_flC9gXmcJFohOovSKnbcwZGYBF/s200/4.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:p/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgX5nX4rZBHCiIx2KTF7gKxyOVE6MXWMs7OjyxYe_XTcqy-jGPEod-X-jDeHd7Bqk06Z-kP3qnytUNvDPJtmLMzBfVZHQHrqGdxOkVAE20jBqNZL6YXuZ7VxbjxoJk8-Om-DNn468M3iv5W/s200/5.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:a/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglZQwOplVx7pqk5hC3oCl3VUAM_LVgf6pFYIMqC9zt5Xj9y8a11tjxAT7LHOBKPYLLd14UKesHQin8C1hlI6mTIPZJKM079nkOofmm8Ux5KbEt0wGqsnPi_lJqTJ0VjqR8jEjAYGxli1tU/s200/6.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:k/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLoVRZuk71XaRSdJljxLJgPy0qhr2XTWTSFpPFnRXiOUUsT6TRSMik-kXznIidIZ8d5upJbq-1edKTcCOu8f0ZZj_5sO2LQdbJgrQI1PCrcuWRRHTmISvDa4MTXS1VxFF75KGjawdDceSq/s200/7.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:e/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ3DOQ_Rt63seVUvzIP7_DJUi34IRKKWT_jMUsZ6_LczHT2RVvCO784NInc3mkQIRsxGUG2-3mBWwFRhjBL9WN_I9kXnlrt73pUViFFPIyBrXJIRloDKcjCEfafr18w3YiJ1kbxS914nd_/s200/8.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:f/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga21cDIuX9krmWZQZEp543D_z6dXAh3SHA1S6pQxTzJA2UCRAg-9CGcjPFwHDhCBCqfuZGKOkvSr0t6GSlkXspoySSVwcpwkiOiupGZfNWB8c4tgp4k4Znb58eDFRkZCIKt8_jAq46TXyC/s200/9.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:x/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8Uww-bZ6Ktc-eTDsp7B7MGLA5Ps6AeB5WG2Y9aEoOLbHLG5vxn8JdaQkq-PFt_QDCfEjDBArAjZ7OFFmlxsyejhdtdLueWdWG6EcdU2UHbo_f_DvUshH-A3lttA828L3RNTzSINw9Osej/s200/10.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:o/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5pbEjiU2TBwWw2F4-GnrN3XlHKuGu4KMYPgfXS3bBViBLwuKcE2Y6RpEnKZT2Zs24o1upl8vukKJehYRg0rfIj8svFIo6zeUnvnT1koero4-LKFPfRLOlAvz1LIUOi3Texr0Od1OZThFO/s200/11.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:L/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7AoQDpHEXRRrA0RM6_MIfmooPNMxvn_hyBIMiSZT-uK17Aam5c6A6dgS0aMWiFvF9VQmMemynM8gc8ZTcsU64g3m83X95gfuD52Pdma3RxQ6t0EsLOC76abr0MlsEoYRY_sTztCYgxoum/s200/12.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:r/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMQ1SadysKaY_sBLnnezoyS9hM54oklyHvU8031Sr6t8MeiR5ETVglKTONauvuD6ChMNBbNi00jizS0ZYqtmuGKsSYT5PiEMDlrfo79fVR7lzK0VO2DemUUhjZ6s5b21pt-IPFti8wPCYV/s200/13.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:y/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5v8tEMMzKj46xq9fsZX8NBVBaqyXGEsRDzyR5EJfhWfZi7TNH7s_cydHpeE8o_V-bIvyIVrzRpAguk6bt7BNSse4zyqERuiA1XkCckfnBfitC7IMKDyEBtKIDNLjSsGp0mDr2FOvaSO7m/s200/14.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:t/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4LXbpM9jneyc3Owr0ZWDqVRGX17Zbc21CQZRGvIILwkQOvLIUJ2B8FIAJ4zlS1xB2LpQGFQDin8QwGPL7Eg76gzGjXgdHeQwq5ZyLARmcoPEtW7dqiDCLe9n_ey9smmhxoA_e3MlS4mGz/s200/15.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:s/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwd0elpF_U7ut55ueuFeo04eSvqHVytPRrckfTA_cYNgOHKk9eyKvlVZJTo55DGT8R0CX6Goxz45DGfn3nbE3WU3tNJwg4HfiQITFyKCXsUewqTvT_AgHnETBCog6ttjzvjckeDqbC4czP/s200/16.gif' style='border:0; margin:0; padding:0;'/> ");
d[i].innerHTML = d[i].innerHTML.replace(/:v/, " <img id='new' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuK6KNxTKJUuI0JPEQYoflqJh5FBSqF4wJ34CfHVsvLaULkx71TIddCkJXW2v6Ee5PqHxT7fO2gXeAe86RpaGgaUMdCLfqMWIDYgeK2DRnAGS9Iu7C8IiWidnQsqiJHX7NWnKwbTOWnuGV/s200/17.gif' style='border:0; margin:0; padding:0;'/> ");

}
}

</script>

</head>
<body id='bodi' onload='resizeWindow(),smile()'>
<div id='outer-wrapper'>
<b:section class='main' id='main' showaddelement='yes'>
<b:widget id='Blog1' locked='true' title='Posting Blog' type='Blog'>
<b:includable id='nextprev'/>
<b:includable id='backlinks' var='post'/>
<b:includable id='post' var='post'/>
<b:includable id='commentDeleteIcon' var='comment'/>
<b:includable id='feedLinks'/>
<b:includable id='status-message'/>
<b:includable id='comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<h4 id='comment-post-message'><data:postCommentMsg/></h4>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize' frameborder='0' height='275' id='comment-editor' scrolling='no' src='' width='100%'/>
<data:post.iframeColorizer/>
</div>
</b:includable>
<b:includable id='backlinkDeleteIcon' var='backlink'>
<span expr:class='"item-control " + data:backlink.adminClass'>
<a expr:href='data:backlink.deleteUrl' expr:title='data:top.deleteBacklinkMsg'>
<img src='http://www.blogger.com/img/icon_delete13.gif'/>
</a>
</span>
</b:includable>
<b:includable id='feedLinksBody' var='links'>
<div class='feed-links'>
<data:feedLinksMsg/>
<b:loop values='data:links' var='f'>
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
</b:loop>
</div>
</b:includable>
<b:includable id='postQuickEdit' var='post'>
<b:if cond='data:post.editUrl'>
<span expr:class='"item-control " + data:post.adminClass'>
<a expr:href='data:post.editUrl' expr:title='data:top.editPostMsg'>
<img alt='' class='icon-action' height='18' src='http://www.blogger.com/img/icon18_edit_allbkg.gif' width='18'/>
</a>
</span>
</b:if>
</b:includable>
<b:includable id='comments' var='post'>
<div class='comments' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>
<h4>
<data:post.numComments/> <data:commentLabelPlural/>:
</h4>

<b:if cond='data:post.commentPagingRequired'>
<span class='paging-control-container'>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'><data:post.oldestLinkText/></a>
 
<a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'><data:post.olderLinkText/></a>
 
<data:post.commentRangeText/>
 
<a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'><data:post.newerLinkText/></a>
 
<a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'><data:post.newestLinkText/></a>
</span>
</b:if>

<div id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<div expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:comment.authorUrl'>
<u><a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'><data:comment.author/></a></u>
<b:else/>
<data:comment.author/>
</b:if>
</div>
<div class='comment-body'>
<em style='font-style: normal'><data:comment.body/></em>
</div>
<div class='comment-footer'>
<span class='comment-timestamp'>
<data:comment.timestamp/>
<b:include data='comment' name='commentDeleteIcon'/>
<br/><br/>
</span>
</div>
</b:loop>
</div>

<b:if cond='data:post.commentPagingRequired'>
<span class='paging-control-container'>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'>
<data:post.oldestLinkText/>
</a>
<a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'>
<data:post.olderLinkText/>
</a>
 
<data:post.commentRangeText/>
 
<a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'>
<data:post.newerLinkText/>
</a>
<a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'>
<data:post.newestLinkText/>
</a>
</span>
</b:if>
<a name='tagi'/>
<p class='comment-footer' style='display:none'>

<b:if cond='data:post.embedCommentForm'>
<b:include data='post' name='comment-form'/>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>

</p>
</b:if>

<div id='backlinks-container'>
<div expr:id='data:widget.instanceId + "_backlinks-container"'>
<b:if cond='data:post.showBacklinks'>
<b:include data='post' name='backlinks'/>
</b:if>
</div>
</div>
</div>
</b:includable>
<b:includable id='main' var='top'>

<div class='blog-posts hfeed'>

<b:include data='top' name='status-message'/>

<data:adStart/>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.dateHeader'>

</b:if>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == "item"'>
<b:include data='post' name='comments'/>
</b:if>
<b:if cond='data:post.includeAd'>
<data:adEnd/>
<data:adCode/>
<data:adStart/>
</b:if>
</b:loop>
<data:adEnd/>
</div>


<b:include name='nextprev'/>


<b:include name='feedLinks'/></b:includable>
</b:widget>
</b:section>
</div>
<a name='akhir'/>
</body>
</html>

Kemudian Simpan Template

Jika ada konfirmasi, bahwa ada beberapa bagian akan hilang, iyakah saja, jangan di cancel

Selanjutnya Buka Posting > Buat > pada judul beri nama tagboard > isi juga dengan text "tagboard "> Lalu klik tombol TERBITKAN ENTRI

Langkah selanjutnya adalah klik Edit Entri, klik Edit pada posting tagboard, pada alamat address diatas anda copy misalnya, contoh http://www.blogger.com/post-edit.g?blogID=159448502601129649&postID=7058609445779607059, catat kemudian simpan di mana saja (gunakan word atau notepad).

Jangan Lupa bagian yang berwarna merah ganti dengan https://www.blogger.com/comment.g?

Langkah berikutnya adalah Klik Dasbor, pilih Blog Utama anda (bukan blog yang baru saja dibuat), pilih TATA LETAK > ELEMEN HALAMAN > TAMBAH GADGET > JAVASCRIPT/HTML, beri judul (terserah anda), masukkan script berikut

<script>
function buka()
{
document.getElementById('senyum').style.display='block';
}

function tutup()
{
document.getElementById('senyum').style.display='none';
}

function urlb()
{
tagboard.location="http://blablablabla.blogspot.com/2008/12/tagboard.html";
}

</script>

<button style="font-size:8pt;font-family:verdana" onclick="buka()">smiley</button> <button style="font-size:8pt;font-family:verdana"
onclick="window.open('https://www.blogger.com/comment.g?blogID=373275764743544501&postID=1498817755825565850&isPopup=true','mywindow','width=400px, height=500px,scrollbars=yes,resizable=yes,left=200,top=100,screenX=200,screenY=100')" >input</button> <button style="font-size:8pt;font-family:verdana" onclick="urlb()">refresh</button>

<table id="senyum" style="position:relative;top:10px;left:10px;display:none" width="120px" height="200px" bgcolor="#ffffff">
<tr>
<td>:m</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgF9r7oLE7bjcZFYzUthDn77LP4hGk_bgYLBq_iU27Gpg29i68s-UEnOGx9I3fxQEljO0ScUiYy7cffu5eow9XJ6luOP-ZdMP2-qqga14uOM_q0gbfZuoy7tXjSl4L6sOnZbxtOwcD2sLlJ/s200/1.gif"/></td>
<td>:D</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhs8h3YZNMOMx5wsLmd2kkh-M-oxugjtzxFM2r1Xfdun2IMuQyvMpll9MVsnsZIfhtJKL_TXZx1ZSCPlP7qcY41uWvzQ5xw3LbpkhJ17EBtuMd0owNIDTOZwQxUgmYajput8mwF8PqgR645/s200/2.gif"/></td>
</tr>
<tr>
<td>:b</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheiCojQ3D1zIcJfaY3pfcJN8bJOoH7ea1S9kQ_Xl2-wwn09Mub7W6IXd05PbR3nfDK2pKZAZ7crzH_9S0xfywj_rhTrdsmdjxDwROJDbnEbHscshQeRWFQgIhqo1iVCu07CPcog950mJRW/s200/3.gif"/></td><td>:c</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7jxciF33XxcCC1ZL4SJxkBDXPXxusRe98dWEd5i53T2vrQGZk0pLgFvdurAkgbkKyzLKG-ZLVbXIp8X-cqesEbXVW3pZpvKoe4GL5izjA8me41uhGb_flC9gXmcJFohOovSKnbcwZGYBF/s200/4.gif"/></td>
</tr>
<tr>
<td>:p</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgX5nX4rZBHCiIx2KTF7gKxyOVE6MXWMs7OjyxYe_XTcqy-jGPEod-X-jDeHd7Bqk06Z-kP3qnytUNvDPJtmLMzBfVZHQHrqGdxOkVAE20jBqNZL6YXuZ7VxbjxoJk8-Om-DNn468M3iv5W/s200/5.gif"/></td><td>:a</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEglZQwOplVx7pqk5hC3oCl3VUAM_LVgf6pFYIMqC9zt5Xj9y8a11tjxAT7LHOBKPYLLd14UKesHQin8C1hlI6mTIPZJKM079nkOofmm8Ux5KbEt0wGqsnPi_lJqTJ0VjqR8jEjAYGxli1tU/s200/6.gif"/></td>
</tr>
<tr>
<td>:k</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLoVRZuk71XaRSdJljxLJgPy0qhr2XTWTSFpPFnRXiOUUsT6TRSMik-kXznIidIZ8d5upJbq-1edKTcCOu8f0ZZj_5sO2LQdbJgrQI1PCrcuWRRHTmISvDa4MTXS1VxFF75KGjawdDceSq/s200/7.gif"/></td><td>:e</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ3DOQ_Rt63seVUvzIP7_DJUi34IRKKWT_jMUsZ6_LczHT2RVvCO784NInc3mkQIRsxGUG2-3mBWwFRhjBL9WN_I9kXnlrt73pUViFFPIyBrXJIRloDKcjCEfafr18w3YiJ1kbxS914nd_/s200/8.gif"/></td>
</tr>
<tr>
<td>:f</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga21cDIuX9krmWZQZEp543D_z6dXAh3SHA1S6pQxTzJA2UCRAg-9CGcjPFwHDhCBCqfuZGKOkvSr0t6GSlkXspoySSVwcpwkiOiupGZfNWB8c4tgp4k4Znb58eDFRkZCIKt8_jAq46TXyC/s200/9.gif"/></td><td>:x</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh8Uww-bZ6Ktc-eTDsp7B7MGLA5Ps6AeB5WG2Y9aEoOLbHLG5vxn8JdaQkq-PFt_QDCfEjDBArAjZ7OFFmlxsyejhdtdLueWdWG6EcdU2UHbo_f_DvUshH-A3lttA828L3RNTzSINw9Osej/s200/10.gif"/></td>
</tr>
<tr>
<td>:o</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5pbEjiU2TBwWw2F4-GnrN3XlHKuGu4KMYPgfXS3bBViBLwuKcE2Y6RpEnKZT2Zs24o1upl8vukKJehYRg0rfIj8svFIo6zeUnvnT1koero4-LKFPfRLOlAvz1LIUOi3Texr0Od1OZThFO/s200/11.gif"/></td><td>:L</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7AoQDpHEXRRrA0RM6_MIfmooPNMxvn_hyBIMiSZT-uK17Aam5c6A6dgS0aMWiFvF9VQmMemynM8gc8ZTcsU64g3m83X95gfuD52Pdma3RxQ6t0EsLOC76abr0MlsEoYRY_sTztCYgxoum/s200/12.gif"/></td>
</tr>
<tr>
<td>:r</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMQ1SadysKaY_sBLnnezoyS9hM54oklyHvU8031Sr6t8MeiR5ETVglKTONauvuD6ChMNBbNi00jizS0ZYqtmuGKsSYT5PiEMDlrfo79fVR7lzK0VO2DemUUhjZ6s5b21pt-IPFti8wPCYV/s200/13.gif"/></td><td>:y</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5v8tEMMzKj46xq9fsZX8NBVBaqyXGEsRDzyR5EJfhWfZi7TNH7s_cydHpeE8o_V-bIvyIVrzRpAguk6bt7BNSse4zyqERuiA1XkCckfnBfitC7IMKDyEBtKIDNLjSsGp0mDr2FOvaSO7m/s200/14.gif"/></td>
</tr>
<tr>
<td>:t</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4LXbpM9jneyc3Owr0ZWDqVRGX17Zbc21CQZRGvIILwkQOvLIUJ2B8FIAJ4zlS1xB2LpQGFQDin8QwGPL7Eg76gzGjXgdHeQwq5ZyLARmcoPEtW7dqiDCLe9n_ey9smmhxoA_e3MlS4mGz/s200/15.gif"/></td><td>:s</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwd0elpF_U7ut55ueuFeo04eSvqHVytPRrckfTA_cYNgOHKk9eyKvlVZJTo55DGT8R0CX6Goxz45DGfn3nbE3WU3tNJwg4HfiQITFyKCXsUewqTvT_AgHnETBCog6ttjzvjckeDqbC4czP/s200/16.gif"/></td>
</tr>
<tr>
<td>:v</td><td><img id="new" style="border:0; margin:0; padding:0;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuK6KNxTKJUuI0JPEQYoflqJh5FBSqF4wJ34CfHVsvLaULkx71TIddCkJXW2v6Ee5PqHxT7fO2gXeAe86RpaGgaUMdCLfqMWIDYgeK2DRnAGS9Iu7C8IiWidnQsqiJHX7NWnKwbTOWnuGV/s200/17.gif"/></td>
</tr>
<tr><td colspan="2" align="right"><button onclick="tutup()">Tutup</button></td></tr>
</table>

<iframe width="190px" frameborder="0" src="http://blablablabla.blogspot.com/2008/12/tagboard.html#akhir" marginheight="0px" name="tagboard" height="400px" marginwidth="0px"></iframe>
<div style="font-size:10px;font-family:verdana" align="left">
**Tekan Tombol <b>Refresh</b> setelah <b>Input ShoutBox</b>**
</div>

Ganti bagian yang berwarna hijau dengan alamat blog anda; 2008, ganti dengan tahun sekarang, 12 ganti dengan bulan sekarang

Bagian yang berwarna biru ganti dengan alamat yang tadi anda simpan pada word/notepad

setelah itu anda simpan
SELAMAT MENCOBA SEMOGA BERHASIL

27 comments:

Anonim mengatakan...: Mo coba kalu berhasil aq balik lapor; 28 Desember 2008 pukul 02.40
Anonim mengatakan...: Mantap keren tuch posting....

Sukses Selalu Bro...; 28 Desember 2008 pukul 04.04
MITRA mengatakan...: mantap banget, ini yang gua cari2, trims bos; 28 Desember 2008 pukul 05.59
Anonim mengatakan...: Lebih enak yah buat dipake blogging dr HP....; 29 Desember 2008 pukul 17.14
Unknown mengatakan...: good job mas...........; 31 Desember 2008 pukul 11.01
tiyo avianto mengatakan...: waduh kok susah sih mas....; 5 Januari 2009 pukul 06.15
tiyo avianto mengatakan...: berati harus punya akun blogger baru ya...; 5 Januari 2009 pukul 06.23
MITRA mengatakan...: tapi ceritanya kepanjangan BOS,
saya cuma pakai paragraf yang paling bawah, tanpa bertele-tele buat akun baru segala; 6 Januari 2009 pukul 16.33
IGES BATAM mengatakan...: Shoutbox berbasis blogger awalnya saya buat agar bisa semirip mungkin dengan shoutboxnya shoutmix yang sudah umum digunakan, biar lebih familiar. Karena memanfaatkan jendela Iframe, Resikonya ya harus menggunakan blog baru, kebetulan blogger menyeiakan fasilitas create blog baru tanpa harus mengubah account.

Tapi jika ada yang bisa membuat inovasi yang lebih bagus lagi. Saya sangat respek dengan hal tersebut. Dan jangan lupa dibagi biar bisa di bedah lagi. He he he; 6 Januari 2009 pukul 17.27
Sekolah Pramugari INTERSKY mengatakan...: Siang Mas Abdul Gamal,
Saya juga tertarik untuk membuat Shoutbox Ala mas.
Tapi saat ini saya menggunakan WP sebagai medianya, kira2 caranya gimana ya... Thx B4; 8 Januari 2009 pukul 12.58
Anonim mengatakan...: Wah mantap sekale idenya. siiip...; 8 Januari 2009 pukul 14.35
MITRA mengatakan...: ok juga tuh, tapikan masalahnya bukan hanya bisa mengetahui kode masuknya komentar. Masalahnya kalo di shoutmix koment gak masuk sama sekali ke blog kita, sedangkan ini tetap aja jadi komentarnya di blogger walaupun hanya masuk lewat form koment aja, untungnya yang koment lebih ringan masuknya aja, dan ini tidak merugikan yang punya blog. DISINI KEUNGGULAN BLOGGER. Mau masuk lewat mana aja tetap aja ke indeks karena tetap masuk dalam Komentar Blogger.; 8 Januari 2009 pukul 21.16
MITRA mengatakan...: tapi trims infonya, my shoutbox bisa jadi lebih ringkas lagi nih, ayo berkreasi lagi!; 8 Januari 2009 pukul 21.30
IGES BATAM mengatakan...: ia benar, Anda Hebat !!!, BTW Jangan lupa
jika ada info baru yang bisa di hack lagi ingat BLOG PROJECT; 9 Januari 2009 pukul 10.42
Anonim mengatakan...: Waahh kerennn,...; 12 Januari 2009 pukul 02.32
Anonim mengatakan...: yeeeeeeesssssssssssssss good; 12 Januari 2009 pukul 05.29
Sam El mengatakan...: yeeeessssssssssssssss
saya berhasil pak!!makasih yah atas masukannya!hehehe,; 16 Januari 2009 pukul 00.06
Sam El mengatakan...: pak ada yang mau sy tanyakan neh, kata teman2 ku yang lain, koment itu bisa jadi salah satu cara menaikan pagerank di google krn setiap komen di indeks ma google,betul gak pak?apabila betul, kl githu dengan shoutbox buataan bapa, yang jadi di indeks google adalah blog yang "dikanibal" jadi shoutbox yah pak?
makasih yah pak :); 16 Januari 2009 pukul 10.51
Anonim mengatakan...: Pernah dengar pepatah "sekali mendayung 2-3 pulau terlampaui". PR naik salah satunya karena banyaknya kunjungan ke blog. Jika setiap kunjungan kasih komentar. Maka blogmu dianggap oleh robot spider google seolah olah ter UPDATE terus dan itu merupakan salah satu penilaian. Karena kamu udah pasang shoutbox berbasis blogger maka setiap ada kunjungan ke blog kamu, blogmu yang lain yang di kanibal tadi ikut terkunjungi, lebih mantap lagi kalo pengunjung menyimpan komentar di situ.; 16 Januari 2009 pukul 14.31
Sam El mengatakan...: ohhh githu pak,, makasih yah pak atas jawabannya,,makasih :); 17 Januari 2009 pukul 03.41
Anonim mengatakan...: pak gimana yah caranya supaya gak pake button input,,jadi langsung nulis comment dan tinggal refresh?.seperti di http://astawama.blogspot.com/ tp menurut sy masih bagusan punya bapak, krn gak harus pake back2an segala..sy dah coba kotak katik pake iframe tp belom sesempurnanya yg pake input..kira2 gimana ya pak?hehehe
makasih pak; 19 Januari 2009 pukul 10.50
[ Uda ] mengatakan...: bozz, yang warna hijau tersebut.. nama blog utama atau nama blog tambahan..?; 28 Maret 2009 pukul 17.21
admin mengatakan...: @uda,blog tambahan; 28 Maret 2009 pukul 22.02
Anonim mengatakan...: Lanjutttkann!!!!!; 24 Mei 2009 pukul 07.48
greatings mengatakan...: Terima kasih atas info menarik ini.
Sangat berguna.; 18 September 2009 pukul 14.26
Probiopedia mengatakan...: Informasi ini sangat cantik dan indah...; 4 Maret 2010 pukul 21.31
Anonim mengatakan...: tingkatkan...; 14 Juni 2012 pukul 09.55

Kamis, 25 Desember 2008

Shoutbox Berbasis Blogger

Related Posts by Categories

27 comments:

Posting Komentar

MyBlog

Form Login

Member List

Kategori

Site Statistik

ShoutBox

Font Style Setting

Blog List

Arsip Blog

Langganan

Pengikut

	FACEBOOK MENU FB FRIEND CONNECT Dr. ABDUL GAMAL ADD ME AS FRIEND MY FRIENDS WALL TO WALL SEND ME MESSAGE NOTIFICATIONS NOTES