Deny Listianto

August 21, 2019

Cara Memasang Tombol Share Whatsapp di Blogger

  
Berikut adalah cara memasang tombol share Whatsapp dan cara mengatasi jika tombol share Whatsapp tidak berfungsi di blogger. Salah satu cara memudahkan pengunjung membagikan artikel di blog adalah dengan cara memasang tombol share.

Cara Memasang Tombol Share Whatsapp di Blogger

Dari beberapa tombol share mungkin tombol share Whatsapp yang cukup efektif untuk meningkatkan jumlah pengunjung blog, Karena dengan adanya pintasan ini, seorang pengunjung akan lebih mudah membagikan apa yang mereka baca ke teman chat ataupun group.

Dengan jumlah pengguna yang demikian besar, maka Whatsapp merupakan salah satu media sosial yang bisa dimanfaatkan untuk kita para blogger agar konten yang kita buat lebih mudah menyebar atau populer di media sosial.

Cara Memasang Tombol Share Whatsapp di Blogger


Berikut ada dua cara memasang tombol share whatsapp di blogger, ikuti langkah-langkah dibawah ini.

1. Cara Pertama, menggunakan javascript

Buka Blogger, lalu buka menu TEMA > Edit HTML. Setelah itu cari kode <data:post.body/> dan letakkan kode berikut ini di bawah kode tersebut.

<!-- Whatsapp Share Buttons Start -->
 
<script type='text/javascript'>if(typeof wabtn4fg===&quot;undefined&quot;){wabtn4fg=1;h=document.head||document.getElementsByTagName(&quot;head&quot;)[0],s=document.createElement(&quot;script&quot;);s.type=&quot;text/javascript&quot;;s.src=&quot;//yourjavascript.com/09010225501/whatsappblogger.js&quot;;h.appendChild(s);}</script>

<a class='wa_btn wa_btn_s' expr:data-href='data:post.url' expr:data-text='data:post.title' href='whatsapp://send' style='display:none'>Share</a>

<!-- Whatsapp Share Buttons End -->

Jika sudah, klik Simpan Tema dan lihat hasilanya.

2. Cara Kedua, tidak menggunakan javascript

Buka Blogger, lalu buka menu TEMA > Edit HTML. Setelah itu cari kode <data:post.body/> dan letakkan kode berikut ini di bawah kode tersebut, atau juga bisa gabungkan dengan kode tombol share lainya.

<li class='wa-btn'><a data-action='share/whatsapp/share' expr:href='&quot;whatsapp://send?text=&quot; + data:post.title + &quot;%20%2D%20&quot; + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/> Share</a></li>

Jika sobat ingin tampilan nya lebih keren bisa tambahkan kode CSS berikut ini diatas kode
</style>

.wa-btn{color:#fff;margin:0 auto;padding:0;font-size:14px;font-weight:700}
.wa-btn a{color:#fff;margin:0 auto;padding:10px 8px;background:#2baf2b;border-radius:3px;}
.wa-btn i{font-weight:300;margin:0 5px 0 0}

Setelah itu, klik Simpan Tema dan lihat hasilanya.

Cara Mengatasi Jika Tombol Share Whatsapp Tidak Berfungsi


Tombol share whatsapp seringkali tidak berfungsi, maka berikut ini adalah cara mengatasinya :

Buka Blogger, lalu buka menu TEMA > Edit HTML, setelah itu cari kode seperti di bawah ini.

<li class='wa-btn'><a data-action='share/whatsapp/share' expr:href='&quot;whatsapp://send?text=&quot; + data:post.title + &quot;%20%2D%20&quot; + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/> Share</a></li>

Ganti kode yang saya tandai dengan kode berikut ini.

expr:href='&quot;https://api.whatsapp.com/send?text=&quot; + data:post.title + &quot;%20&quot; + data:post.url'

Sehingga hasilnya seperti berikut ini.

<li class='wa-btn'><a data-action='share/whatsapp/share' expr:href='&quot;https://api.whatsapp.com/send?text=&quot; + data:post.title + &quot;%20&quot; + data:post.url'><i aria-hidden='true' class='fa fa-whatsapp'/> Share</a></li>

Dan jika sudah, klik Simpan Tema dan lihat hasilanya.

Demikian tutorial kali ini. Semoga bermanfaat dan terimakasih telah berkunjung.

October 14, 2018

Pengertian Google Sitelinks beserta Fungsinya

  
Pengertian Google Sitelinks beserta Fungsinya

Pernahkah sobat melihat sebuah link dibawah link utama saat sedang mencari situs web dengan mengetik kan nama situs web tersebut di mesin pencari Google. Seperti contoh jika sobat mengetik Deny Listianto di mesin pencari Google akan muncul seperti pada gambar dibawah ini.

Pengertian Google Sitelinks beserta Fungsinya

Nah, dari gambar di atas itulah yang dinamakan Google sitelinks, hal tersebut dapat membuat kunjungan organik sebuah situs bisa meningkat drastis. Tetapi jangan salah paham dulu, karena pengertian sitelinks tidak seperti itu.

Mungkin bagi seorang yang sudah laman atau profesional di dunia blogging nama sitelinks tidak asing lagi, namun bagi seorang yang baru bergabung di dunia blogging kata-kata sitelinks pasti terdengar aneh.

Oleh karena itu, saya ingin membahas pengertian sitelinks, agar dapat menambah wawasan teman-teman semua.

Pengertian Google Sitelinks


Di kutip dari situs Wikipedia, sitelinks adalah hyperlink ke sub halaman situs web yang muncul di bawah daftar Google tertentu untuk membantu pengguna menavigasi situs.

Google sitelinks bertujuan untuk membantu pengguna dengan cara menampilkan beberapa halaman yang di cari yang dimaksudkan untuk memudahkan pencarian informasi hingga ke bagian sub-halaman sebuah situs.

Sitelinks murupakan sebuah kumpulan link yang terbagi atas dua kolom yang terdapat di bawah main page di hasil sebuah pencarian di mesin pencari Google.

Main page yang dimaksud adalah judul sebuah situs beserta deskripsi dan link utamanya. Sementara sitelinks adalah halaman-halaman dengan deskripsi tertentu yang terbagi menjadi dua kolom yang terdapat dibawah main page itu sendiri.

Fungsi Google Sitelinks


Fungsi sitelink dapat di bagi menjadi dua, yaitu fungsi untuk para admin blog dan untuk para pengguna blog.

Sebagai admin blog sitelink dapat berfungsi untuk menaikkan visitor dan juga menandakan bahwa blog itu mempunyai kredibilitas atau kualitas yang baik di mesin pencari terutama Google.

Sedangkan bagi pengguna atau pengunjung blog sitelink dapat berfungsi untuk mempermudah pengunjung untuk mencari informasi secara tepat atau sebagai jalan pintas pengunjung dan dapat menghemat waktu pengunjung.

Cara Mendapatkan Google Sitelinks


Google Sitelinks adalah sesuatu yang tidak bisa dibuat secara manual. Google yang akan memberikannya secara otomatis terhadap blog di hasil pencarian. Google juga tidak memberitahukan kita bagaimana sitelinks dapat dibuat.

Namun tidak menutup kemungkinan jika sitelinks akan muncul setelah sobat melakukan beberapa riset berikut ini :

  • Menggunakan brand unik
  • Buatlah struktur blog yang baik dan jelas
  • Buatlah sitemap.xml dan masukkan di webmaster
  • Buatlah konten yang berkualitas dan penting untuk pengguna
  • Hubungkan artikel yang saling berkaitan di dalam blog Anda, selain related posts, Anda bisa menggunakan internal links hal ini yang juga penting untuk menurunkan bounce rate blog yang tinggi.
  • Sitelinks adalah salah satu hasil dari teknik SEO, dan pahami terlebih dahulu dasar-dasar SEO sebelum berjuang keras mendapatkannya.

Dari pengalaman saya, mendapatkan sitelink adalah sesuatu yang susah. Butuh waktu dan riset yang lama, namun secara tidak di sengaja awalnya saya mencari situs ini dengan kata kunci deny listianto.com sitelink sudah muncul, namu saya coba lagi dengan kata kunci deny listianto sitelink tidak muncul.

Tetapi selang waktu satu minggu sitelink di kata kunci deny listianto muncul, nah itulah mengapa sitelink tidak dapat di buat secara manual dan tidak bisa ditentukan dengan waktu serta perlu riset yang membosankan untuk mendapatkannya.

Itulah pengertian Google Sitelinks beserta fungsinya dan cara mendapatkannya, semoga bermanfaat dan semoga berhasil.

September 27, 2018

Membuat Widget Recent Post Berwarna di Blogger

  
Membuat Widget Recent Post Berwarna di Blogger

Widget recent post atau уаng kita kenal dеngаn widget artikel terbaru berfungsi untuk memberikan informasi kepada visitor atau pengunjung untuk membaca postingan terbaru уаng ada pada blog tersebut.

Sebelumnya ѕауа ѕudаh pernah membuat tutorial modifikasi widget popular post menjadi warna-warni seperti pelangi. Widget popular post іnі merupakan fitur уаng ѕudаh tersedia dі blogger оlеh karena іtu penggunaan widget іnі jauh lebih banyak dі bandingkan dеngаn widget recent post.

Berbeda dаrі widget popular post, widget recent post іnі tіdаk tersedia pada fitur blogger, maksudnya аdаlаh ketika sobat іngіn menambahkan widget baru bіаѕаnуа dі bagian tata letak blog ketika sobat klik tambahkan gadget maka аkаn muncul widget-widget уаng cukup banyak untuk bіѕа sobat gunakan pada blog.

Karena widget artikel terbaru atau recent post іnі tіdаk tersedia dі blogger, maka kita perlu membuatnya dеngаn cara manual уаіtu menggunakan sedikit bantuan kode JavaScript.

Jіkа sobat іngіn mengedit tampilan widget recent post іnі bіѕа sobat gunakan kode css, dі sini ѕауа аkаn memberikan kode css уаng bіѕа membuat widget recent post tеrlіhаt lebih keren dаrі bіаѕаnуа dеngаn warna warni seperti pelangi.

Jіkа sobat tertarik membuat widget recent post atau іngіn memodifikasinya supaya tеrlіhаt bagus dan keren ѕіlаhkаn ikuti langkah-langkahnya dі bаwаh ini.

Cara Membuat Widget Recent Post Berwarna di Blogger


Langkah pertama, buka Blogger, lalu buka menu TEMA, setelah itu klik Edit HTML. Selanjutnya letakkan kode CSS dibawah ini tepat di atas kode </style>

/* Recent Wrapper */
#recent-wrapper{display:block;position:relative;overflow:hidden;font-size:15px}
#recent-wrapper ul{margin:0;padding:0;list-style-type:none;}
#recent-wrapper ul li{position:relative;padding:10px 35px 10px 10px!important;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
#recent-wrapper ul li:first-child {background:#E11E28;width:100%}
#recent-wrapper ul li:first-child:after{content:"01";}
#recent-wrapper ul li:first-child + li{background:#FD3C03;width:97%}
#recent-wrapper ul li:first-child + li:after{content:"02";}
#recent-wrapper ul li:first-child + li + li{background:#FECB09;width:94%}
#recent-wrapper ul li:first-child + li + li:after{content:"03";}
#recent-wrapper ul li:first-child + li + li + li{background:#6EBE27;width:91%;}
#recent-wrapper ul li:first-child + li + li + li:after{content:"04";}
#recent-wrapper ul li:first-child + li + li + li + li{background:#149A48;width:88%;}
#recent-wrapper ul li:first-child + li + li + li + li:after{content:"05";}
#recent-wrapper ul li:first-child + li + li + li + li +li{background:#15d3c3;width:85%}
#recent-wrapper ul li:first-child + li + li + li + li +li:after{content:"06";}
#recent-wrapper ul li:first-child + li + li + li + li + li +li{background:#288abb;width:82%}
#recent-wrapper ul li:first-child + li + li + li + li +li +li:after{content:"07";}
#recent-wrapper ul li:first-child + li + li + li + li + li + li +li{background:#863e86;width:79%}
#recent-wrapper ul li:first-child + li + li + li + li +li + li +li:after{content:"08";}
#recent-wrapper ul li:first-child + li + li + li + li + li + li + li +li{background:#71264b;width:76%}
#recent-wrapper ul li:first-child + li + li + li + li + li + li + li +li:after{content:"09";}
#recent-wrapper ul li:first-child + li + li + li + li + li + li + li + li +li{background:#502234;width:73%}
#recent-wrapper ul li:first-child + li + li + li + li + li + li + li +li +li:after{content:"10";}
#recent-wrapper ul li:first-child:after,
#recent-wrapper ul li:first-child + li:after,
#recent-wrapper ul li:first-child + li + li:after,
#recent-wrapper ul li:first-child + li + li + li:after,
#recent-wrapper ul li:first-child + li + li + li + li:after,
#recent-wrapper ul li:first-child + li + li + li + li + li:after,
#recent-wrapper ul li:first-child + li + li + li + li + li + li:after,
#recent-wrapper ul li:first-child + li + li + li + li +li + li +li:after,
#recent-wrapper ul li:first-child + li + li + li + li +li + li + li +li:after,
#recent-wrapper ul li:first-child + li + li + li + li +li + li + li +li +li:after
{position:absolute;top:5px;right:5px;line-height:1em;text-align:center;color:rgba(0,0,0,0.2); font-size:23px !important; font-weight:700}
#recent-wrapper ul li a{color:white;text-decoration:none}

Setelah itu Simpan Tema, selanjutnya buka menu Tata Letak, lalu Tambahkan Gadget dan pilih yang HTML/JavaScript. Silahkan sobat isi dengan kode dibawah ini.

<div id='recent-wrapper' class='recent-wrapper'>
<ul id="recent-posts"></ul>
<script>
//<![CDATA[
numPosts = 10;
function recentPosts(a){if(document.getElementById("recent-posts")){var e=a.feed.entry,title,link,content="",ct=document.getElementById("recent-posts");for(var i=0;i<numPosts;i++){for(var j=0;j<numPosts;j++){if(e[i].link[j].rel=="alternate"){link=e[i].link[j].href;break}}var title=e[i].title.$t;content+='<li class="recent-posts"><a href="'+link+'" title="'+title+'" target="_blank">'+title+'</a></li>'}ct.innerHTML=content}}var rcp=document.createElement('script');rcp.src='/feeds/posts/summary?alt=json-in-script&orderby=published&max-results='+numPosts+'&callback=recentPosts';document.getElementsByTagName('head')[0].appendChild(rcp);
//]]>
</script>
</div>

Klik Simpan dan lihat hasilnya.

Sekian tutorial kali ini semoga dapat bermanfaat bagi semua dan terima kasih telah berkunjung.

September 26, 2018

Cara Membatasi Jumlah Postingan di Halaman Label

  
Cara Membatasi Jumlah Postingan di Halaman Label

Cara Membatasi Jumlah Tampilan Posting Pada Label dі Blogger аdаlаh cara untuk membuat jumlah posting уаng tampil pada halaman blog dараt kita batasi sesuai jumlah уаng kita inginkan.

Postingan pada blogger dараt diberikan label-label mеnurut tema nya masing-masing agar postingan tеrѕеbut dараt terorganisir dеngаn baik dan dараt diakses dеngаn mudah оlеh pengunjung blog.

Nаmun terkаdаng kita agak terganggu dеngаn jumlah postingan уаng tampil pada saat kita mengeklik pada link label tertentu dі halaman blog.

Biasanya link label terdapat dі bagian widget label, breadcrumb, dan menu blog (jika sobat memasang secara manual dі bagian menu).

Apabila jumlah postingan kita tеrlаlu banyak pada label tertentu, maka sebanyak іtu рulа postingan label іtu аkаn tampil pada halaman blog apabila kita mengklik link label tertentu.

Untuk mengatasi hal ini, sobat hаnуа perlu menambahkan atribut max-results kе dalam link widget label agar postingan уаng muncul dalam pencarian label bіѕа sobat tentukan sendiri jumlahnya.

Cara Membatasi Jumlah Postingan di Halaman Label


Ada dua tutorial yang saya bagikan kali ini yaitu membatasi jumlah postingan pada widget label dan membatasi jumlah postingan link label di menu blog.

Membatasi jumlah postingan pada widget label

Untuk membatasi jumlah postingan pada widget label Pastikan sobat sudah memasang widget label di blog.

Pertama, Buka Blogger > TEMA > Klik Edit HTML > Cari semua kode di bawah ini.

expr:href='data:label.url'

Selanjutnya Ganti semua kode tersebut di atas dengan kode dibawah ini :

expr:href='data:label.url + &quot;?&amp;amp;max-results=8&quot;'

Ganti angka di kode "max-results=8" dengan jumlah maksimal dari postingan yang akan muncul.

Setelah itu klik Simpan Tema dan lihat hasilnya.

Membatasi jumlah postingan link label di menu blog

Pertama, Buka Blogger > TEMA > Klik Edit HTML > Cari link label yang berada di menu. Misalnya, link label pada menu seperti dibawah ini.

<a href='https://www.urlblogsobat.com/search/label/Blogging'>Blogging</a>

Kemudian tambahkan atribut max-results seperti langkah sebelumnya :

<a href='https://www.urlblogsobat.com/search/label/Blogging?&amp;amp;max-results=8'>Blogging</a>

Terakhir klik Simpan Tema dan lihat hasilnya.

Mudah kan? sekian tutorial Cara Membatasi Jumlah Postingan di Halaman Label, supaya tіdаk muncul ѕеmuа dan terbatas. Semoga bermanfaat...

September 25, 2018

Cara Membuat Widget Popular Posts Warna Warni di Blog

  
Cara Membuat Widget Popular Posts Warna Warni di Blog

Popular posts adalah salah satu widget blogger yang paling sering atau banyak dipasang di blog, widget ini berfungsi untuk menampilkan beberapa artikel terbaik atau popular di dalam sebuah blog.

Dengan widget ini sobat dapat menunjukkan kepada pengunjung beberapa rekomendasi artikel terbaik atau paling sering di kunjungi dalam blog, dan juga hal ini tentu akan menambah page view blog.

Biasanya widget popular posts di pasang pada sidebar blog, cara memasangnya pun cukup mudah, karena widget ini adalah salah satu widget default dari Blogger.

Namun, untuk widget popular posts yang di sediakan secara default ini masih memiliki tampilan yang sangat sederhana. Nah, kali ini saya akan berbagi cara untuk membuat widget popular posts menjadi warna warni.

Bagi yang penasaran dan ingin mencobanya, silahkan lakukan langkah-langkah yang saya berikan berikut ini.

Cara Membuat Widget Popular Posts Warna Warni di Blog


Buka Blogger sobat, selanjutnya buka menu TEMA , setelah itu klik Edit HTML, silahkan letakkan kode ini sebelum kode ]]></b:skin> atau </style>

Sebelum melakukan langkah di bawah sobat hapus terlebih dahulu semua kode CSS popular posts yang sudah ada.

/* Popular Post Warna Warni */
.PopularPosts ul,.PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{list-style:none;border:none;background:none;outline:none;margin:0;padding:0;}
.PopularPosts ul{list-style:none;font-size:15px;color:#fff;margin:0!important;width:100%!important;font-weight:bold;}
.PopularPosts ul li img{display:block;transition:all 400ms ease-in-out;width:60px;height:60px;float:left;margin:0 15px 0 0;border:4px solid rgba(0,0,0,0.2);}
.PopularPosts ul li img:hover{border:4px solid rgba(0,0,0,0.5);transition:all 400ms ease-in-out;}
.PopularPosts ul li{background-color:#eee;counter-increment:num;position:relative;margin:0 10% 0 0;padding:10px;height:70px;}
.PopularPosts .item-title{text-overflow:ellipsis;overflow:hidden;height:64px;}
.PopularPosts ul li:before,.PopularPosts ul li .item-title a{font-size:15px!important;color:inherit;text-decoration:none;}
.PopularPosts ul li:before{content:counter(num);display:block;position:absolute;font-size:35px!important;font-weight:700;color:rgba(0,0,0,0.2);top:40%;left:9px;}
.PopularPosts ul li{margin:0!important;padding:10px 5px 10px 40px;}
.PopularPosts ul li:nth-child(1){background-color:#5d93b2;}
.PopularPosts ul li:nth-child(2){background-color:#67b8b3;}
.PopularPosts ul li:nth-child(3){background-color:#67c27a;}
.PopularPosts ul li:nth-child(4){background-color:#ee9f7e;}
.PopularPosts ul li:nth-child(5){background-color:#ea6868;}
.PopularPosts ul li:nth-child(6){background-color:#b65757;}
.PopularPosts ul li:nth-child(7){background-color:#e9c462;}
.PopularPosts ul li:nth-child(8){background-color:#84d558;}
.PopularPosts ul li:nth-child(9){background-color:#4dd38c;}
.PopularPosts ul li:nth-child(10){background-color:#b44d7a;}

Selanjutnya klik Simpan Tema dan lihat hasilnya.

Untuk sobat yang belum memasang widget popular post, berikut cara pasangnya. Pertama, buka menu Tata Letak, lalu klik Tambahkan Gadget, setelah itu cari widget popular posts lalu klik tombol + atau tambahkan widget.

Cara Membuat Widget Popular Posts Warna Warni di Blog

Sekian tutorial Cara Membuat Widget Popular Posts Warna Warni di Blog, semoga bermanfaat dan semoga berhasil. Terima Kasih...

September 24, 2018

Cara Memasang Random Background di Blogger

  
Cara Memasang Random Background di Blogger

Kali ini saya akan berbagi tutorial cara membuat background blog bisa berubah secara otomatis. Untuk membuatnya tidak terlalu sulit, sobat hanya menambahkan script atau kode di template blogger. Namun, script atau kode ini dapat memperlambat kecepatan loading blog.

Cara kerja script atau kode ini adalah merubah gambar background halaman blog setiap kali halaman blog di refresh. Sehingga blog sobat memiliki tampilan yang dinamis karena background nya dapat berubah-ubah dengan sendirinya saat pengunjung membuka halaman baru atau merefresh halaman.

Yosh, jika sobat penasaran dan ingin mencobanya, silahkan ikuti langkah-langkah berikut ini.

Cara Memasang Random Background di Blogger


Pertama, buka Blogger, selanjutnya buka menu Tema lalu klik Edit HTML. Silahkan sobat letakkan kode dibawah ini sebelum kode </body>

<script type='text/javascript'>
//<![CDATA[
var Background=new Array;
Background[0]="#f5f5f5 url('ImageURL') no-repeat top center fixed",
Background[1]="#f5f5f5 url('ImageURL') no-repeat top center fixed",
Background[2]="#f5f5f5 url('ImageURL') no-repeat top center fixed",
Background[3]="#f5f5f5 url('ImageURL') no-repeat top center fixed",
Background[4]="#f5f5f5 url('ImageURL') no-repeat top center fixed";
var random=Math.floor(5*Math.random());
document.write("<style>"),
document.write("body {"),
document.write("background: "+Background[random]+";"),
document.write("background-size:100%;"),document.write(" }"),
document.write("</style>");
//]]>
</script>

Silahkan sobat ganti kode ImageURL dengan url gambar yang telah sobat siapkan, pastikan gambar kualitas Hd agar tidak blur atau paecah-pecah saat dipasang.

Jika sobat ingin yang lebih praktis dan tidak mau ribet harus memasang gambar atau sobat tidak memiliki gambar Hd yang cocok, silahkan gunakan kode di bawah ini.

<script type='text/javascript'>
//<![CDATA[
var Background=new Array;
Background[0]="#f5f5f5 url('https://2.bp.blogspot.com/-pgCR_lX3GZM/W6jcyUstOeI/AAAAAAAAAn8/eVimAZl-UlwTP0WtBhhK0yecFUUEuaAuwCLcBGAs/s1600/garrett-parker-247225-unsplash.jpg') no-repeat top center fixed",
Background[1]="#f5f5f5 url('https://1.bp.blogspot.com/-fCdjRqP6NTs/W6jbnO_KAuI/AAAAAAAAAns/ICnlDOmXcH4OBX-HCQ5xIkbONcWjElklACLcBGAs/s1600/brandon-lam-29892-unsplash.jpg') no-repeat top center fixed",
Background[2]="#f5f5f5 url('https://2.bp.blogspot.com/-OymSzNTbCqA/W6jc2fEDWsI/AAAAAAAAAoE/lA1YcOmRFf4VXPbRnfwfW-UrK7gi4nmcwCLcBGAs/s1600/john-towner-154060-unsplash.jpg') no-repeat top center fixed",
Background[3]="#f5f5f5 url('https://3.bp.blogspot.com/-diwm9CQ6B28/W6jcx6bnrnI/AAAAAAAAAn4/4kFyJzmhhpkI3oT53eIw80pZZw1cd-FvACLcBGAs/s1600/kalen-emsley-98264-unsplash.jpg') no-repeat top center fixed",
Background[4]="#f5f5f5 url('https://4.bp.blogspot.com/-erAEgmCybgY/W6jc1JZmQeI/AAAAAAAAAoA/0dfNJIZ37twWRDBHCFr-bjt6Fl9oCxcmgCLcBGAs/s1600/samsommer-76472-unsplash.jpg') no-repeat top center fixed";
var random=Math.floor(5*Math.random());
document.write("<style>"),
document.write("body {"),
document.write("background: "+Background[random]+";"),
document.write("background-size:100%;"),document.write(" }"),
document.write("</style>");
//]]>
</script>

Jika sudah si lahkan klik Simpan Tema dan lihat hasilnya.


Sekian Cara Memasang Random Background di Blogger, semoga dapat bermanfaat dan terima kasih telah berkunjung.

September 21, 2018

Cara Menggunakan Tag Heading H1-H6 agar SEO Friendly

  
Cara Menggunakan Tag Heading H1-H6 agar SEO Friendly

Perlu diketahui dalam format penulisan di situs web atau blog terdapat tag heading H1 sampai H6, dimana tag heading ini cukup penting untuk digunakan dalam setiap artikel karena dapat mempengaruhi struktur konten.

Tag Heading biasanya digunakan untuk menandakan mana bagian judul, sub judul, dan kata-kata atau poin-pion penting lainnya. Sekaligus memberitahukan kepada kepada mesin pencari seputar susunan dan struktur artikel.

Dengan begitu mesin pencari dapat membedakan mana bagian judul, sub judul, dan kata-kata atau poin-pion penting lain yang ada dalam sebuah artikel di blog.

Ada 6 buah Tag Heading ( H1,H2,H3,H4,H5,H6 ), Berikut adalah gambar contoh bentuk atau tampilan H1 sampai H6.

Cara Menggunakan Tag Heading H1-H6 agar SEO Friendly

Setelah sobat melihat gambar di atas dapat disimpulkan, bahwa penulisan Tag Heading dapat di lakukan dengan format seperti berikut ini.

<tag_heading> .....isi..... </tag_heading>

Sebagai contoh penerapan nya :

<h1>Cara Menggunakan Tag Heading H1-H6 agar SEO Friendly<h1>

Tag Heading juga bisa di tambahkan berbagai atribut yang dapat di atur sedemikian rupa sehingga sesuai dengan apa yang sobat butuhkan.

Berikut ini adalah penjelasan dan cara penggunaan tag heading yang tepat agar SEO Friendly untuk artikel blog sobat.

Cara Menggunakan Tag Heading H1-H6 agar SEO Friendly


Ada 6 buah tag heading yang mempunyai tampilan dan fungsi berbeda, berikut diantaranya :

1. Tag H1 (Heading 1)


Tag ini berfungsi untuk memberi tau kepada mesin pencari dan pengunjung, bahwa ini adalah kata yang paling penting yang ada di sebuah halaman blog.

Sesuai fungsinya yang menunjukkan kata yang paling penting, maka perlu diingat bahwa, tag H1 hanya boleh ada 1 saja di dalam satu halaman.

2. Tag H2 (Heading 2)


H2 tidak jauh berbeda dengan H1, H2 hanya berada satu tingkat di bawah H1, namun maksimal penggunaan H2 dalam satu artikel belum diketahui dengan pasti.

Menurut pakar SEO dalam satu artikel maksimal penggunaan H2 sebanyak 5, 8, 10, dan seterusnya. Saya sarankan untuk menggunakan H2 secukupnya saja, sesuai dengan kebutuhan.

H2 dapat ditempatkan pada bagian sub heading atau dapat menggunakannya untuk menulis ulang judul atau keyword pada sebuah artikel. Contohnya seperti ini:

Cara Menggunakan Tag Heading H1-H6 agar SEO Friendly

Selain itu, H2 dapat di manfaatkan untuk di tempatkan di bagian judul pada homepage blog sobat. Tapi ingat, tidak bagus jika banyak-banyak, cukup 8 saja.

3. Tag H3 (Heading 3)


Fungsi Tag Heading H3 adalah digunakan untuk sub-judul atau penjelasan dari judul posting, bisa juga digunakan pada judul widget atau bisa untuk meletakkan keyword.

Bisa dibilang tag H3 di gunakan hanya untuk pelengkap saja, dan maksimal penggunaannya dalam sebuah artikel belum di ketahui.

4. Tag H4 (Heading 4)


H4 dapat anda gunakan sebagai hiasan saja, misal digunakan untuk judul widget, dengan begitu H4 dapat menggantikan H2 pada judul widget agar penggunaan H2 tidak terlalu banyak dan menumpuk.

Bisa juga digunakan untuk judul “Artikel Terkait” dan “0 Komentar” yang biasanya berada di bawah postingan blog.

5. Tag H5 (Heading 5)


Semakin kebawah tag heading semakin tidak terlalu penting penggunaannya, tag ini tidak terlalu berfungsi, jadi dapat dapat memakainya dimana saja.

Tetapi, tag ini juga bisa di manfaatkan sebagai pembantu H4, seperti menjadi judul di widget, credit link di footer, dan sebagainya. Intinya bebas mau memakainya dimana saja.

6. Tag H6 (Heading 6)


Terakhir adalah tag H6, tag ini dapat digunakan untuk penutup di sebuah artikel, atau credit link di footer dan copyright nya.

Tidak ada batasan untuk penggunaan tag H6, jadi sobat bisa menggunakannya dimana saja sesuai kebutuhan.

Demikian artikel Cara Menggunakan Tag Heading H1-H6 agar SEO Friendly, semoga bermanfaat dan terima kasih telah berkunjung.