Cara MODIFIKASI Widget STATISTIK Blogger KEREN

Salam Blogger, kali ini BLOGGINGPASURUAN berbagi tutorial tentang “Cara MODIFIKASI Widget STATISTIK Blogger KEREN “ menggunakan background warna dengan horizontal style. Atau seperti gambar diatas

Adapun Fitur dari widget statistik blog ini:

√ Menampilkan Jumlah postingan

√ Menampilkan Jumlah Komentar

√ Menampilkan Total Tayang Laman

Silahkan ikuti langkah-langkah berikut menambahkan widget statistis blogger ini ke blog:

1.Pada Dasbor pilih menu Tata Letak

2.Tambah Gadget >> Pilih widget Statistik blog

Pada kolom konfigurasikan widget, anda tidak perlu mengganti nama atau memilih tampilan, langsung klik simpan dan klik simpan lagi.

3. Sekarang masuk menu Template >> Pilih edit HTML

4. Klik Ctrl+F dan cari kode ]]></b:skin>

5. Kemudian letakkan kode CSS berikut diatas kode ]]></b:skin>

#Stats1 ul{margin:0px 0;border:0;padding:0}

#Stats1 li{display:inline;width:28%;margin:0;border:0;background-color:#fff;background:#0090D5;color:#fff;float:left;padding:5px 7px;text-decoration:none;text-shadow:none;margin:0 1px 1px 0;font-size:12px;list-style-type:none}

#Stats1 h4{margin:0;font-size:18px;line-height:1.2em;color:#fff;text-shadow:none}

#Stats1 span{font-size:12px;color:#fff;text-shadow:none}

#totalComments{background-position:0 -68px}

#totalCount{background-position:0 -136px}

Anda bisa mengganti background, warna font pada kode CSS widget statistik diatas agar sesuai dengan desain template blog anda.

6. Klik Ctrl+F dan cari kode berikut:

<b:widget id='Stats1' locked='false' title='Total tayangan laman'type='Stats'/>

7. Setelah dapat, ganti kode tersebut dengan kode berikut:

<b:widget id='Stats1' locked='false' title='' type='Stats'>

  <b:includable id='main'>

<b:if cond='data:title'><h2><data:title/></h2></b:if>

    <div class='widget-content'>

      <ul>

        <li>

          <h4 id='Stats1_totalPosts'>&amp;hellip;</h4>

          <span>Posts</span>

        </li>

        <li id='totalComments'>

          <h4 id='Stats1_totalComments'>&amp;hellip;</h4>

          <span>Comments</span>

        </li>

        <li id='totalCount'>

          <h4 expr:id='data:widget.instanceId + &quot;_totalCount&quot;'>&amp;hellip;</h4>

          <span>Pageviews</span>

        </li>

      </ul>

      <script type='text/javascript'>

//<![CDATA[

function totalPosts(json){document.getElementById('Stats1_totalPosts').innerHTML=json.feed.openSearch$totalResults.$t};function totalComments(json){document.getElementById('Stats1_totalComments').innerHTML=json.feed.openSearch$totalResults.$t};document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalPosts\"><\/script><script type=\"text/javascript\" src=\"/feeds/comments/default?alt=json-in-script&max-results=0&callback=totalComments\"><\/script>');

//]]>

      </script>

    </div>

  </b:includable>

</b:widget>

Anda bisa mengganti tulisan yang memiliki background warna diatas dengan kata-kata anda sendiri

8. Simpan template dan lihat hasilnya diblog anda.

Demikian tutorial tentang Cara MODIFIKASI Widget Statistik Bawaan Blogger menjadi lebih KEREN selamat mencoba semoga bermanfaat..