Selasa, 23 April 2013

Dampak Buruk Memasang Komentar Google+ Di Blog

Mamfaat dan Cara Mengaktifkan Komentar Google Plus Di Blogger adalah posting yang saya publikasikan dua hari yang lalu. Sekarang, saya akan memberikan sedikit gambaran tentang kekurangan atau dampak negatif komentar Google+ yang dirilis oleh Google bulan April ini. Saya merasa dituntut untuk menerbitkan posting ini supaya sobat blogger tidak asal mengaktifkannya.

Mengaktifkan komentar Google+ di blog berarti secara tidak langsung kita sudah me-nonaktif-kan komentar default blogger. Seperti yang kita tahu bersama, komentar default blogger memiliki banyak mamfaat diantaranya :
  1. Kita dapat mengetahui jumlah komentar yang masuk ke blog kita
  2. Kita dapat melihat komentar yang masuk ke dalam kategori Spamm
  3. Kita dapat melihat komentar yang menunggu moderasi dari kita.
Kalau kita memasang komentar Google Plus di blog maka Tab Komentar yang terdapat di laman dashboard blogger terhapus sehingga pesan pembaharuan yang terdapat pada laman Ikhtisar blogger hanya menampilkan "Penayangan hari ini » Pos » Pengikut". Untuk lebih jelasnya, perhatikan screenshot yang yang saya ambil di bawah ini!

blogger dasboard,laman blogger,komentar blogger,moderasi komentar,komentar terbit,Kelemahan Komentar Google+,jumlah komentar,comentar,google+ comments,comments

Jadi... Dampak buruk komentar Google Plus adalah :
  1. Kita TIDAK dapat mengetahui jumlah komentar yang masuk ke blog kita.
  2. Kita TIDAK dapat melihat komentar yang masuk ke dalam kategori Spamm.
  3. Kita TIDAK dapat melihat komentar yang menunggu moderasi dari kita.
  4. TIDAK ada pemberitahuan tentang komentar yang menunggu moderasi
  5. TIDAK ada pemberitahuan tentang komentar yang diterbitkan
  6. Orang lain TIDAK dapat memberikan komentar menggunakan akun di luar akun Google.

Pesan saya : berpikirlah dua kali sebelum memasang komentar Google+ di blogger blog.

Senin, 22 April 2013

Cara Membuat Menu Bar Cantik Plus Kotak Pencarian

Menu bar yang berdampingan dengan search box mulai tenar di kalangan blogger Indonesia semenjak salah satu webmaster kita, Agus Ramadhani memasangnya di bawah header website miliknya. Saat ini, mungkin ada ratusan blogger yang memasang menu bar plus kotak pencarian di blog mereka. Menurut saya, banyaknya blogger yang memasang menu bar seperti itu sangatlah wajar karena menu bar yang berdampingan dengan kotak pencarian mempunyai tampilan yang sangat manis. Untuk melihat bgaimana tampilan dari menu bar yang saya jelaskan di atas, coba sobat blogger klik gambar di bawah ini untuk memperbesar ukurannya!

Menu bar,menu navigasi horizontal,menu blog,search box

Bagaimana pendapat sobat blogger tentang menu bar di atas? Manis bukan? Menu bar ini bisa sobat blogger modifikasi sesuai dengan keinginan sobat blogger sehingga setiap menu memiliki sub menu (Bercabang).

Cara Memasang Menu Bar Plus Kotak Pencarian Di Blog

  • Sign In di blogger.com
  • Pada Menu Drop Down, sobat pilih Template
  • Kemudian klik tombol "Edit HTML" dan Klik Proceed
  • Kasih tanda centang pada Expand Widget Template.
  • Copy Paste kode berikut tepat di atas kode ]]></b:skin>
#menubar{
width:920px;
height:38px;
background:#222;
border-radius:2px;
float:center;
margin:0px auto;
}
#menubar-left{
float:left;
width:720px;
padding:0 0 2px 2px;
}
#menubar-right{
float:right;
width:170px;
padding-top:8px;
padding-right:18px
}
#menubar ul{
float:left;
margin:0;
padding:0;
}
#menubar li{
float:left;
list-style:none;
margin:0;
padding:0;
}
#menubar li a, #menubar li a:link{
float:left;
padding:12px 10px;
color:#fff;
position:relative;
font-weight:bold !important;
font-family:Verdana,Arial,Helvetica,sans-serif;
font-size:12px;
}
#menubar li a:hover, #menubar li a:active, #menubar .current_page_item a  {
text-decoration:none;
background:#222;
}
#menubar li li a, #menubar li li a:link, #menubar li li a:visited{
font-size: 12px;
background: #222;
color: #fff;
text-decoration:none;
width: 150px;
padding: 0px 10px;
line-height:35px;
}
#menubar li li a:hover, #menubar li li a:active {
background: #222;
}
#menubar li ul{
z-index:9999;
position:absolute;
left:-999em;
height:auto;
width:170px;
margin-top:37px;
border:1px solid #222;
border-radius:0px 0px 8px 8px;
}
#menubar li:hover ul, #menubar li li:hover ul, #menubar li li li:hover ul, #menubar li.sfhover ul, #menubar li li.sfhover ul, #menubar li li li.sfhover ul{
left:auto
}
#menubar li:hover, #menubar li.sfhover{
position:static
}
#search{
border:1px solid #222;
height:20px;
width:180px;
background:#f6f4f4;
}
#search input{
color:#777;
border:none;
}
#s-m{
font-size:11px;
width:180px;
padding-left:4px;
padding-top:5px;
margin:0;
}
#search-t #search{
background-color:#FFFFFF;
border:1px solid #222;
border-radius:4px 4px 4px 4px;
-moz-border-radius:4px 4px 4px 4px;
-khtml-border-radius:4px 4px 4px 4px;
-webkit-border-radius:4px 4px 4px 4px;
}
#search-t #s-m{
width:155px;
padding-top:3px;
}
  • Pasang kode berikut, sebelum kode <div id="content-wrapper">
<div id='menubar'>
<div id='menubar-left'>
<ul>
<li><a expr:href='data:blog.homepageUrl'>Home</a></li>
<li><a href='http://URL-YANG-DI-TUJU.blogspot.com/'>Menu 1</a></li>
<li><a href='http://URL-YANG-DI-TUJU.blogspot.com/'>Menu 2</a></li>
<li><a href='http://URL-YANG-DI-TUJU.blogspot.com/'>Menu 3</a>
<ul>
<li><a href='http://URL-YANG-DI-TUJU.blogspot.com/'>Sub menu 1</a></li>
<li><a href='http://URL-YANG-DI-TUJU.blogspot.com/'>Sub menu 2</a></li>
</ul>
</li>
<li><a href='http://URL-YANG-DI-TUJU.blogspot.com/'>Menu 4</a></li>
<li><a href='http://URL-YANG-DI-TUJU.blogspot.com/'>Menu 5</a></li>
</ul>
</div>
<div id='menubar-right'>
<div id='search-t'>
<div id='search'>
<form action='/search' method='search' target='_blank'>
<input class='keyword' id='s-m' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Cari artikel disini..&quot;;}' onfocus='if (this.value == &quot;Cari artikel disini..&quot;) {this.value = &quot;&quot;}' type='text' value='Cari artikel disini..'/>
<input src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfQ8Wp_xkZTmLJS1fDQGDZbys4BHXkafGBFBWsAJkoDR7vsOryRxKd_Zn6ly9QEnY4QjE6kafx4KFHA7QXXS9v8LVbu5Jd_58mI0VLOf9F4v8_yhSQ8Oq2yI0LKsl2XXc0snz5vGvwi_0/s200/search-c.png' style='border: 0pt none ;vertical-align: top; padding-top:4px; padding-right:3px;' type='image'/>
</form>
</div>
</div>
</div>
</div>
  • Klik Preview terlebih dahulu. Kalau hasilnya sudah mantap, jangan lupa untuk menyimpan template sobat blogger.

Tambahan :
  1. Setiap template memiliki kode yang berbeda, jadi, jika di dalam template sobat blogger tidak terdapat kode <div id="content-wrapper"> sobat blogger bisa meletakkan kode HTML di atas sebelum kode <div id="header-wrapper"> atau <div id="outer-wrapper"> atau <div class='tabs-outer'> atau sebelum kode <div class='tabs-cap-top cap-top'>
  2. Jika sobat blogger ingin mengganti warna dari menu bar di atas, sobat blogger tinggal mencari kode #222 kemudian di ganti dengan kode warna yang sesuai dengan warna template sobat.
  3. Ganti http://URL-YANG-DI-TUJU.blogspot.com/ dengan URL blog sobat. Dan jangan lupa juga untuk mengganti "Menu" dan "Sub Menu" sesuai Title yang diinginkan.

Artikel Terkait :
  1. Beautiful Floating Vertical Menu For Blogger Blog
  2. Cara Membuat Menu Navigasi Horizontal Yang Keren Di Blog

Sabtu, 20 April 2013

Cara Membuat Dan Memasang Search Box Keren Di Blogger

Search Box adalah salah satu widget yang diperuntukkan buat pengunjung sehingga mereka dipermudah di dalam mengakses konten yang terdapat di dalam blog atau website kita. Hanya dengan memasukkan beberapa kata kunci ke dalam search box, pengunjung akan menemukan posting yang mereka butuhkan.

search box,kotak pencarian,search engine

Bentuk atau tampilan dari search Box ini bisa di lihat pada gambar di atas! Jika Cursor kita letakkan pada kolom yang tersedia, maka Search Box akan langsung memanjang ke kiri. Proses memanjangnya search box disebabkan oleh adanya penambahan kode CSS transition yang terdapat pada search box ini. Yang pasti, dengan memasang search box ini, performance dari blog sobat pasti tambah cool atau keren.

Cara Memasang Search Box Keren Di Blogger


  1. Kunjungi blogger.com
  2. Setelah sign in/login, klik tombol warna biru yang terdapat di bawah ini.
  3. Lalu, klik Add Widget.
  4. Secara otomatis, Search Box keren ini akan langsung terpasang di blog kesayangan sobat.

Pastikan sobat blogger meninggalkan pesan, saran atau komentar setelah memasang Search Box yang keren di atas.

Tutorial terkait dengan posting di atas :
  1. Membuat Kotak Pencarian Cantik Dengan CSS3
  2. Cara Buat Kotak Pencarian Pinterest

Jumat, 19 April 2013

Mamfaat dan Cara Mengaktifkan Komentar Google Plus Di Blogger

Membaca dan menanggapi komentar dapat menjadi salah satu aspek yang paling berharga dari blogging. Oleh karena itu, mulai hari ini kita dapat menggunakan komentar Google+ di situs/blog kita. Informasi tentang Komentar Google+ (Google+ comments) ini saya peroleh setelah mengunjungi Blogger Buzz. Informasi ini secara sepontan membuat saya bahagia (Barangkali sobat blogger yang lain pun sama seperti saya) sebab Google+ comments semakin membantu saya terhubung dengan pengunjung blog saya pada khususnya dan pengguna Google Plus pada umumnya.

Google+ comments,google plus,google+

Apa mamfaat penting yang kita peroleh dengan adanya komentar Google+?
  • Kini kita dapat melihat blog kita dan komentar Google+, semua dalam satu tempat
  • Membantu pengunjung blog kita untuk berkomentar dan berhubungan dengan lingkaran (Circles) mereka.
  • Komentar Google+ semakin menambah keindahan tampilan blog kita.
  • Masih banyak lagi mamfaat-mamfaat lain dengan mengaktifkan fitur Komentar Google Plus ini.

Aktifkan Komentar Google+ untuk menggabungkan komentar pada pos sobat blogger di satu tempat, termasuk pos tentang konten sobat di Google+. Gunakan sistem pemberian komentar tunggal yang terpadu antara Blogger dan Google+.Sobat blogger pengen tahu bagaimana cara mengaktifkan fitur ini? Sangat mudah...
  1. Sign in di blogger.com
  2. Pada menu drop down pilih Google+
  3. komentar blog,komentar blogspot,komentar blogger,komentar google+,google+ Comments,Blogspot comments,blogger comments,google comments
  4. Terakhir, kasih tanda centang pada "Gunakan Google+ Komentar di blog ini?"
  5. Lihat perubahan indah yang terjadi

Kamis, 18 April 2013

Cara Membuat Iklan Google Adsense Berada Di Tengah

Jika kode iklan Google Adsense yang kita dapat langsung kita copy paste ke blog, maka posisi dari iklan Google Adsense itu Align Left (Berada di sebelah kiri). Lalu, jika iklan Google Adsense diletakkan di Sidebar, posisi Align Left sangat tidak bagus karena sisi kiri dan sisi kanan iklan akan terlihat tidak seimbang. Oleh sebab itu, saya membuat tutorial ini yaitu tentang bagaimana cara membuat posisi iklan Google Adsense berada di tengan (Center). Tapi sebelumnya, saya akan menerangkan sedikit tentang boleh tidaknya kita melakukan penambahan kode untuk merubah posisi iklan. Karena banyak blogger yang berkoar-koar bahwa "Kode Google Adsense tidak boleh dirubah sedikitpun". Sesungguhnya hal itu tidak benar, semua publisher diperbolehkan untuk mengatur posisi Iklan mereka baik itu di posisi center, left atau right. Hal ini bisa di lihat pada salah satu laman di Google Support yang menerangkan tentang bagaimana membuat iklan adsense berada di tengah. Berikut ini kutipan dari laman tersebut.

Position the ads on the site
Just like other elements of your website such as images and photos, you can change the position of your Google ads by using HTML tags.
For example, if you surround your AdSense ad code with the tags <div align="center"> and </div>, the ad unit will be centered on your webpage. You can also place the complete content of your page into a HTML table and change the location of the ad unit by positioning it in a specific table cell.
Please keep in mind that while we're happy to aid you with issues specific to the AdSense code, we aren't able to provide general help with editing your HTML.

Dari kutipan di atas itu, sobat blogger juga dapat mengetahui bagaimana cara membuat Iklan Adsense berada di tengah :
<div align="center">
Kode Iklan Google Adsense Disini
</div>
Contoh :
<div align="center">
<script type="text/javascript"><!--
google_ad_client = "ca-pub-xxxxxxxxxxxxxxx";
google_ad_host = "pub-xxxxxxxxxxxxxxx";
/* Iklan Adsense */
google_ad_slot = "xxxxxxxxx";
google_ad_width = 728;
google_ad_height = 90;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>

Selasa, 16 April 2013

Cara Memasang Social Bookmarking Widget Google Plus Dan Stumble Di Blog

Saat ini, ada dua jejaring sosial yang sering dimamfaatkan oleh rekan-rekan kita sesama blogger untuk melakukan submitting artikel atau posting yaitu Google Plus dan Stumble. Dalam satu hari, Google Plus dan Stumble mendapatkan ribuan posting yang di submit oleh pengguna mereka. Kedua jejaring sosial (Social Network) ini, benar-benar di mamfaatkan oleh pemilik blog untuk mempromosikan blog mereka dan untuk memberitahu khalayak rame (Publik) mengenai posting atau artikel yang mereka publish baru-baru ini.

stumble,google plus,google+,social bookmarking widget,stumble widget,google plus widget,widget blogger,sosial bookmark

Oleh karena itu, saya pun membuatkan sobat blogger sebuah widget yang dapat digunakan oleh sobat sendiri dan pengunjung blog sobat untuk melakukan submit artikel ke jejaring sosial Google+ dan Stumble. Widget ini di kenal dengan nama Google Plus and Stumble Bookmarking Widget. Tampilan dari Widget ini sangat profesional dan dapat dikostumisasi sesuai dengan selera pemilik blog.

Cara Memasang Social Bookmarking Widget Di Blogger

widget generator, blogger widget,widget,blog,gadget blog,add gadget,widget blogspot,widget cantik,widget keren,widget animasi,widget untuk memperindah blog,widget mempercantik blog,widget google,awesome widget,widget creator
  1. Sign in di blogger.com
  2. Kemudian klik tombol yang ada di bawah ini!

Minggu, 14 April 2013

Online HTML Editor Untuk Blogger

Online HTML Editor merupakan sebuah tool memungkinkan kita untuk melihat demo (pratinjau) dari gabungan kode CSS dan HTML yang disisipkan. Tool ini jauh berbeda dengan tool-tool HTML Editor yang banyak digunakan oleh para webmaster seperti:
  1. Teks Editor (Windows Notepad)
  2. Obyek Editor (Adobe GoLive)
  3. WYSIWYG HTML Editor (Microsoft FrontPage, Adobe Dreamweaver)
  4. WYSIWYG Editor
  5. Editor online (TinyMCE , OpenBEXI)
Jika sobat adalah pengguna Blogger maka alat ini akan membantu sobat dalam semua aspek karena Editor HTML dapat menyesuaikan kode HTML untuk template blog atau Widget. Apa kata orang-orang di luar negeri sana tentang tool ini? Berikut ini kutipan singkatnya : "Free online HTML editor for you to generate your own HTML code for your website. Simply copy/paste the generated code into your website"

Cara Menggunakan Online HTML Editor
  1. Tulis atau letakkan kode CSS sobat blogger di antara tag <style> dan </style>
  2. Selanjutnya, tulis kode HTML setelah tag </style>
  3. Klik tombol Preview
  4. Terakhir, saksikan secara langsung Live Preview yang terdapat pada kolom kedua.
Tool HTML Editor akan membuat kita lebih nyaman dalam merubah kode CSS atau kode HTML kita. Kalau tool ini bermamfaat buat sobat blogger, jangan lupa untuk di share di lingkaran sobat di Google Plus.