Cara Mudah Membuat Widget Alexa dan Histat Berdampingan

Awalnya blog ini menggunakan kode histat hidden (tersembunyi) yang saya letakkan di atas </body> di HTML supaya tidak semua orang mengetahui traffic blog saya tercinta ini. Kemudian saya mencoba menampilkan widget histat di sidebar / footer, tapi karena lebar sidebar / footer 300px terasa kurang bagus jika dipasang sendirian.

Akhirnya saya tampilkan berdampingan dengan widget dari tante alexa meski agak gendut sih, tapi gak apa lah saya pasang ajah. Namun jika dipasang apa adanya, widget keduanya tampil atas bawah.

Karena itu saya ada tips buat anda semua untuk menampilkan widget histat dan alexa berdampingan kanan kiri seperti blognya mas yanto (wongcungkup.com) dengan menggunakan fungsi tabel seperti dibawah ini:

<table>

<tbody>

<tr>

<td>KODE ALEXA</td>

<td>KODE HISTAT</td>

</tr>

</tbody>

</table>

Untuk kode histat biasanya ada kode
<div id="histats_counter"></div>,

kemudian tambahkan kode CSS
style="margin-left: 10px;"
didalamnya supaya tidak terlalu rapat dan lebih rapi, sehingga menjadi seperti ini
<div id="histats_counter" style="margin-left: 10px;"></div>
Dan secara keseluruhan menjadi seperti ini :

<table><tr>

<td><a href="http://www.alexa.com/siteinfo/URL-BLOG"<script type="text/javascript" src="http://xslt.alexa.com/site_stats/js/t/a?url=URL-BLOG"></script>

</a></td>



<td> <div id="histats_counter" style="margin-left: 10px;"></div>

<script type="text/javascript">var _Hasync= _Hasync|| [];

_Hasync.push(['Histats.start', 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXX']);

_Hasync.push(['Histats.fasi', '1']);

_Hasync.push(['Histats.track_hits', '']);

(function() {

var hs = document.createElement('script'); hs.type = 'text/javascript'; hs.async = true;

hs.src = ('//s10.histats.com/js15_as.js');

(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(hs);

})();</script>

<noscript><a href="/" target="_blank"><img src="//sstatic1.histats.com/XXXXXXXXXXXXX" alt="Histat" /></a></noscript></td>

</tr></table>

Jika widget histat ada disebelah kiri, silahkan ganti CSS-nya menjadi
style="margin-right: 10px;". Jika blog anda menggunakan https tinggal hapus http pada url alexa diatas supaya bisa tampil.

Itulah sekedar berbagi tips kepada para sahabat blogger tentang cara membuat widget histat dan alexa berdampingan, mungkin saja ada yang ingin mencobanya. Perlu diketahui bahwa tips ini untuk kaum blogger saja ya!

Artikel Terkait