Showing posts with label Widget / Gadget. Show all posts

Menghapus / Menghilangkan Navbar Blogger

Cyber News di December 26, 2012 0

Navbar (navigation bar) default dari blogger biasanya terletak pada bagian paling atas dari sebuah blog. Navbar ini sering kali di hapus oleh para blogger karena di anggap memiliki kode yang tidak valid atau error, di samping stylenya yang kurang memuaskan bagi para blogger.

Pada tutorial ini saya akan share cara untuk menghilangkan navbar blogger tersebut ataupun hanya sekedar menyembunyikannya saja.

Berikut salah satu caranya :

Masuk ke akun blogger anda
Klik pada Template. (jangan lupa backup dulu template anda, untuk menghindari sesuatu yang tidak diinginkan).
Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
Beri tanda centang pada Expand Template Widget.
Cari kode ]]></b:skin>, lalu letakkan kode berikut diatas kode ]]></b:skin>
#navbar-iframe {
height:0px;
visibility:hidden;
display:none
}
Terakhir klik Simpan Template.

Pada langkah di atas sobat sudah menyembunyikan / tidak menampilkan Navbar bawaan Blogger, namun pada template blog sobat masih terdapat kode dari Navbar tersebut.

Untuk cara kedua Menghilangkan Navbar bawaan Blogger, Sobat dapat melakukan langkah di bawah ini :

Sama seperti cara pertama. Masuk ke akun blogger anda
Klik pada Template.
Lalu klik Edit HTML dan klik Proceed / Lanjutkan.
Beri tanda centang pada Expand Template Widget.
Cari kode <body>, lalu letakkan kode berikut diatas kode <body>
<script type='text/javascript'>
<![CDATA[

]]>
</script>
Simpan Template Anda.
Anda akan melihat gambar konformasi seperti di bawah ini.
Klik Delete Widget untuk menghapus Navbar.

Jika Anda melakukan cara ini Anda juga akan menghapus Link Quick Edit gambar pensil, atau gambar kunci pas ama obeng di blog Sobat, namun cara ini sangat banyak mengurangi error pada blog.

Untuk cara ketiga dalam Menghapus / Menghilangkan Navbar Blogger, sama halnya dengan cara sebelumnya, cuma kode yang kita cari seperti dibawah ini :

<b:section class='navbar' id='navbar' maxwidgets='1' showaddelement='no'>
<b:widget id='Navbar1' locked='true' title='Navbar' type='Navbar'>
       bla...
       bla...
       bla...
</b:widget>
</b:section>

Jika sudah ketemu, hapus kode tersebut lalu Simpan Template Anda.

Silakan Anda pilih cara mana yang Sobat gunakan untuk Menghapus / Menghilangkan Navbar Blogger.

Tips dan Trik Tutorial Blogspot Widget / Gadget

Menampilkan Share Buttons Bawaan Blogger

Cyber News di December 16, 2012 0

Share Buttons ini sangat bermanfaat buat blog karena dapat menjadi sarana bagi pengunjung untuk membagikan postingan kita ke situs-situs jejaring sosial. Share Buttons atau Tombol berbagi bawaan blogger terdiri atas Email, Blogger, Twitter, Facebook dan Google Plus.

Pada template hasil download biasanya tombol berbagi ini tidak di tampilkan, atau sengaja di hapus, karenanya kita harus melakukan beberapa langkah untuk menampilkan kembali share buttons bawaan blogger tersebut.

Buat sobat yang ingin menampilkan kembali share buttons bawaan blogger tersebut, silakan ikuti tutorial berikut:

Login ke blogger.com
Pada dashboard blogger, pilih Template.
Klik pada Edit dibagian bawah posting blog.
Beri centang pada Tampilkan Tombol Berbagi, lalu klik Simpan.

Silakan cek di blog sobat, jika share buttonsnya masih belum ada silakan lanjutkan ke langkah berikut :

Klik pada Template. Sebaiknya Backup Template sobat terlebih dahulu.
Selanjutnya, klik Edit HTML dan klik Proceed / Lanjutkan.
Beri tanda centang pada Expand Template Widget.
Cari kode <data:post.body/>, jika ada dua pilih yang kedua, lalu letakkan kode berikut di bawahnya :
<div class='post-share-buttons'>
<b:include data='post' name='shareButtons'/>
</div>
Sobat juga bisa meletakkan kode tersebut dibawah kode <div class='post-footer-line post-footer-line-1'/>, terserah anda mau meletakkan di mana.
Simpan Template, dan cek blog sobat.

Jika share buttons masih belum muncul, lanjutkan lagi ke langkah berikut :

Cari kode dibawah ini :
<b:includable id='shareButtons' var='post'>

bla,, bla,, bla,,,

</b:includable>
Ganti dengan :
<b:includable id='shareButtons' var='post'>
<b:if cond='data:top.showEmailButton'><a class='goog-inline-block share-button sb-email' expr:href='data:post.sharePostUrl + "&target=email"' expr:title='data:top.emailThisMsg' target='_blank'><span class='share-button-link-text'><data:top.emailThisMsg/></span></a></b:if><b:if cond='data:top.showBlogThisButton'><a class='goog-inline-block share-button sb-blog' expr:href='data:post.sharePostUrl + "&target=blog"' expr:onclick='"window.open(this.href, \"_blank\", \"height=270,width=475\"); return false;"' expr:title='data:top.blogThisMsg' target='_blank'><span class='share-button-link-text'><data:top.blogThisMsg/></span></a></b:if><b:if cond='data:top.showTwitterButton'><a class='goog-inline-block share-button sb-twitter' expr:href='data:post.sharePostUrl + "&target=twitter"' expr:title='data:top.shareToTwitterMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToTwitterMsg/></span></a></b:if><b:if cond='data:top.showFacebookButton'><a class='goog-inline-block share-button sb-facebook' expr:href='data:post.sharePostUrl + "&target=facebook"' expr:onclick='"window.open(this.href, \"_blank\", \"height=430,width=640\"); return false;"' expr:title='data:top.shareToFacebookMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToFacebookMsg/></span></a></b:if><b:if cond='data:top.showOrkutButton'><a class='goog-inline-block share-button sb-orkut' expr:href='data:post.sharePostUrl + "&target=orkut"' expr:title='data:top.shareToOrkutMsg' target='_blank'><span class='share-button-link-text'><data:top.shareToOrkutMsg/></span></a></b:if><b:if cond='data:top.showDummy'><div class='goog-inline-block dummy-container'><data:post.dummyTag/></div></b:if>
</b:includable>
Simpan Template, dan cek blog sobat.

Jika sampai langkah ini share buttons masih belum muncul juga, Ane ga tau lagi tu template maunya apa?!?

Happy Blogging...

Tips dan Trik Tutorial Blogspot Widget / Gadget

Memasang Tombol Share +1

Cyber News di December 11, 2012 0

Langsung saja Sob, berikut cara pasang tombol share G+1 :

Login ke Blogger
Klik Tata Letak > Tambah Gadget.
Lalu pilih Tombol +1.
Save dan lihat hasilnya.

Untuk Memasang Widget Google Plus melayang (floating), silakan ikuti tutorial berikut :

Login ke Blogger
Klik Template > Edit HTML.
Klik Lanjutkan.
Beri centang pada Expand Template Widget.
Cari kode </head> lalu letakkan kode berikut diatasnya.
<script src='http://apis.google.com/js/plusone.js' type='text/javascript'/>
untuk Blog berbahasa indonesia gunakan kode berikut.
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
{lang: 'id'}
</script>
Cari kode ]]></b:skin>, lalu letakan kode berikut diatas kode ]]></b:skin>.
#g_one { position:fixed;_position:absolute; bottom:0px; right:0px; clip:inherit; _top:expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
Selanjutnya cari kode </body> dan letakkan kode berikut di atasnya :
<div id='g_one'>
<g:plusone size='tall'/>
</div>
Terakhir klik Simpan Template dan lihat hasilnya di blog sobat.

Segitu aja Sob, semoga bermanfaat...

SEO Tips dan Trik Tutorial Blogspot Widget / Gadget

Memasang Widget Google Plus

Cyber News di December 05, 2012 0

Memasang Widget Google Plus | Tutorial Blog

Google Plus merupakan salah satu media promosi yang paling efektif untuk meningkatkan traffic blog, karena itu akan lebih baik jika kita memasang widget Google plus di blog kita, jika semakin banyak orang di circle atau lingkaran sobat, maka semakin banyak pula link yang mengarah pada postingan sobat, dan itu sangat berpengaruh pada SEO.

Untuk dapat memasang widget Google Plus, terlebih dulu sobat harus meng-Upgrade Profile Blogger Ke Profile Google Plus. Jika sudah sobat dapat mengikuti langkah berikut ini :

Login ke Blogger
Klik Tata Letak > Tambah Gadget.
Lalu pilih Pengikut Google +.
Save dan lihat hasilnya

Untuk Memasang Widget Google Plus melayang (floating), sobat dapat mengikuti tutorial berikut :

Login ke Blogger
Klik Template > Edit HTML.
Klik Lanjutkan.
Beri centang pada Expand Template Widget.
Cari kode ]]></b:skin>, lalu letakan kode berikut diatas kode ]]></b:skin>
#gplus { position:fixed;_position:absolute; bottom:0px; right:0px; clip:inherit; _top:expression(document.documentElement.scrollTop+ document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
Selanjutnya cari kode </body> dan letakkan kode berikut di atasnya :
<div id='gplus'>
KODE WIDGET
</div>
Ganti KODE WIDGET dengan kode badge Google +.
Untuk mendapatkan kode badge Google + silakan klik developers.google.com
Terakhir klik Simpan Template dan lihat hasilnya di blog sobat.

Silakan di coba Sob,,, Semoga Berhasil.

Tutorial Blogspot Tutorial Wordpress Widget / Gadget

Memasang Widget Flag Counter

Cyber News di October 22, 2011 0

Memasang Widget Flag Counter (Bendera Pengunjung) | Tutorial Blog

Flag Counter adalah sebuah Widget penghitung jumlah pengunjung dari berbagai negara di dunia. Widget ini menampilkan bendera negara pengunjung. Tutorial kali ini tentang Memasang Widget Flag Counter (Bendera Pengunjung).

Berikut Caranya :

Masuk ke situs flagcounter.com
Pada halaman awal flag counter Klik get your own FREE flag counter.
Kemudian Setting option flag counter seperti keinginan Anda, Lalu klik get your flag counter

Ket :
Maximum Flags to Show ( jumlah bendera yang tampil pada blog anda )
Columns of Flags ( Jumlah kolom yang tampil pada blog anda )
Label on TOP of counter ( Label pada bagian atas banner counter yang akan tampil )
Colors ( silahkan ada klik menu Choose untuk menukar warna background, text, dan Border.
Show Country Labels ( Silahkan anda beri tanda centang pada bagian kotak persegi kecil, apabila anda ingin menampilkan singkatan nama negara )
Show Pageview Count ( Silahkan anda beri tanda centang pada bagian kotak persegi kecil, apabila anda ingin menampilkan jumlah pengunjung yang kedetek oleh flagcounter )
Anda akan di minta memasukan Email Anda, Isikan alamat Email jika Anda mau dan klik tombol Continue.Jika tidak mau, klik tombol Skip.
Halaman Selanjutnya Copy kode HTML Flag counter.
Lalu pasang pada Blog Anda.
Saya yakin Anda pasti sudah tau cara memasang widget, jika belum tau silakan baca :

Semoga artikel ini bisa membantu Anda yang ingin Memasang Widget Flag Counter.

Tutorial Wordpress Widget / Gadget

Memasang Widget di Wordpress.com

Cyber News di October 21, 2011 0

Cara Memasang Widget di Wordpress.com | Tutorial Blog

Langsung saja Sob, berikut tutorialnya :

Login ke Wordpess Anda, Klik Appearance > Widgets.
Pilih Widget yang ingin Anda pasang, Drag ke Sidebar
Lalu Klik Save.
Untuk memasang widget menggunakan kode HTML pilih Text.
Selanjutnya beri judul widget pada kolom Title, Paste kode Widget pada area Text, dan klik Save.

Selesai...

Sekian Tutorial singkat tentang Cara Memasang Widget di Wordpress.com

Artikel Yang Lain :

Tutorial Blogspot Widget / Gadget

Memasang Widget / Gadget di Blogspot

Cyber News di October 20, 2011 0

Cara Memasang Widget / Gadget di Blogspot | Tutorial Blog

Tutorial ini buat yang masih baru di blogger dan belum tahu cara memasang widget / gadget, kalau yang sudah lama di blogger pasti sudah terbiasa bongkar pasang widget, jadi silakan lewat, he...

Berikut langkah Memasang Widget / Gadget di Blogspot :

Login ke Dashboard Blogger Anda, Klik Rancangan / Design.
Pada Page Element klik Add Gadget.
Akan muncul window baru untuk pilihan Gadget, Jika Sobat ingin memasang gadget menggunakan kode, pilih Html / Javascript, klik pada nama gadget atau tanda [+] di samping gadget.
Pada jendela selanjutnya beri judul gadget pada kolom Title, dan Paste kode gadget pada kolom text, Lalu klik Save / Simpan.
Jika Sobat ingin menggunakan gadget standard blogger, klik gadget tersebut, Sebagai contoh gadget Popular Posts.
Pada jendela selanjutnya atur tampilan gadget Anda lalu klik Save / Simpan.

Selesai...

Sampai disini Tutorial tentang Memasang Widget / Gadget di Blogspot.
Semoga Bermanfaat...

Artikel Yang Lain :

Tutorial Blogspot Tutorial Wordpress Widget / Gadget

Widget Untuk Mengetahui Jumlah Pengunjung Yang Online

Cyber News di October 19, 2011 0

Widget Untuk Mengetahui Jumlah Pengunjung Yang Online | Tutorial Blog.

Buat Sobat yang ingin memasang Widget yang menampilkan jumlah pengunjung Online di blog. Sobat dapat mengunjungi website dibawah ini :

whos.amung.us, disini Kode yang diberikan berupa javascript.
daylogs.com, menggunakan kode html, jadi bisa di pasang buat Blogspot maupun Wordpress.com, di situ ada 3 pilihan, Map, Icon, dan Smallbutton.
www.geovisite.com, Pada situs ini sebenarnya banyak terdapat widget yang lain, seperti Map, Jam, User, Counter, dll. Jika sobat ingin memasang Widget jumlah pengunjung yang Online pilih geoglobe, untuk kodenya ada Javascript dan Html.

Silakan pilih Widget yang ingin Anda gunakan, dan Copy kode yang diberikan, lalu pasang pada Blog Sobat. Untuk cara memasang di blog saya rasa Anda semua sudah tau, kalau belum tau silakan bertanya, he...

Sampai disini dulu tulisan saya tentang Widget Untuk Mengetahui Jumlah Pengunjung Yang Online.

Tutorial Blogspot Tutorial Wordpress Widget / Gadget

Memasang Widget Google PageRank

Cyber News di October 18, 2011 0

Google Page Rank merupakan sebuah metode yang digunakan Google untuk mengetahui tingkat popularitas Blog atau website. Pemilik blog biasanya memasang Widget PageRank untuk memperlihatkan ranking blognya kepada pengunjung, untuk mengetahui lebih jauh tentang page rank silahkan Sobat baca di en.wikipedia.org .

Pada tutorial ini akan saya bahas tentang cara Memasang Widget Google PageRank di Blog, Widget ini juga bisa dipasang untuk wordpress.com karena menggunakan kode Html.

Berikut Tutorialnya :

Masuk ke www.prchecker.info
Lalu isi alamat Blog Sobat dan klik Get It.
Kemudian isi Anti-bot Code dan klik Generate Now.
Copy kode yang di berikan sesuai dengan widget yang ingin Sobat tampilkan.
Selanjutnya Login ke Blogger atau wordpress Sobat.
Lalu Paste kode dari prchecker tadi pada widget text Html Blog Sobat.
Silakan di cek tampilannya pada blog Sobat.

Selain prchecker juga ada website lain yang menyediakan widget Google PageRank dengan banyak pilihan tampilan/style badge, caranya pun mudah.

Masuk ke halaman http://getrank.org/pagerank-display/ .
Pilih salah satu badge yang Anda suka. Lalu klik badge tersebut.
Setelah itu akan muncul kode HTML dari badge yang Anda pilih. Copy kode tersebut.
Selanjutnya Login ke Blog Sobat.
Lalu Paste kode tadi pada widget text Html Blog Sobat. Selesai.

Semoga Tutorial singkat ini bisa membantu Anda untuk Memasang Widget Google PageRank.

Artikel Yang Lain :

Tutorial Blogspot Tutorial Wordpress Widget / Gadget

Widget untuk Mengetahui Pengunjung Blog

Cyber News di October 17, 2011 0

Feedjit (Widget untuk Mengetahui Pengunjung Blog) | Untuk mengetahui siapa dan dari mana saja pengunjung blog kita, kita dapat menggunakan Widget yang satu ini. widget ini juga membantu kita untuk mengetahui waktu kunjungan di blog.

Langkah pemasangan Widget ini pada Wordpress dan Blogspot tidak sama, karena Wordpress.com tidak mengizinkan kode Javascript, oleh sebab itu pada tutorial ini akan saya bahas cara memasang Feedjit di Wordpress.com dan Blogspot.com

Berikut langkah memasang Widget untuk Mengetahui Pengunjung Blog :

Memasang di WP.com :

Masuk ke http://feedjit.com/joinimg/, akan muncul halaman awal dari website penyedia.
Tentukan lebar dan berapa entri yang ingin Sobat tampilkan, lalu klik Apply.
Selanjutnya, copy kode dalam kotak
Lalu paste ke dalam widget Sobat. dan klik Save.

selesai

Memasang di Blogspot :

Masuk ke http://feedjit.com/plansPricing/
Klik Sign Up pada Feedjit Completely Free
Pada halaman selanjutnya atur tampilan widget seperti keinginan Anda.
Pada bagian untuk menginstall di blog pilih Other Blog or website. lalu klik GO!
Lalu Copy kode yang diberikan
Selanjutnya login ke blogger, klik Rancangan > Elemen Laman
Pilih Tambah Gadget > HTML / JavaScript
Paste Kode dari Feedjit, dan klik Simpan

Selesai...

Kiranya sampai disini tutorial tentang memasang Widget untuk Mengetahui Pengunjung Blog

Tips dan Trik Tutorial Blogspot Tutorial Wordpress Widget / Gadget

Cara Pasang Translate Untuk Blog

Cyber News di October 02, 2011 0

Pengunjung pada Blog kita tidak hanya dari Indonesia saja, tetapi juga dari manca negara, karena itu untuk memudahkan pengunjung dari luar (bukan indonesia) atau mungkin dari indonesia tetapi ingin melihat blog kita dalam Bahasa lain kita dapat menggunakan translate di sidebar kita. Pada Artikel ini akan saya bahas cara memasang Translate yang menggunakan gambar bendera negara.