Dewa Blogger: Hasil penelusuran untuk cara-memasang-artikel-terkait-di-blog

Home / Hasil penelusuran untuk cara-memasang-artikel-terkait-di-blog

Cara Memasang Artikel Terkait di Dalam Postingan - Halo sahabat blogger, tentunya sahabat sudah mengetahui dengan fungsi sebuah widget artikel terkait di blog yang menampilkan sejumlah artikel terkait sesuai label di bawah artikel baik itu dalam bentuk link dan thumbnail ataupun link saja.

Namun sedikit berbeda dari sebelumnya, di sini aku akan memperlihatkan tutorial Cara Memasang Artikel Terkait di Dalam Postingan. Seperti yang aku singgung sebelumnya di artikel Cara Memasang Iklan Adsense di Tengah Postingan bahwa sahabat juga sanggup memasang arahan atau widget lain di dalam arahan tersebut, tutorial blogger kali ini pun masih memakai arahan yang sama. Tutorial ini aku dapatkan dari blog https://sangdewablogger.blogspot.com//search?q=cara-memasang-iklan-adsense-di-tengah-postingan dan telah aku modifikasi kembali diubahsuaikan dengan style saya.

Manfaat lain yang didapatkan dari memasang artikel terkait di dalam postingan ini ialah untuk menambah jumlah pengunjung serta meningkatkan kualitas Internal Link di blog sobat.

Bagi yang ingin memasangnya di blog, silakan ikuti langkah-langkah Cara Memasang Artikel Terkait di Dalam Postingan atau lebih tepatnya di tengah konten artikel berikut ini

Cara Memasang Artikel Terkait di Dalam Postingan

1. Buka Blogger > Template > Klik tombol Edit HTML > Tambahkan arahan di bawah ini sebelum tag </head>

<b:if cond='data:blog.pageType == &quot;item&quot;'> <script type='text/javascript'> //<![CDATA[ var relatedSimply = new Array(); var relatedSimplyNum = 0; var relatedUrls = new Array(); function related_results_labels(json) { for (var i = 0; i < json.feed.entry.length; i++) { var entry = json.feed.entry[i]; relatedSimply[relatedSimplyNum] = entry.title.$t; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') {relatedUrls[relatedSimplyNum] = entry.link[k].href; relatedSimplyNum++; break;}}}} function removeRelatedDuplicates() { var tmp = new Array(0); var tmp2 = new Array(0); for(var i = 0; i < relatedUrls.length; i++) { if(!contains(tmp, relatedUrls[i])) { tmp.length += 1; tmp[tmp.length - 1] = relatedUrls[i]; tmp2.length += 1; tmp2[tmp2.length - 1] = relatedSimply[i];}} relatedSimply = tmp2; relatedUrls = tmp;} function contains(a, e) { for(var j = 0; j < a.length; j++) if (a[j]==e) return true; return false;} function printRelatedLabels() { var r = Math.floor((relatedSimply.length - 1) * Math.random()); var i = 0; document.write('<ul>'); while (i < relatedSimply.length && i < 20) { document.write('<li><a href="' + relatedUrls[r] + '">' + relatedSimply[r] + '</a></li>'); if (r < relatedSimply.length - 1) { r++; } else { r = 0;} i++;} document.write('</ul>');} //]]> </script> </b:if>

2. Tambahkan CSS di bawah ini sebelum arahan ]]></b:skin> atau </style>

/* Related Post Style 1 */ .related-simplify{position:relative;padding:0;margin:15px auto;width:100%;} .related-simplify h4{background:#3498db;padding:8px 12px;margin:0;font-size:15px;font-weight:400;color:#fff;border:1px solid #2e88c5} .related-simplify ul{margin:0;padding:0} .related-simplify ul li{background:#f6f6f6;position:relative;list-style:none;padding:9px;margin:auto;line-height:1.4em;border:1px solid rgba(0,0,0,0.1);border-bottom:0;transition:all .3s} .related-simplify ul li:nth-child(odd){background:#fefefe} .related-simplify ul li:last-child{border-bottom:1px solid rgba(0,0,0,0.1)} .related-simplify ul li:before{content:'\f138';font-family:fontawesome;position:absolute;margin:0 9px 0 4px;color:#2ecc71;overflow:hidden;transition:all .3s} .related-simplify ul li:hover:before{content:'\f138';font-family:fontawesome;-webkit-animation:bounceright .3s alternate ease infinite;animation:bounceright .3s alternate ease infinite} .related-simplify a{color:#0383d9;font-size:13px;margin:0 0 0 30px;} .related-simplify a:hover{color:#0383d9;text-decoration:underline} .related-simplify ul li:nth-child(n+4) {display:none;} @-webkit-keyframes bounceright{from{-webkit-transform:translateX(0)}to{-webkit-transform:translateX(3px)}} @keyframes bounceright{from{transform:translateX(0)}to{transform:translateX(3px)}}

Contoh tampilan widget Artikel Terkait Style 1

/* Related Post Style 2 */ .related-simplify{position:relative;padding:20px 12px 12px 12px;margin:32px auto 24px auto;width:93%;border:4px double rgba(0,0,0,0.2)} .related-simplify h4{background:#fff;padding:8px 10px;position:absolute;margin:0;font-size:17px;font-weight:700;color:#000;top:-21px;left:2.5%} .related-simplify ul{margin:0;padding:0} .related-simplify ul li{position:relative;list-style:none;padding:9px 0;margin:auto;line-height:1.4em;transition:all .3s} .related-simplify ul li:before{content:'\f0c8';font-family:fontawesome;position:absolute;margin:0 5px 0 2px;color:rgba(0,0,0,0.5);overflow:hidden;font-size:60%;left:10px;transition:all .3s} .related-simplify ul li:hover:before{content:'\f0c8';font-family:fontawesome;color:#0383d9;} .related-simplify a{color:#000;font-size:14px;margin:0 0 0 30px;} .related-simplify a:hover{color:#0383d9;} .related-simplify ul li:nth-child(n+4) {display:none;} @media only screen and (max-width:768px){ .related-simplify{padding:15px 0 10px 0;width:100%;border:2px solid #e74c3c;border-left:0;border-right:0} .related-simplify h4{color:#e74c3c;padding:8px;font-size:15px;top:-18px;left:3.5%} .related-simplify a{font-size:14px;margin:0}.related-simplify a:hover{color:#e74c3c} .related-simplify ul li{padding:5px 0} .related-simplify ul li:before,.related-simplify ul li:hover:before{display:none}}

Contoh tampilan widget Artikel Terkait Style 2

/* Related Post Style 3 */ .related-simplify{display:inline-block;background:#34495e;color:#fff;position:relative;padding:0;margin:20px auto;width:100%;border:6px double #fff;} .related-simplify ul{background:rgba(38,62,87,0.8);margin:0;padding:20px} .related-simplify ul li{position:relative;list-style:none;padding:9px 0;margin:auto;line-height:1.4em;transition:all .3s} .related-simplify ul li:before{content:'\f0c8';font-family:fontawesome;position:absolute;margin:0 5px 0 2px;color:rgba(255,255,255,0.7);overflow:hidden;font-size:60%;left:10px;transition:all .3s} .related-simplify ul li:hover:before{content:'\f0c8';font-family:fontawesome;color:#f1c40f;} .related-simplify a{color:#fff;font-size:17px;margin:0 0 0 30px;} .related-simplify a:hover{color:#fff;text-decoration:underline} .related-simplify ul li:nth-child(n+4) {display:none;} @media only screen and (max-width:768px){ .related-simplify{padding:15px 0 10px 0;width:100%;border:2px solid #e74c3c;border-left:0;border-right:0} .related-simplify h4{color:#e74c3c;padding:8px;font-size:15px;top:-18px;left:3.5%} .related-simplify a{font-size:14px;margin:0}.related-simplify a:hover{color:#e74c3c} .related-simplify ul li{padding:5px 0} .related-simplify ul li:before,.related-simplify ul li:hover:before{display:none}}

Pastikan di blog sahabat sudah memasang Font Awesome semoga icon sanggup muncul

3. Selanjutnya, cari dan ganti arahan <data:post.body/> dengan arahan di bawah ini

Di dalam template sahabat akan menemukan beberapa arahan <data:post.body/> tergantung template yang digunakan, coba satu persatu hingga artikel terkait muncul di dalam halaman artikel

<div expr:id='&quot;post1&quot; + data:post.id'/> <div class='related-simplify'> <b:if cond='data:post.labels'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:blog.pageType == &quot;item&quot;'> <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=3&quot;' type='text/javascript'/> </b:if> </b:loop> </b:if> <h4>Baca Juga</h4> <script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels(); </script> </div> <div expr:id='&quot;post2&quot; + data:post.id'><p><data:post.body/></p></div> <script type='text/javascript'> var obj0=document.getElementById(&quot;post1<data:post.id/>&quot;); var obj1=document.getElementById(&quot;post2<data:post.id/>&quot;); var s=obj1.innerHTML; var t=s.substr(0,s.length/2); var r=t.lastIndexOf(&quot;&lt;br&gt;&quot;); if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+4);} </script>

4. Simpan template dan lihat hasilnya.

Result

Makara dengan memasang arahan ini sahabat tidak perlu lagi repot-repot memasang link secara manual di artikel blog. Demikian tutorial Cara Memasang Artikel Terkait di Dalam Postingan yang sanggup berikan. Terima kasih sudah berkunjung dan semoga bermanfaat.

Cara Memasang Artikel Terkait Di Dalam Postingan

Concept Phone Sabtu, 10 November 2018

Cara Memasang Artikel Terkait di Blog - Kali ini aku akan membagikan script artikel terkait yang tidak mengecewakan keren untuk dipasang pada blog, ibarat yang kita ketahui bersama bahwa dengan memasang artikel terkait pada blog merupakan salah satu Teknik SEO yang berfungsi juga biar pengunjung blog membaca artikel yang ada pada blog itu sendiri.

Di sini aku tidak akan panjang lebar untuk menjelaskan secara rinci fungsi dari artikel terkait ini, alasannya ialah aku anggap Anda sudah mengerti wacana fungsinya secara garis besar. Oke, pribadi saja ikuti caranya di bawah ini.

Cara Memasang Artikel Terkait di Blog

1. Login ke blog > Buka Template > Salin isyarat di bawah ini sebelum ]]></b:skin> atau </style>

/* Arlina Related Post */ #related_posts{margin-top:20px} #related_posts h4{color:#fff;background:#3498db;padding:10px;margin:0 0 5px;font-size:110%;} #related_img{margin:0;padding:0;} #related_img:hover{background:0} #related_img ul{list-style-type:none;margin:0;padding:0} #related_img li{min-height:62px;border-bottom:1px solid #f1f1f1;list-style:none;margin:0 0 5px;padding:5px;} #related_img li a{color:#2672a0;} #related_img li a:hover{text-decoration:underline} #related_img .news-title{display:block;font-weight:bold!important;margin-bottom:5px;font-size:14px;} #related_img .news-text{display:block;font-weight:normal;text-transform:none;color:#888;font-size:11px;} #related_img img{float:left;margin-right:10px;width:60px;height:60px;max-width:100%;background:#fff}

2. Kemudian salin isyarat di bawah ini sebelum </head>

<script type='text/javascript'>/*<![CDATA[*/var relnum=0;var relmaxposts=5;var numchars=135;var morelink=" ";function saringtags(r,l){for(var e=r.split("<"),n=0;n<e.length;n++)-1!=e[n].indexOf(">")&&(e[n]=e[n].substring(e[n].indexOf(">")+1,e[n].length));return e=e.join(""),e=e.substring(0,l-1)}function relpostimgthum(r){for(var l=0;l<r.feed.entry.length;l++){var e=r.feed.entry[l];reljudul[relnum]=e.title.$t,postcontent="","content"in e?postcontent=e.content.$t:"summary"in e&&(postcontent=e.summary.$t),relcuplikan[relnum]=saringtags(postcontent,numchars),postimg="media$thumbnail"in e?e.media$thumbnail.url:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYszZ6J0bB5wP1PpwsYQsUH73GkUpJFexkaJd0kINVbZ5VJCEoAKEU60X7Fdv3yUpvpmqVkCgtlVmC2LjvlhcnPqFVMOLWAJHf-TfwYO6OhiR1MxYh8OpZHqeDoJy3IQVdGVBEXQlbOVBg/d/noimagethumb.gif",relgambar[relnum]=postimg;for(var n=0;n<e.link.length;n++)if("alternate"==e.link[n].rel){relurls[relnum]=e.link[n].href;break}relnum++}}function contains(r,l){for(var e=0;e<r.length;e++)if(r[e]==l)return!0;return!1}function relatpost(){for(var r=new Array(0),l=new Array(0),e=new Array(0),n=new Array(0),t=0;t<relurls.length;t++)contains(r,relurls[t])||(r.length+=1,r[r.length-1]=relurls[t],l.length+=1,l[l.length-1]=reljudul[t],e.length+=1,e[e.length-1]=relcuplikan[t],n.length+=1,n[n.length-1]=relgambar[t]);reljudul=l,relurls=r,relcuplikan=e,relgambar=n;for(var t=0;t<reljudul.length;t++){var a=Math.floor((reljudul.length-1)*Math.random()),u=reljudul[t],s=relurls[t],i=relcuplikan[t],o=relgambar[t];reljudul[t]=reljudul[a],relurls[t]=relurls[a],relcuplikan[t]=relcuplikan[a],relgambar[t]=relgambar[a],reljudul[a]=u,relurls[a]=s,relcuplikan[a]=i,relgambar[a]=o}for(var g,m=0,h=Math.floor((reljudul.length-1)*Math.random()),c=h,d=document.URL;m<relmaxposts&&(relurls[h]==d||(g="<li class='news-title clearfix'>",g+="<a href='"+relurls[h]+"' rel='nofollow' target='_top' title='"+reljudul[h]+"'><img src='"+relgambar[h]+"' /></a>",g+="<a href='"+relurls[h]+"' target='_top'>"+reljudul[h]+"</a>",g+="<span class='news-text'>"+relcuplikan[h]+" ... <a href='"+relurls[h]+"' target='_top'>"+morelink+"</a><span class='news-text'>",g+="</li>",document.write(g),m++,m!=relmaxposts))&&(h<reljudul.length-1?h++:h=0,h!=c););}var reljudul=new Array,relurls=new Array,relcuplikan=new Array,relgambar=new Array;/*]]>*/</script>

3. Selanjutnya cari isyarat <data:post.body/> dan letakkan isyarat di bawah ini, sempurna di bawah isyarat <data:post.body/>

<div id='related_posts'> <h4>Artikel Terkait</h4> <b:loop values='data:post.labels' var='label'> <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=relpostimgthum&amp;max-results=50&quot;' type='text/javascript'/> </b:loop> <ul id='related_img'> <script type='text/javascript'>relatpost();</script> </ul> </div>

4. Simpan template

Biasanya dalam template terdapat lebih dari 3 isyarat <data:post.body/> jadi letakkan di bawah isyarat <data:post.body/> yang ke 2 dan bilah tidak sanggup coba letakkan pada isyarat yang aku maksud satu persatu hingga berhasil.

Demikian Cara Memasang Artikel Terkait di blog, semoga dengan tutorial di atas berhasil diterapkan pada blog Anda.

Tips Blogger Widget

Cara Memasang Artikel Terkait Di Blog

Concept Phone Rabu, 04 April 2018

Tutorial selanjutnya, akan menyebarkan tutorial Cara Memasang Slide Box Rekomendasi di Blog.

Memasang widget slide box rekomendasi berdasarkan label yang akan muncul di sebelah kanan blog memang sangat gampang dan cocok untuk blog yang bertemakan informasi atau dapat juga dipasang di blog pribadi. Selain itu dengan memasang widget ini akan menawarkan pilihan kepada pengunjung untuk membuka artikel lain yang menurutnya menarik dan bermanfaat.

Cara kerja dari widget ini hampir sama dengan widget related post yang biasa terpasang di bawah artikel blog, yang akan memunculkan beberapa postingan terkait berdasarkan label.

Bagi sahabat yang ingin memasang widget slide box rekomendasi ini, silakan simak tutorial Cara Memasang Slide Box Rekomendasi di Blog di bawah ini :

Cara Memasang Slide Box Rekomendasi di Blog

1. Login ke Blogger > Buka Template > Tambahkan arahan di bawah ini sebelum ]]></b:skin> atau </style>

/* Widget Rekomendasi */ #chslidingbox{background:#fff;width:100%;max-width:355px;height:185px;position:fixed;overflow:hidden;border:none;right:-360px;z-index:99;text-align:left;box-shadow:0 1px 0 0 rgba(0,0,0,0.03);transition:all .4s ease-out} .chslidingbox-title{background:#9eb2c0;color:#fff;display:block;height:45px;line-height:45px;width:100%;font-size:14px;text-transform:capitalize;font-weight:700;letter-spacing:.5px} .chslidingbox-title span a{font-family:initial;float:right;height:40px;margin:0 0 0 15px;text-align:center;color:#fff;font-size:20px} a#chslidingbox-close,a#chslidingbox-close{margin-right:15px} .chslidingbox-title >span >h2{font-size:20px!important;font-weight:normal!important} .chslidingbox-container{border:none;float:left;width:100%;height:auto;margin:3px} .chslidingbox-container >div{border:none;margin:3px 0;padding:10px 0} .chslidingbox-container >div >span{font-size:14px} .show{bottom:84px} .hide{bottom:-145px} .related-post{font-size:70%} .related-post h4{font-size:150%;margin:0 0 .5em} .related-post-style-2{margin-top:-20px;padding-top:15px;list-style:none} .related-post-style-2 li{padding:0 10px 10px 10px;overflow:hidden} .related-post-style-2 li:first-child{border-top:none} .related-post-style-2 .related-post-item-thumbnail{width:45px;height:45px;max-width:none;max-height:none;border:0;padding:0;border-radius:3px;float:left;margin:2px 10px 0 0} .related-post-style-2 .related-post-item-title{font-weight:700;font-size:130%;line-height:normal} a.related-post-item-title{color:#95a5a6;transition:all .4s ease-out} a:hover.related-post-item-title{color:#2ecc71;text-decoration:none} .related-post-style-2 .related-post-item-summary{display:block;overflow:hidden}

2. Kemudian salin arahan di bawah ini sebelum </body>

<b:if cond='data:blog.pageType == &quot;item&quot;'> <script type='text/javascript'> //<![CDATA[ $(window).scroll(function(){$("#chslidingbox").css($(this).scrollTop()>400?{right:"0px"}:{right:"-360px"})}),$(document).ready(function(){var i=$("#chslidingbox"),s=$("#chslidingbox-close"),o=$("#chslidingbox-minimize"),l=$("#chslidingbox-maximize");l.hide(),s.click(function(){i.css({right:"-350px"}),i.fadeOut("slow")}),o.click(function(){i.toggleClass("hide"),$(this).hide(),l.show()}),l.click(function(){i.toggleClass("hide"),$(this).hide(),o.show()})}); //]]> </script> </b:if>

3. Selanjutnya cari arahan <data:post.body/> dan tambahkan arahan di bawah ini sempurna di bawah arahan <data:post.body/>

<b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='show' id='chslidingbox'>     <div class='chslidingbox-title chslidingbox-www'>       <span style='float:left;margin:0 15px;'>Rekomendasi Untuk Anda</span>         <span><a href='javascript:void(0);' id='chslidingbox-close' title='close'>&#x00D7;</a></span>         <span><a href='javascript:void(0);' id='chslidingbox-minimize' title='minimize'>&#x2212;</a></span>         <span><a href='javascript:void(0);' id='chslidingbox-maximize' title='maximize'>&#x2b;</a></span>     </div>     <div class='chslidingbox-container'> <div class='related-post' id='sliding-tab'/> <script type='text/javascript'> var labelArray = [<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> &quot;<data:label.name/>&quot;<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if> </b:loop></b:if>]; var relatedPostConfig = {homePage: &quot;<data:blog.homepageUrl/>&quot;,widgetTitle: &quot;&lt;h4&gt;&lt;/h4&gt;&quot;,numPosts: 2,summaryLength: 0, titleLength: &quot;auto&quot;,thumbnailSize: 45,noImage: &quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC&quot;,containerId: &quot;sliding-tab&quot;,newTabLink: true,moreText: &quot;&quot;,widgetStyle: 2,callBack: function() {}}; </script> <script src='https://cdn.rawgit.com/Arlina-Design/redvision/master/sliderekomendasi.js' type='text/javascript'/>          </div> </div> </b:if>

Atau dapat juga ditambahkan di atas arahan </b:includable> post menyerupai ini :

<b:includable id='post' var='post'> ... ... ... <-- LETAKKAN KODE DI SINI --> </b:includable>

numPosts: 2 : Jumlah pos yang akan ditampilan, kalau menambahkan post sahabat juga harus mengatur tinggi widget slide boxnya

4. Simpan template dan lihat hasilnya.

Result

Demikian tutorial Cara Memasang Slide Box Rekomendasi di Blog, agar bermanfaat.

Tips Blogger Widget

Cara Memasang Slide Box Rekomendasi Di Blog

Concept Phone Kamis, 30 Agustus 2018

Manfaat Internal Link Bagi Sebuah Blog - Fungsi dan kegunaan internal link sangat penting untuk suatu blog, dasar dan cara menciptakan internal link ini saya coba kupas satu persatu. Teknik SEO yang satu ini masih sangat penting dan bermanfaat dalam penerapannya.

Fungsi dan kegunaan internal link sangat penting untuk suatu blog Manfaat Internal Link Bagi Sebuah Blog

Untuk belajar SEO (Search Engine Optimization) memang diharapkan kesabaran tingkat tinggi serta kejelian yang matang. Untuk proses tersebut membutuhkan waktu yang tidak sedikit guna mencapai hasil yang maksimal.

Bayangkan kalau hampir semua artikel anda menduduki peringkat 10 besar, niscaya jumlah traffic blog anda akan meningkat dengan pesat.

Dengan demikian pengunjung blog anda secara otomatis akan berlimpah. Selain judul dan penempatan kata kunci, hal yang sering di lakukan oleh para blogger profesional ialah membangun internal link.

Apa yang di maksud dengan internal link?

Internal link ialah sebuah link dari satu halaman menuju halaman lain di dalam sebuah blog/website yang sama, dimana isinya masih saling terkait atau berhubungan. Kira-kira tau kan apa yang dimaksud?

Kaprikornus dalam sebuah artikel atau posting kita sanggup memperlihatkan link yang menuju ke halaman artikel lain di dalam blog kita, yang isi posting tersebut masih berafiliasi dengan topik yang sedang dibahas.

Tahukah anda bagaimana cara google menilai kualitas dari blog anda secara keseluruhan? Salah satu evaluasi google ialah Bounce rate (pentalan) dan tahukah anda dengan istilah itu?

Kaprikornus begini, saya coba jelaskan secara singkat. Jika pengunjung itu betah di blog anda, membaca artikel anda dan tidak cepat-cepat mau meninggalkan artikel yang sedang dibaca akan menurunkan tingkat Bounce rate. Itu artinya artikel anda mungkin artikel yang sangat menarik, jadi waktu pengunjung sanggup bertahan lama.

Apalagi kalau pengunjung membaca artikel lain selain artikel yang dilihat pertama kali pada blog anda, itu artinya Bounce rate nya rendah. Dengan begitu google akan menilai bahwa artikel anda berkualitas, alasannya pengunjung betah.

Lain halnya kalau pengunjung membuka halaman artikel dan hanya sekilas membaca, sesudah itu pergi meninggalkan blog anda, itu berarti tingkat bounce rate nya tinggi. Nah kini anda setidaknya mengetahui arti dan istilah Bounce rate.

Dari sini terang penilain google terhadap suatu blog atau suatu artikel yang dipaparkan sanggup bermanfaat bagi pembaca atau tidak, dengan memperlihatkan internal link atau menambahkan internal link, atau artikel yang berkaitan dengan topik posting.

Pengunjung akan dengan gampang mengakses halaman lain yang diberi internal link tanpa harus meninggalkan halaman yang pertama. Kita sanggup atur penambahan link untuk terbuka di tab/halaman yang baru, sebagai teladan saya sanggup menambahkan internal link ibarat di bawah ini

Hal yang harus diperhatikan dalam menciptakan internal link

Manfaat lain dari internal link ialah terkait dengan SEO, ibarat yang sudah saya sebutkan di atas selain judul dan penempatan kata kunci pada artikel, internal link juga memperlihatkan visibilitas yang manis terhadap blog anda.

Semakin banyak halaman yang di kanal oleh pengunjung, maka semakin manis pula dimata mesin pencari. Google akan lebih banyak mengindek halaman pada blog serta artikel anda, hal ini tentunya akan sangat manis buat blog dan berpeluang untuk muncul dalam searching (hasil pencarian).

Tetapi anda juga harus perhatikan, bahwa menciptakan internal link itu ada aturannya

Di bawah ini beberapa hal atau cara yang harus anda perhatikan dalam memasang internal link dalam artikel.

1. Artikel yang di buat intenal link haruslah artikel yang terkait atau berafiliasi dengan topik, anda sanggup mengukur tingkat relevansi artikel yang akan di buat atu di pasang link. Yang saya tau dan pernah baca, ini akan meningkatkan kekuatan SERP ( Search Engine Result Page).

2. Menggunakan anchor teks yang variatif sesuai dengan halaman yang di tuju. Hal ini akan memperbanyak pula variasi kata kunci, untuk hasil pencarian di search engine.

Sebagai teladan link utama ialah Cara menambahkan internal link, anda sanggup buat anchor link nya dengan kata Cara menciptakan internal link yang benar. Atau sesuai dengan kata variatif lain yang sanggup mendekati kata kunci tersebut.

3. Maksimal gunakan 3 internal link untuk satu halaman posting atau artikel anda. Ingat penggunaan internal link yang berlebihan akan di anggap spam oleh google, hal ini justru akan menjadi bumerang bagi blog anda alasannya google sangat tidak menyukai spam.

Kaprikornus gunakan internal link sewajarnya saja. Resiko blog yang nye-pam akan ditendang sama google, kalau sudah begitu, maka sakitnya tu di sini mas bero.

Jika artikel anda berurutan, maka akan lebih gampang dalam penggunaan internal link ini. Lakukan pemakaian internal link secara teratur, antara satu artikel terhadap artikel lainnya.

Usaha yang dilakukan ini membutuhkan waktu dan kesabaran, memasang dan meggunakan internal link,dan anchor “sebagai kata kunci” memudahkan robot google meng-crawl artikel sebuah blog.

Semakin teratur penggunaan internal link semakin mempermudah pula robot google merayapi blog anda. Fungsi lain dari internal link ialah meningkatkan Page view pada blog,

Semakin banyak page view semakin manis pula penilain google terhadap blog anda.

Walaupun ini terbilang renta atau klasik, hingga kini para webmaster masih menerapkan penggunaan dari internal linking ini.

SEO Tips Blogger

Manfaat Internal Link Bagi Sebuah Blog

Concept Phone Rabu, 01 Agustus 2018

Cara Memasang Iklan Adsense di Tengah Postingan - Masih membahas seputar Adsense, kali ini membahas perihal trik dan tips Cara Memasang Iklan Adsense di tengah postingan. Sebetulnya sudah berbagai artikel yang membahas perihal trik ini, namun kebetulan di blog ini belum ada jadi aku bagikan dan mungkin judulnya agak mainstream berdasarkan aku tapi tidak apa-apa yang penting berbagi.

Manfaat dari trik Memasang Iklan Adsense di tengah postingan ini adalah sahabat sanggup lebih meningkatkan pendapatan Google Adsense blog sahabat dengan jumlah rasio klik yang lebih tinggi dan biasanya akan lebih menarik minat pembaca dengan konten iklan yang ditampilkan alasannya posisi iklan yang strategis berada di tengah postingan. Singkat saja, berikut Cara Memasang Iklan Adsense di Tengah Postingan.

Cara Memasang Iklan Adsense di Tengah Postingan

Caranya sangat mudah, d sini sahabat hanya perlu mengganti arahan tertentu pada template dan menggantinya dengan arahan yang akan aku berikan pada panduan di bawah ini.

1. Silakan login ke Blogger dan pilih blog yang akan diedit, klik sajian Template, klik tombol Edit HTML, lalu cari dan ganti arahan ini <data:post.body/> di template sahabat dengan arahan di bawah ini

Di dalam template sahabat akan menemukan beberapa arahan <data:post.body/> tergantung template yang digunakan, coba satu persatu hingga iklan tampil di dalam halaman artikel

<div expr:id='&quot;zet1&quot; + data:post.id'/> <div class='googlezet'> <!-- pasang arahan iklan yang telah diparse di sini --> </div> <div expr:id='&quot;zet2&quot; + data:post.id'><p><data:post.body/></p></div> <script type='text/javascript'> var obj0=document.getElementById(&quot;zet1<data:post.id/>&quot;);var obj1=document.getElementById(&quot;zet2<data:post.id/>&quot;);var s=obj1.innerHTML;var t=s.substr(0,s.length/3);var r=t.lastIndexOf(&quot;&lt;br&gt;&quot;);if(r&gt;0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+16);} </script>

Tambahkan arahan iklan pada arahan yang ditandai

2. Tambahkan juga arahan CSS di bawah ini semoga tampilan iklan terlihat rapi rata tengah sebelum ]]></b:skin> atau </style>

.googlezet{margin:15px auto;text-align:center}

3. Simpan template dan lihat hasilnya.

Result

Bukan hanya untuk menampilkan iklan dari Google Adsense, namun sahabat juga sanggup memasang arahan iklan lain atau konten lain menyerupai link postingan terkait, atau lainnya.

Demikian artikel singkat yang mudah-mudahan bermanfaat bagi sobat, terima kasih sudah berkunjung dan salam blogger.

AdSense CSS HTML Javascript Tips Blogger

Cara Memasang Iklan Adsense Di Tengah Postingan

Concept Phone Jumat, 09 November 2018

untuk Blogger sanggup dilakukan dengan cara mengoptimalkan halaman dalam suatu situs atau S Teknik dan Cara Optimasi SEO On Page

Teknik dan Cara Optimasi SEO On Page - Optimasi SEO On Page untuk Blogger sanggup dilakukan dengan cara mengoptimalkan halaman dalam suatu situs atau SEO on page dan halaman luar situs itu sendiri atau dikenal dengan istilah SEO off page.

Kenapa SEO On Page harus lebih didahulukan?

Jika diibaratkan sebuah bangunan, membangun sebuah blog maka yang harus terlebih dahulu dilakukan yaitu membangun sebuah pondasi yang berpengaruh semoga nanti bangunan tersebut menjadi kokoh serta tidak gampang tergoyahkan. Begitu juga dengan membangun sebuah Blog, langkah awal yang harus menjadi pertimbangan yaitu meneliti setiap bab (internal) sebuah blog dan berusaha untuk menjaga serta mengatur semoga adanya keseimbangan sebelum melaksanakan Optimasi SEO Off Page. Artinya kenapa kita harus terburu-buru dalam melaksanakan meningkatkan secara optimal keluar (Off Page), jikalau landasan awalnya sendiri belum siap.

Untuk itu, sebelum melangkah lebih jauh berikut hal-hal yang diharapkan sebagai landasan awal untuk membangun sebuah blog.

Pemilihan Template

Template yaitu kerangka awal dimana sebuah blog akan dibangun. Pada bab ini kita dituntut untuk mengenal lebih dalam huruf sebuah template. Jangan menentukan sebuah template hanya dilihat dari tampilan luarnya saja, tapi juga perlu dilihat struktur dalam template apakah sudah baik dan dekat dengan mesin pencari.

Pengaturan Tag Heading (H1 - H6)

Ini merupakan hal penting yang harus diatur sedemikian rupa. Sesuai dengan unsur yang dianjurkan search engine semoga lebih sanggup mengenali sebuah blog. Sebaiknya, hindari penggunaan dua atau lebih Tag H1 pada Postingan dan Halaman Statis. Selanjutnya gres pada sub judul kita gunakan Tag H2 (heading 2) dan begitu seterusnya sampai ke Heading yang lebih kecil.

Konten atau Isi

Content Is King demikianlah yang sering dibicarakan oleh para pakar SEO di seluruh dunia. Sekarang yang menjadi pertanyaan yaitu konten mirip apa yang bisa dibilang telah masuk dalam kategori konten yang berkualitas?

Menurut beberapa rekomendasi, yakni konten unik bukan hasil dari ~~copas~~ itulah yang sering kita dengar mengenai evaluasi konten yang berkualitas. Namun tentunya tidak cukup hanya sekedar unik saja, masih ada beberapa faktor lain yang akan menciptakan konten tersebut menjadi berkualitas dimata search engine.

Menu atau Navigasi

Menu atau Navigasi pada blog sanggup kita ibaratkan sebagai langkah awal pemandu seorang pengunjung untuk melangkah lebih jauh ke dalam blog kita. Kita bisa bayangkan, jikalau sebuah hotel glamor tanpa seorang resepsionsis penyambut tamu. Tamu tidak akan tahu kemudahan apa yang disediakan hotel yang ia kunjungi untuk menciptakan seorang tamu bisa betah berlama-lama di hotel tersebut. Dan ada kemungkinan ia akan memutuskan untuk berpikir mencari hotel lain yang bisa memberi rekomendasi ihwal hal yang beliau butuhkan.

Navigasi tersebut bisa berupa warta utama mirip Halaman Kontak, Tentang, Disclaimer, dan tak ketinggalan yaitu Sitemap atau Daftar Isi sebagai bab penting pada blog. Lalu sanggup pula ditambahkan dengan hidangan untuk Kategori dan lainnya.

Dengan kelengkapan pada Menu tersebut maka akan sangat membantu pengunjung dalam menemukan warta yang ia cari. Serta akan menjadi sebuah rekomendasi dari kita yang akan bermetamorfosis jalan penuntun bagi pengunjung untuk terus menjelajah setiap artikel blog.

Tidak hanya itu, sistem navigasi yang baik akan membuka peluang sebuah blog yang nantinya akan ditampilkan dengan Sitelink pada SERP khususnya Google.

Judul Postingan

Judul Postingan memiliki tugas penting dan harus memenuhi unsur kata kunci. Dalam hal ini diharapkan kreativitas dan ide, serta kemampuan membaca potensi kata kunci yang akan diketik oleh calon pengunjung di search engine.

Unsur lain yang tidak kalah penting dalam penentuan judul artikel yaitu harus memiliki relevansi dengan isi artikel bersangkutan. Untuk itu kita bisa memasang sebuah widget artikel terkait yang biasa dipasang sehabis simpulan dari sebuah artikel.

Navigasi Link Pada Konten

Pada sebuah blog, link yang menghubungkan satu halaman pada kehalaman lain, sangat berperan penting untuk meningkatkan ranking. Fungsi ini mirip dengan Menu Navigasi yang telah Saya sebutkan di atas. Link tersebut berkhasiat sebagai penunjuk bagi pengunjung dikala mencari warta selanjutnya atau yang terkait. Biasanya link-link tersebut sanggup dalam sebuah widget artikel terkait yang biasa dipasang sehabis simpulan dari sebuah artikel.

Pemilihan Kata Kunci

Kata Kunci atau keywords harus diadaptasi dengan Topik serta Judul Artikel. Secara umum, kata kunci utama yang kita bidik diupayakan mengandung unsur judul artikel dan relevan dengan isi konten. Dalam hal ini sedikit penambahan kata untuk menambah peluang memperoleh pengunjung yang memakai mesin pencari untuk menemukan Informasi. Sebaiknya hindari kata kunci tunggal, alasannya hampir pada semua kata kunci tunggal selalu akan berat persaingannya.

Pengaturan atau Peletakan Kata Kunci pada Konten

Pada sebuah artikel biasanya akan ada beberapa Paragraf, bagi dan atur keywords utama pada setiap paragraf dengan pas dan seimbang. Jangan menumpukkan kata kunci hanya pada beberapa paragraf saja. Rangkailah kata kunci tersebut se-natural mungkin dan tersemat secara merata pada beberapa bab konten.

Demikian sedikit tips SEO mengenai Teknik dan Cara Optimasi SEO On Page pada blog. Semoga bermanfaat.

SEO Tips Blogger

Teknik Dan Cara Meningkatkan Secara Optimal Seo On Page

Concept Phone Kamis, 21 Juni 2018

Cara Mencegah Redirect otomatis dari blogspot Cara Mencegah Redirect Otomatis dari blogspot.com ke blogspot.co.id

Cara Mencegah Redirect otomatis dari blogspot.com ke blogspot.co.id - Pada kesempatan kali ini akan menyebarkan tutorial terkait yang tengah hangat diperbincangkan para blogger khususnya blogger di Indonesia mengenai pengalihan blog yang bersubdomain blogspot.com ke blogspot.co.id.

Di sini Saya tidak akan membahas perihal pengalihan ini namun pada artikel ini Saya hanya akan memperlihatkan sebuah tutorial perihal bagaimana Cara Mencegah Redirect otomatis dari blogspot.com ke blogspot.co.id. Sebetulnya tutorial ini sudah usang dan sudah banyak yang menyebarkan di sumber lain, namun tidak ada salahnya jikalau kini menyebarkan di sini alasannya ialah pada dikala ini mungkin akan bermanfaat bagi sobat.

Baca juga : Cara Mengalihkan URL Blog Lama ke Blog Baru

Catatan : Bagi pengguna blogger yang sudah memasang iklan Adsense di blognya, disarankan untuk tidak memasang instruksi yang akan Saya bagikan ini. Karena mungkin akan dianggap menyalahi peraturan kebijakan dari Google Adsense.

Langsung saja ikuti langkah sederhana berikut ini :

1. Buka Blogger > Template > Edit HTML > Kemudian tambahkan instruksi di bawah ini sempurna di bawah <head> atau di atas </head> :

<script type='text/javascript'> var str=window.location.href.toString();if("-1"==str.indexOf(".com/")){var str1=str.substring(str.lastIndexOf(".blogspot."));if("-1"==str1.indexOf("/"))var str2=str1;else var str2=str1.substring(0,str1.indexOf("/")+1);window.location.href=window.location.href.toString().replace(str2,".blogspot.com/ncr/")} </script>

Atau dapat juga dengan instruksi ini :

<script type="text/javascript"> var blog = document.location.hostname;var slug = document.location.pathname;var ctld = blog.substr(blog.lastIndexOf("."));if (ctld != ".com") {var ncr = "http://" + blog.substr(0, blog.indexOf("."));ncr += ".blogspot.com/ncr" + slug;window.location.replace(ncr);} </script>

2. Simpan template.

Kini dengan menambahkan instruksi di atas dimanapun lokasi pengunjung yang membuka blog sobat, blog tersebut tidak akan teredirect secara otomatis ke subdomain lain, menyerupai blogspot.co.id atau blogspot.co.uk.

Demikian mengenai Cara Mencegah Redirect otomatis dari blogspot.com ke blogspot.co.id, selamat mencoba dan biar bermanfaat.

Javascript Tips Blogger

Cara Mencegah Redirect Otomatis Dari Blogspot.Com Ke Blogspot.Co.Id

Concept Phone Senin, 16 Juli 2018

Memasang Tombol Back to Top dengan jQuery UI Memasang Tombol Back to Top dengan jQuery UI

Memasang Tombol Back to Top dengan jQuery UI - Pada kesempatan kali ini akan menyebarkan cara memasang sebuah tombol back to top yang sahabat sudah tidak absurd lagi dengan embel-embel pengaruh jQuery UI.

Pada artikel yang kemudian Saya pernah menyebarkan tutorial terkait tombol back to top ini :

Baca juga : Tombol Back to Top Roket Meluncur dan Memasang Smooth Back to Top di Blog

Bagi yang ingin mencobanya, silakan ikuti langkah berikut :

Catatan : Jika di template blog sudah terpasang tombol back to top, silakan hapus terlebih dahulu tombol tersebut.

1. Login ke Blogger > Template > Edit HTML > Tambahkan isyarat di bawah ini sebelum ]]></b:skin> atau </style>

/* Back to top */ #easy-top{background:rgba(0,0,0,.5);text-align:center;position:fixed;bottom:15px;right:15px;cursor:pointer;width:38px;height:38px;line-height:38px;border-radius:4px;padding:4px;display:none;-webkit-transform:translateZ(0);box-sizing:initial;transition:all .3s ease-out}#easy-top:hover{background:rgba(0,0,0,.9)}#easy-top:before,#easy-top:after{-webkit-backface-visibility:hidden;box-sizing:initial;}#easy-top:before{content:'';height:8px;width:8px;display:block;border:3px solid #fff;border-left-width:0;border-bottom-width:0;transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg);position:absolute;top:15px;left:18px}#easy-top:after{content:'';height:16px;width:3px;display:block;background:#fff;position:absolute;top:17px;left:22px}#easy-top:hover:after{border-color:transparent transparent rgba(0,0,0,.9)transparent}

2. Selanjutnya, tambahkan isyarat di bawah ini sebelum </body>

<div id='easy-top'/> <script type='text/javascript'> //<![CDATA[ $(function(){$(window).scroll(function(){$(this).scrollTop()>600?$("#easy-top").fadeIn(100):$("#easy-top").fadeOut(0)}),$("#easy-top").click(function(){$("html, body").animate({scrollTop:0},{duration:2e3,easing:"easeOutQuint"})})}); //]]> </script> <script src='https://cdn.rawgit.com/Arlina-Design/redvision/master/easing.js' type='text/javascript'/>

3. Simpan template dan lihat hasilnya.

Result

Jika ingin memasang tombol back to top dengan pengaruh bounce, silakan tambahkan isyarat di bawah ini :

<div id='easy-top'/> <script type='text/javascript'> //<![CDATA[ $(function(){$(window).scroll(function(){$(this).scrollTop()>600?$("#easy-top").fadeIn(100):$("#easy-top").fadeOut(0)}),$("#easy-top").click(function(){$("html, body").animate({scrollTop:0},{duration:2e3,easing:"easeOutBounce"})})}); //]]> </script> <script src='https://cdn.rawgit.com/Arlina-Design/redvision/master/easing.js' type='text/javascript'/>

Untuk mengganti dengan pengaruh lain, silakan kunjungi http://easings.net kemudian ganti isyarat yang ditandai dengan nama pengaruh yang tersedia.

Result

Demikian mengenai Cara Memasang Tombol Back to Top dengan jQuery UI. Semoga bermanfaat.

CSS HTML jQuery Tips Blogger

Memasang Tombol Back To Top Dengan Jquery Ui

Concept Phone Rabu, 11 Juli 2018