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..

Facebook

Twitter

Pinterest

More

Less

Tumblr

Mix

E-Mail

GMail

LinkedIn

Reddit

XING

WhatsApp

Hacker News

VK

Telegram

OK

Messenger

Line

Copy Link