Tampilkan postingan dengan label Blogspot. Tampilkan semua postingan
Tampilkan postingan dengan label Blogspot. Tampilkan semua postingan

Selasa, 10 Maret 2020

Cara Memperbaiki Error Breadcrumb Data-Vocabulary.org Di Blog

Cara Memperbaiki Error Breadcrumb Data-Vocabulary.org Di Blog. Google Webmaster Tools alias Google Search Console terus saja selalu melakukan update untuk meningkatkan kualitas pada hasil pencarian agar mampu menyaring informasi yang tepat untuk penggunanya.

Karena alasan tersebut, maka google dan bing webmaster juga mendeteksi website atau blog melalui struktur data pada website tersebut menggunakan markup schema.org. Maka tak heran jika kalian pernah mendapatkan email dari google webmaster yang menyatakan bahwa Breadcrumb Data-Vocabulary.org mengalami eror sehingga perayapan blog kalian mengalami gangguan.

Untuk memperbaiki masalah tersebut saya akan menunjukkan solusinya untuk mengatasi breadcrumb yang error tersebut dengan mudah.
Cara Memperbaiki Error Breadcrumb Data-Vocabulary.org Di Blog
Contoh schema markup Breadcrumb yang valid tanpa error

Cara Mudah Untuk Memperbaiki Breadcrumb Data-Vocabulary.org Yang Error Di Blog

1. Buka blog kalian, dan masuk ke menu "Tema > Edit HTML".
2. Setelah itu cari kode .breadcrumb atau .breadcrumbs lalu hapus semua kode CSS tersebut ganti dengan kode berikut.
/* Breadcrumbs */
.breadcrumbs{line-height:1.2em;width:auto;overflow:hidden;margin:0;padding:10px 0;border-top:1px solid #dedede;border-bottom:1px solid #dedede;font-size:80%}
.breadcrumbs a{display:inline-block;text-decoration:none;transition:all .3s ease-in-out;color:#666;font-weight:400}
.breadcrumbs a:hover{color:#11589D}
.breadcrumbs svg{width:16px;height:16px;vertical-align:-4px}
.breadcrumbs svg path{fill:#666}

3. Selanjutnya kalian cari kode <b:includable id='breadcrumb' var='post'> atau <b:includable id='breadcrumbs' var='post'> lalu hapus semua kode tadi dan ganti dengan kode yang baru ini.
Jika kode tersebut tidak ada, maka letakkan kode berikut berada di bawah penutup kode <b:includable id='comment-form' var='post'>...</b:includable>

<b:includable id='breadcrumb' var='post'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' itemscope='itemscope' itemtype='https://schema.org/BreadcrumbList'>
<svg viewBox='0 0 24 24'><path d='M10,20V14H14V20H19V12H22L12,3L2,12H5V20H10Z' fill='#000000'/></svg>
<span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
<a expr:href='data:blog.homepageUrl' itemprop='item' title='Home'>
<span itemprop='name'>Home</span></a>
<meta content='1' itemprop='position'/>
</span>
<svg viewBox='0 0 24 24'><path d='M5.5,9A1.5,1.5 0 0,0 7,7.5A1.5,1.5 0 0,0 5.5,6A1.5,1.5 0 0,0 4,7.5A1.5,1.5 0 0,0 5.5,9M17.41,11.58C17.77,11.94 18,12.44 18,13C18,13.55 17.78,14.05 17.41,14.41L12.41,19.41C12.05,19.77 11.55,20 11,20C10.45,20 9.95,19.78 9.58,19.41L2.59,12.42C2.22,12.05 2,11.55 2,11V6C2,4.89 2.89,4 4,4H9C9.55,4 10.05,4.22 10.41,4.58L17.41,11.58M13.54,5.71L14.54,4.71L21.41,11.58C21.78,11.94 22,12.45 22,13C22,13.55 21.78,14.05 21.42,14.41L16.04,19.79L15.04,18.79L20.75,13L13.54,5.71Z' fill='#000000'/></svg>
<b:loop index='num' values='data:post.labels' var='label'>
<span itemprop='itemListElement' itemscope='itemscope' itemtype='https://schema.org/ListItem'>
<a expr:href='data:label.url + &quot;?&amp;max-results=16&quot;' expr:title='data:label.name' itemprop='item'>
<span itemprop='name'><data:label.name/></span>
</a>
<meta expr:content='data:num+2' itemprop='position'/>
</span>
<b:if cond='data:label.isLast != &quot;true&quot;'>
<svg viewBox='0 0 24 24'><path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/></svg>
</b:if>
</b:loop>
<svg viewBox='0 0 24 24'><path d='M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z' fill='#000000'/></svg>
<span><data:post.title/></span>
</div>
</b:if>
</b:loop>
</b:if>
</b:includable>

4. Kemudian kalian cari kode <b:includable id='main' var='top'> dan letakkan kode berikut tepat berada di bawah kode itu.
<b:include data='posts' name='breadcrumb'/>

5. Jangan lupa klik tombol "Simpan Tema" untuk menyimpan perubahan tersebut.

Setelah semuanya sudah kalian terapkan, maka silahkan tunggu beberapa hari dan lihat perubahanya di situs Google Search Console. Maka semua error tersebut akan segera hilang.

Baca juga:

Demikian panduan untuk Cara Memperbaiki Error Breadcrumb Data-Vocabulary.org Di Blog yang dapat saya tunjukkan. Semoga bermanfaat dan terima kasih.

Jumat, 06 Maret 2020

Cara Mudah Memasang Widget Push Notification Di Blog

Cara Mudah Memasang Widget Push Notification Di Blog. Widget Push Notification merupakan sebuah fitur pada suatu website ataupun blog yang berfungsi untuk memberikan notifikasi mengenai informasi artikel terbaru kepada para pengungjung blog meskipun mereka sedang tidak membuka situs kita.

Dengan memanfaatkan widget ini maka tentunya hal itu bisa menjangkau para pengunjung yang pernah membuka blog kita, sehingga dapat terus meningkatkan visitor tetap (pengunjung lama).

Bahkan situs-situs besar juga menggunakan widget push notification untuk terus memberikan pengalaman yang terbaik kepada para pengunjungnya, seperti Facebook, Instagram, Pinterest, Twitter dan masih banyak lagi.

Lalu bagaimana caranya untuk memasang widget Push Notification pada blog kita?
Untuk itu kita dapat menggunakan layanan dari situs OneSignal. Dan untuk pemasangnya kalian dapat mengikuti tutorial berikut.

Cara Membuat Dan Memasang Widget Push Notification Di Blog Menggunakan OneSignal

1. Kunjungi situs OneSignal terlebih dahulu, kemudian klik tombol Sign Up untuk membuat akun dan login di OneSignal.

2. Setelah itu isi semua data form pendaftaran yang ada di situs OneSignal tersebut.
Cara Mudah Memasang Widget Push Notification Di Blog
  • Email Address: Isikan alamat email anda.
  • Password: Buat password baru untuk akun OneSignal kalian.
  • Company or Organization Name: Isi saja dengan nama blog atau nama kalian sendiri.
Jika semua sudah lengkap maka silahkan klik "Create Account".

3. Setelah kalian menekan tombol "Create Account" maka kalian harus melakukan verifikasi akun melalui kotak masuk di alamat email yang telah kalian daftarkan tadi.
Cara Mudah Memasang Widget Push Notification Di Blog 2

4. Selanjutnya isi nama website kalian dan pilih opsi "Web Push" lalu pilih tombol "Next Configuration Your Platform".
Cara Mudah Memasang Widget Push Notification Di Blog 3

5. Kemudian silahkan kalian isi semua data form konfigurasi yang ada pada widget Web Push tersebut.
Cara Mudah Memasang Widget Push Notification Di Blog 4

Choose Intergration
Jika kalian pengguna website yang memakai platform Wordpress atau Blogspot, maka kalian harus pilih opsi "Wordpress Plugin or Website Builder" lalu pilih CMS kalian yang sesuai, jika menggunakan blogspot maka pilih blogger, jika menggunakan Wordpress maka pilihlah Wordpress.

Blogger Site Setup
  • Site Nama: Nama situs kalian.
  • Site Url: Url atau link untuk menuju halaman blog kalian.
  • Icon Url: Silahkan upload logo atau favicon blog kalian.
  • Label: Gunakan saja nama domainmu (tanpa ekstensi).

6. Untuk melihat dan mengedit tampilan widget Push Notification kita bisa mengklik tombol "Opens Slide Prompt".
Cara Mudah Memasang Widget Push Notification Di Blog 5
Maka setelah itu akan muncul sebuah pop up pratinjau untuk mengedit widget tersebut.
Silahkan kalian sesuaikan isi pesan dan tombol pada Push Notification Blog tersebut, jika semuanya sudah sesuai maka silahkan kalian klik "Save".

7. Selanjutnya silahkan kalian scroll ke halaman yang paling bawah, kemudian klik tombol "Save", lalu akan muncul script untuk membuat widget Push Notification yang berisi kode JavaScript (JS) tersebut.
Cara Mudah Memasang Widget Push Notification Di Blog 6
Silahkan kalian pasang di blog kalian, letakkan kode tersebut di dalam tag ... jika sudah selesai maka kalian klik tombol "Finish".

Baca juga:

Oke, itulah tutorial mengenai Cara Memasang Widget Push Notification Di Blog yang dapat saya tunjukkan. Untuk melihat hasilnya, kalian bisa mengunjungi situs ini dan tunggu beberapa detik agar Push Notification bisa tampil.

Rabu, 26 Februari 2020

Cara Ampuh Memperbaiki Error Pada Struktur Data Blogger (Lengkap)

Cara Ampuh Memperbaiki Error Pada Struktur Data Blogger (Lengkap). Struktur data blog merupakan salah satu komponen blog yang amat penting, sebab struktur data ini dapat memudahkan mesin pencari untuk memahami dan melakukan crawl pada website atau blog kita.

Struktur Data ini biasa disebut dengan nama Schema Markup, untuk saat ini google telah merekomendasikan template blog yang sudah mendukung Schema Markup.

Cara Mengecek Struktur Data Schema Markup Blog

Cara Ampuh Memperbaiki Error Pada Struktur Data Blogger (Lengkap)
Struktur Data Blog Tanpa Eror Setelah Diperbaiki

Untuk mengetahui tentang struktur data yang ada di blog kalian, maka kalian bisa mengeceknya melalui https://search.google.com/structured-data/testing-tool disitu kalian juga bisa melihat bagian struktur data yang mengalami eror.

Kalian hanya perlu menuju ke situs https://search.google.com/structured-data/testing-tool lalu masukkan url halaman homepage dan artikel kalian, setelah itu klik tombol "Jalankan Test" untuk melihat hasil analisanya.

Cara Memperbaiki Error Struktur Data Blogger

Jika struktur data blog kalian menampilkan pesan error dan peringatan pada Google Struktur Data maka kalian harus memperbaikinya agar tidak berimbas pada mesin pencari.

1. Memperbaiki Struktur Data Pada BlogPosting Dan mainEntityOfPage
Properti BlogPosting merupakan sebuah properti utama untuk membungkus semua komponen struktur data yang penting, seperti Item property "mainEntityOfPage" yang bisa kita isi dengan sebuah url blog sebagai item id, Image Object, Author, Publisher dan masih banyak lagi.

Silahkan kalian cari kode yang terdapat atribut class='post hentry' biasanya kode seperti ini <div class='post hentry'> tergantung dari template yang kalian pakai.

kemudian kalian hapus tag <div class='post hentry'> tersebut dan ganti dengan kode berikut.
<div class='post hentry' expr:id='&quot;post-body-&quot; + data:post.id' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>
<meta expr:itemid='data:post.link ? data:post.link : data:post.url' itemType='https://schema.org/WebPage' itemprop='mainEntityOfPage' itemscope='itemscope'/>

2. Memperbaiki Struktur Data Pada datePublished Dan dateModified
Struktur data datePublished dan dateModified merupakan sebuah schema markup yang bertujuan untuk menandai waktu postingan itu diterbitkan dan dimodifikasi (diperbarui).

Jika struktur data tersebut error maka cari Kode berikut (kode yang sama dari saya pada nomor 1 tadi).
<div class='post hentry' expr:id='&quot;post-body-&quot; + data:post.id' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>

Lalu letakkan kode berikut ini berada dibawah kode tadi
<meta expr:content='data:post.timestampISO8601' itemprop='datePublished'/>
<meta expr:content='data:post.lastUpdatedISO8601' itemprop='dateModified'/>

3. Mengatasi Struktur Data Error Pada Image Object
Struktur Data Image Object ialah untuk mengidentifikasi gambar pada sebuah artikel blog kita, jika kode ini tidak ada maka akan menjadi error. Bagian ini struktur data yang paling susah untuk diperbaiki menurut saya, tapi untungnya saya sudah menemukan solusinya.

Silahkan kalian cari kode <meta expr:content='data:post.lastUpdatedISO8601' itemprop='dateModified'/> dan letakkan kode ini dibawah kode tersebut.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div itemprop='image' itemscope='itemscope' itemtype='https://schema.org/ImageObject' style='display:none;'>
<img expr:src='data:post.firstImageUrl'/>
<meta expr:content='data:post.firstImageUrl' itemprop='url'/>
</div>
<b:else/>
<div itemprop='image' itemscope='itemscope' itemtype='https://schema.org/ImageObject' style='display:none;'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7QDNI9OEY4A1IGKU1bAFRnmoXDzhYTVqBsFtopiInph_WsU-FC-Bq5HziOzXLD_S9sCr9XiDQ9VHtDicCDMAxcaFiT_mjSrbl7OonJ3LDytmDFgHuQ5OUh67X7vIPY1X0eAFt9fqEbIo/s1600/V+Vuiral+Favicon+Color+psd.png'/>
<meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7QDNI9OEY4A1IGKU1bAFRnmoXDzhYTVqBsFtopiInph_WsU-FC-Bq5HziOzXLD_S9sCr9XiDQ9VHtDicCDMAxcaFiT_mjSrbl7OonJ3LDytmDFgHuQ5OUh67X7vIPY1X0eAFt9fqEbIo/s1600/V+Vuiral+Favicon+Color+psd.png' itemprop='url'/>
</div>
</b:if>

Kalian juga bisa mengganti url gambar Image Object tersebut dengan url logo ataupun favicon blog kalian.

4. Memperbaiki Struktur Data Pada Author
Struktur data pada author ialah untuk mengenali siapa penulis atau pengarang blog tersebut. Biasanya kode pada template bawaan blogger error pada bagian ini sehingga perlu diganti.

Cari kode berikut
<b:if cond='data:post.authorProfileUrl'>
<a class='g-profile' expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
<data:post.author/>
</a>
<b:else/>

Kemudian kalian ganti dengan kode dibawah ini
<b:if cond='data:post.authorProfileUrl'>
<span class='post-author vcard' itemtype='https://schema.org/Organization'>
<b:if cond='data:post.authorProfileUrl'>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
<a class='g-profile' expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>
<span itemprop='name'><data:post.author/></span>
</a>
</span>
<b:else/>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<span itemprop='name'><data:post.author/></span>
</span>
</b:if>
</span>
</b:if>

5. Mengatasi Struktur Data Pada Publisher
Jika publisher adalah seorang penulis alias content writer pada blog tersebut maka struktur data Publisher bertujuan untuk menandai pemilik hak paten seutuhnya tentang blog tersebut.

Cari kode atau tag memiliki property dan value itemtype='https://schema.org/BlogPosting' seperti kode berikut.
<div class='post hentry' expr:id='&quot;post-body-&quot; + data:post.id' itemscope='itemscope' itemtype='https://schema.org/BlogPosting'>

Setelah ketemu maka silahkan kalian tambahkan kode berikut ini dibawah kode tadi.
<div itemprop='publisher' itemscope='itemscope' itemtype='https://schema.org/Organization'>
<div itemprop='logo' itemscope='itemscope' itemtype='https://schema.org/ImageObject' style='display:none;'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7QDNI9OEY4A1IGKU1bAFRnmoXDzhYTVqBsFtopiInph_WsU-FC-Bq5HziOzXLD_S9sCr9XiDQ9VHtDicCDMAxcaFiT_mjSrbl7OonJ3LDytmDFgHuQ5OUh67X7vIPY1X0eAFt9fqEbIo/s1600/V+Vuiral+Favicon+Color+psd.png'/>
<meta content='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7QDNI9OEY4A1IGKU1bAFRnmoXDzhYTVqBsFtopiInph_WsU-FC-Bq5HziOzXLD_S9sCr9XiDQ9VHtDicCDMAxcaFiT_mjSrbl7OonJ3LDytmDFgHuQ5OUh67X7vIPY1X0eAFt9fqEbIo/s1600/V+Vuiral+Favicon+Color+psd.png' itemprop='url'/>
<meta content='150px' itemprop='width'/>
<meta content='150px' itemprop='height'/>
</div>
<meta expr:content='data:blog.title' itemprop='name'/>
</div>

Silahkan kalian ganti url gambar tersebut dengan url logo blog kalian masing-masing.

6. Memperbaiki Struktur Data Name Dan Headline
Cari kode berikut ini, biasanya terdapat dua kode atau lebih yang mirip dengan ini.
<h1 class='post-title entry-title'>

Lalu ganti kode tersebut dengan kode berikut ini.
<h1 class='post-title entry-title' itemprop='name headline'>

Baca juga:

Itu tadi merupakan artikel yang membahas Cara Ampuh Memperbaiki Error Pada Struktur Data Blogger (Lengkap) yang dapat saya bagikan kepada kalian semua.

Jika kalian sudah mengikuti tutorial di atas maka jangan lupa untuk menyimpan perubahan template blog kalian dan mengeceknya di google data struktur untuk melihat hasil perbaikannya.

Senin, 13 Januari 2020

10 Cara Praktis Dan Efektif Untuk Mempercepat Loading Blog

Cara Praktis Dan Efektif Untuk Mempercepat Loading Blog Di Blogger/Blogspot. SEO On Page merupakan suatu hal yang sangat penting untuk diterapkan pada sebuah website, sebab ada banyak sekali cara untuk melakukan optimasi SEO On Page, salah satunya ialah dengan mengoptimasi kecepatan website itu sendiri.

Dengan melakukan optimasi pada sebuah blog maka hal itu juga dapat membuat para pengunjung kita merasa nyaman sehingga dapat meningkatkan kualitas blog kita. Untuk mengoptimasi juga tergolong sangat mudah dan simpel, silahkan simak penjelasan lengkapnya di bawah ini.

Tips Mengoptimasi Loading Blog Di Blogger/Blogspot Agar Fast Loading

Cara Praktis Dan Efektif Dalam Mempercepat Loading Blog

1. Mencopot Widget

Langkah pertama yang dapat kalian lakukan ialah mencopot semua widget yang tidak penting, sebab terlalu banyak widget maka loading blog kita akan menjadi berat sehingga waktu untuk menampilkan halaman blog kita sangat lama.

2. Membatasi Jumlah Postingan

Membatasi jumlah postingan pada beranda alias homepage juga dapat mempengaruhi kecepatan blog. Semakin banyak jumlah artikel yang tampil di homepage maka akan semakin berat pula loading blog kita. Maka dari itu kita harus membatasi jumlahnya dengan menampilkan maksimal 4-8 artikel saja.

3. Membatasi Jumlah Iklan

Iklan merupakan sebuah media promosi yang paling efektif untuk mandapatkan sumber penghasilan dari blog, sebab melalui iklan inilah para blogger akan mendapatkan uang atau bayaran dari para pengiklan karena telah memasarkan produknya.

Perlu kalian ketahui juga, memasang iklan banner itu sama saja kita memasang sebuah widget. Jadi hal ini juga dapat mempengaruhi loading blog, terutama iklan banner yang memakai gambar berukuran besar.

Maka dari itu kita harus mengoptimalkan pemasangan iklan agar tidak mengganggu performa blog dengan membatasi jumlah iklan tersebut.

4. Mengecilkan Size File Gambar

Mengecilkan ukuran file gambar ternyata juga dapat berpengaruh besar dengan kecepatan blog, sebab gambar menjadi file yang sangat membutuhkan banyak sekali resource. Maka dari itu sebelum kita memposting gambar di artikel blog sebaiknya kita harus mengompresinya terlebih dahulu.

Untuk mengkompresi sebuah gambar kita dapat memakai software Adobe Photoshop atau bisa juga dengan memakai tool online di internet seperti TinyPNG dan masih banyak lagi.
Baca juga:

5. Gunakan Script Lazy Load Gambar

Jika kalian tidak ingin repot repot untuk mengurusi file gambar, maka kalian bisa mengakalinya dengan memasang script lazyload untuk gambar seperti yang sudah saya tunjukkan di tutorial sebelumnya.

6. Pasang Script Lazy Load Iklan Adsense

Khusus untuk kalian para publisher iklan google adsense, kalian dapat memanfaatkan script lazyload iklan adsense yang satu ini agar loading blogmu tetap stabil walaupun kamu memasang banyak iklan di halaman blog tersebut.

7. Minify Kode CSS Dan JS

Kode CSS dan JavaScript merupakan sebuah kode membutuhkan banyak sekali sumber daya, sebab kode ini dapat dipakai untuk memanipulasi tampilan ataupun mengeksekusi sebuah data, sehingga kode ini sering ditulis berulang-ulang.

Agar tidak menghabiskan banyak resource, maka kita dapat mengkompresi kode CSS dan JS dengan memanfaatkan tool Minify Code yang bisa kalian gunakan di halaman berikut Css And Javascript Minify Tool untuk mengurangi karakter yang tidak penting pada script tersebut.

Selain itu juga kita dapat mengumpulkan semua script CSS dan JS menjadi satu tempat agar lebih praktis.
Contoh kode script internal yang sudah diminify:
Kode CSS
<style>
/* related post */
.widget_popularpost{}
/* popular post */
.widget_sosialmedia{}
/* label post */
.widget_label{}
</style>

Kode JS
<script>
// kode untuk related post
var_relatedpost{()};
// kode untuk featured post
var_featuredpost{()};
// kode untuk lazy load
var_lazyload{()};
</script>

8. Gunakan Internal Script

Cara Praktis Dan Efektif Dalam Mempercepat Loading Blog 2
Selain melakukan kompresi file CSS dan JS pada template blogger, kita juga dapat meringankan loading blog dengan melakukan trik berikut. Yaitu menerapkan metode pemasangan script di internal.

Pada penempatan atau pemasangan sebuah script css dan js biasanya banyak yang diletakkan disimpan di hosting luar agar bisa diakses oleh banyak blog.
Namun hal ini tentu saja akan memperlambat loading blog karena request data skrip tersebut harus menunggu respon dari server dan juga dipengaruhi oleh banyaknya client yang mengakses server tersebut, sehingga waktu yang diperlukan untuk megeksekusi script tersebut akan lama.
Contoh script eksternal:
CSS
<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet'/>

JS
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js'/>

Di sisi lain pengnyimpanan skrip di internal yang akan membuat proses request data menjadi cepat dan tidak ada gangguan server luar, selain itu pengelolaan script di internal script juga akan lebih mudah.

Contoh script internal:
CSS
<style>
/* tombol sosmed*/
.socmed_btn{display:block;margin:10px;text-align:center}
.socmed_btn a{text-decoration:none;display:inline-block}
</style>

JS
<script type='text/javascript'>
//Numbered Navigation Menu
  /*<![CDATA[*/
    var perPage=8;
    var numPages=2;
    var prevText ='« Previous';
    var nextText ='Next »';
    var urlactivepage=location.href;
  /*]]>*/
</script>

Lantas apa solusinya? solusinya kalian hanya perlu menyalin kode css dan js yang kalian simpan di hosting eksternal, lalu kalian simpan di dalam template blog kalian sendiri.

9. Menghapus Kode Bawaan CSS, JavaScript Dan Widget Bundle Blogger

Cara Praktis Dan Efektif Dalam Mempercepat Loading Blog 3
Blogger merupakan sebuah platform media sosial berjenis blog, platform ini dapat kita nikmati dengan gratis namun kita tidak dapat leluasa dalam melakukan optimasi karena kita hanya menumpang di hosting google.

Sehingga kita tidak bisa menghapus script bawaan blogger yang berfungsi untuk mengeksekusi data seperti widget contact form, email subscribe, kolom komentar dan widget blogger lainnya. Tentu hal itu bisa saja membuat loading blog menjad lamban akibat terlalu banyaknya script yang akan diekseskusi.

Untuk mengatasi hal tersebut kita dapat melakukan trik agar script tersebut dengan memanipulasi kode pada tag head dan body. Untuk tutorialnya kalian bisa searching "Cara menghapus kode bawaan css bundle blogger".

Cara ini akan memberikan resiko yang besar, sebab beberapa fungsi widget pada blogspot akan menjadi tidak berfungsi serta tampilan pada blog akan menjadi berubah meskipun tidak signifikan.

10. Ganti Template

Apabila kalian sudah menerapkan semua tutorial di atas namun masih tetap tidak membuahkan hasil setelah diuji di hasil pagespeed insights, maka bisa jadi masalahnya terletak pada template blog kalian.

Beberapa alasan template blog yang load speednya sangat lemot ialah, terlalu banyak kode CSS dan JS eksternal, banyak script yang error, terlalu banyak script yang tidak penting untuk ditampilkan, kode javascript yang di encrypt dan masih banyak lagi alasan lainnya.

Jumat, 03 Januari 2020

2 Cara Memasang Lazy Load Gambar Di Blogger Untuk Meningkatkan Kecepatan Blog

Cara Memasang Lazy Load Gambar Di Blogger Untuk Meningkatkan Kecepatan Blog. Setelah membahas Cara Mempercepat Loading Iklan Adsense Meggunakan Script Lazy Load, kini kita akan membahas Lazy Load untuk menunda request data pada gambar di dalam blog.

Fungsi dari lazy load ini akan menunda request data gambar pada blog selama loading blog dan hanya diekseskusi pada saat loading blog sudah selesai dan melakukan scrolling pada browser tersebut. Jadi dengan memasang script yang satu ini akan membuat blog kita menjadi fast loading.

Cara Mempercepat Loading Blog Dengan Script Lazy Load Gambar Di Blogspot (Blogger.com)

Cara Mempercepat Loading Blog Dengan Script Lazy Load Gambar Di Blog

A. Lazy Load Gambar Secara Otomatis

Dengan menggunakan script ini, maka kita tidak perlu repot repot untuk melakukan seleksi data gambar yang ingin di beri perintah lazy load. Sebab script ini secara otomatis akan menyeleksi semua tag gambar <img>.

1. Buka blog kalian dan masuk ke menu "Tema" lalu klik "Edit HTML"
2. Copy javascript berikut ini lalu letakkan tepat di atas kode </body>
<script type='text/javascript'>//<![CDATA[
(function(a){a.fn.lazyload=function(b){var c={threshold:0,failurelimit:0,event:"scroll",effect:"show",container:window};if(b){a.extend(c,b)}var d=this;if("scroll"==c.event){a(c.container).bind("scroll",function(b){var e=0;d.each(function(){if(a.abovethetop(this,c)||a.leftofbegin(this,c)){}else if(!a.belowthefold(this,c)&&!a.rightoffold(this,c)){a(this).trigger("appear")}else{if(e++>c.failurelimit){return false}}});var f=a.grep(d,function(a){return!a.loaded});d=a(f)})}this.each(function(){var b=this;if(undefined==a(b).attr("original")){a(b).attr("original",a(b).attr("src"))}if("scroll"!=c.event||undefined==a(b).attr("src")||c.placeholder==a(b).attr("src")||a.abovethetop(b,c)||a.leftofbegin(b,c)||a.belowthefold(b,c)||a.rightoffold(b,c)){if(c.placeholder){a(b).attr("src",c.placeholder)}else{a(b).removeAttr("src")}b.loaded=false}else{b.loaded=true}a(b).one("appear",function(){if(!this.loaded){a("<img />").bind("load",function(){a(b).hide().attr("src",a(b).attr("original"))[c.effect](c.effectspeed);b.loaded=true}).attr("src",a(b).attr("original"))}});if("scroll"!=c.event){a(b).bind(c.event,function(c){if(!b.loaded){a(b).trigger("appear")}})}});a(c.container).trigger(c.event);return this};a.belowthefold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).height()+a(window).scrollTop()}else{var d=a(c.container).offset().top+a(c.container).height()}return d<=a(b).offset().top-c.threshold};a.rightoffold=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).width()+a(window).scrollLeft()}else{var d=a(c.container).offset().left+a(c.container).width()}return d<=a(b).offset().left-c.threshold};a.abovethetop=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollTop()}else{var d=a(c.container).offset().top}return d>=a(b).offset().top+c.threshold+a(b).height()};a.leftofbegin=function(b,c){if(c.container===undefined||c.container===window){var d=a(window).scrollLeft()}else{var d=a(c.container).offset().left}return d>=a(b).offset().left+c.threshold+a(b).width()};a.extend(a.expr[":"],{"below-the-fold":"$.belowthefold(a, {threshold : 0, container: window})","above-the-fold":"!$.belowthefold(a, {threshold : 0, container: window})","right-of-fold":"$.rightoffold(a, {threshold : 0, container: window})","left-of-fold":"!$.rightoffold(a, {threshold : 0, container: window})"})})(jQuery);$(function(){$("img").lazyload({placeholder:"http://i22.servimg.com/u/f22/15/42/72/40/grey10.gif",effect:"fadeIn",threshold:"-50"})})//]]></script>

3. Setelah selesai silahkan klik tombol "Simpan tema".
Setelah itu silahkan kalian cek sendiri blogmu, apakah script tersebut sudah.
Jika tampilan loading gambar pada blogmu mengalami penundaan maka script tersebut telah bekerja.
Baca juga:

B. Lazy Load Gambar Secara Manual Ala Igniel

Berbeda dengan script sebelumnya, script yang satu ini hanya akan berfungsi pada gambar yang diberi class "lazy" dan mengganti src pada tag gambar dengan menambahkan atribut data-src. Untuk lebih lengkapnya silahkan ikuti tutorial berikut.

1. Masuk ke blog, pilih menu "Tema" dan klik "Edit HTML".
2. Setelah cari kode tag <img> untuk gambar thumbnail blog kalian pada template tersebut.
Setiap template memiliki kode yang berbeda
<img expr:alt='data:post.title' expr:title='data:post.title' expr:src='data:post.firstImageUrl'/>

3. Jika kalian sudah menemukan kode tersebut, silahkan edit seperti ini:
Tambahkan atribut class='lazy' kedalam tag <img>
Ubah atribut expr:src menjadi expr:data-src pada tag <img>
Kemudian tambahkan kode ini juga kedalam tag <img>
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi85ldPhBCn8ub4Ju-lNwzA1epcs_2Fl5fRST6g1rXovjAPKU-DSSJCpb4BFkG2MTTHYazTNvCROej1DrMfgDQFPlgz89gssV5PCtlIFbzjG9oODBs1434yrum9ay3d6WCI5rgnk5kUbtbT/s1600/loadme.gif'

Jika sudah selesai, maka hasil akhir dari kode tersebut akan menjadi seperti ini.
<img class='lazy' expr:alt='data:post.title' expr:data-src='data:post.firstImageUrl' expr:title='data:post.title' itemprop='image' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi85ldPhBCn8ub4Ju-lNwzA1epcs_2Fl5fRST6g1rXovjAPKU-DSSJCpb4BFkG2MTTHYazTNvCROej1DrMfgDQFPlgz89gssV5PCtlIFbzjG9oODBs1434yrum9ay3d6WCI5rgnk5kUbtbT/s1600/loadme.gif'/>

4. Selanjutnya kalian copy kode dibawah ini dan letakkan di atas kode </body> lalu klik tombol "Simpan tema".
<script type='text/javascript'>//<![CDATA[
function ignielLazyLoad(){eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('u B(){Y(v e=o.1r("B"),t=0;t<e.1q;t++)Q(e[t])&&(e[t].N=e[t].1p("1n-N"))}u Q(e){v t=e.1t();Z t.1x>=0&&t.1w>=0&&t.1v<=(y.1u||o.T.1m)&&t.1k<=(y.1c||o.T.1b)}v b=["\\r\\m\\m\\D\\G\\a\\f\\c\\M\\n\\p\\c\\a\\f\\a\\k","\\h\\f","\\r\\c\\c\\r\\l\\A\\D\\G\\a\\f\\c","\\g\\h\\r\\m","\\p\\l\\k\\h\\g\\g","\\V\\1a\\1e\\R\\h\\f\\c\\a\\f\\c\\M\\h\\r\\m\\a\\m","\\w\\p\\a\\1l\\p\\c\\k\\n\\l\\c","\\r","\\1f\\w\\a\\k\\L\\1j\\a\\g\\a\\l\\c\\h\\k\\W\\g\\g","\\g\\a\\f\\q\\c\\A","\\w\\p\\a\\k\\W\\q\\a\\f\\c","\\c\\a\\p\\c","\\m\\h\\l\\w\\F\\a\\f\\c\\D\\g\\a\\F\\a\\f\\c","\\1i\\h\\m\\L","\\l\\g\\n\\l\\1g","\\p\\l\\k\\h\\g\\g\\1h\\h\\J","\\c\\h\\J","\\q\\a\\c\\S\\h\\w\\f\\m\\n\\f\\q\\R\\g\\n\\a\\f\\c\\1z\\a\\l\\c","\\A\\k\\a\\X","\\a\\1y\\a\\l","\\q\\a\\c\\D\\g\\a\\F\\a\\f\\c\\S\\L\\1F\\m","\\p\\l\\k\\h\\g\\g\\U\\a\\n\\q\\A\\c","\\n\\f\\f\\a\\k\\U\\a\\n\\q\\A\\c","\\J\\k\\a\\G\\a\\f\\c\\V\\a\\X\\r\\w\\g\\c","\\n\\c\\a\\F"];u I(d,j){y[b[0]]?y[b[0]](d,j):y[b[2]](b[1]+d,j)}I(b[3],B),I(b[4],B),o[b[0]](b[5],u(){b[6];Y(v d=o[b[8]](b[7]),j=d[b[9]],s=/1D|1B/i[b[11]](1G[b[10]])?o[b[12]]:o[b[13]],C=u(d,j,s,C){Z(d/=C/2)<1?s/2*d*d*d+j:s/2*((d-=2)*d*d+2)+j};j--;){d[b[1C]](j)[b[0]](b[14],u(d){v j,E=s[b[15]],x=o[b[1A]](/[^#]+$/[b[19]](1H[b[18]])[0])[b[17]]()[b[16]],z=s[b[1d]]-y[b[1s]],O=z>E+x?x:z-E,K=1o,H=u(d){j=j||d;v x=d-j,z=C(x,E,O,K);s[b[15]]=z,K>x&&P(H)};P(H),d[b[1E]]()})}});',62,106,'||||||||||x65|_0x1b5d|x74|_0xdd48x2||x6E|x6C|x6F||_0xdd48x3|x72|x63|x64|x69|document|x73|x67|x61|_0xdd48x4||function|var|x75|_0xdd48x7|window|_0xdd48x8|x68|lazy|_0xdd48x5|x45|_0xdd48x6|x6D|x76|_0xdd48xb|registerListener|x70|_0xdd48xa|x79|x4C|src|_0xdd48x9|requestAnimationFrame|isInViewport|x43|x42|documentElement|x48|x44|x41|x66|for|return|||||||||||x4F|clientWidth|innerWidth|21|x4D|x71|x6B|x54|x62|x53|left|x20|clientHeight|data|900|getAttribute|length|getElementsByClassName|22|getBoundingClientRect|innerHeight|top|right|bottom|x78|x52|20|trident|24|firefox|23|x49|navigator|this'.split('|'),0,{}));} eval(function(p,a,c,k,e,d){e=function(c){return c.toString(36)};if(!''.replace(/^/,String)){while(c--){d[c.toString(a)]=k[c]||c.toString(a)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('j 4=["\\7\\9\\9\\e\\d\\a\\b\\8\\i\\g\\h\\8\\a\\b\\a\\k","\\f\\c\\7\\9","\\7\\8\\8\\7\\m\\l\\e\\d\\a\\b\\8","\\c\\b\\f\\c\\7\\9"];5[4[0]]?5[4[0]](4[1],6,!1):5[4[2]]?5[4[2]](4[1],6):5[4[3]]=6;5[4[0]]?5[4[0]](4[1],6,!1):5[4[2]]?5[4[2]](4[1],6):5[4[3]]=6;',23,23,'||||_0xdfb4|window|ignielLazyLoad|x61|x74|x64|x65|x6E|x6F|x76|x45|x6C|x69|x73|x4C|var|x72|x68|x63'.split('|'),0,{}));
//]]></script>

Setelah itu silahkan cek blogmu untuk memastikannya. Kalian juga bisa menggunajan tool khusus untuk test kecepatan blog kalian di GTMetrix dan Pagespeed Insight

Script ini tidak hanya untuk dipakai ada gambar thumbnail blog saja, melainkan kita juga dapat menggunakannya pada popular post dan juga featured post. Untuk pengaplikasiannya juga sama seperti di atas.

Jumat, 27 Desember 2019

Cara Mempercepat Loading Iklan Adsense Meggunakan Script Lazy Load

Cara Mempercepat Loading Iklan Adsense Meggunakan Script Lazy Load. Memasang iklan dari google adsense merupakan sebuah salah satu dari sekian banyak cara untuk mendapatkan uang dari blog, namun setelah memasang widget dari adsense tersebut biasanya hal ini sangat mempengaruhi performa dan kualitas blog.

Contohnya ialah jika blog kita terlalu banyak iklan biasanya hal ini bisa mengganggu pengunjung blog kita karena banyaknya iklan yang memenuhi tampilan layar HP dan Desktop mereka, selain itu hal ini juga dapat memperberat performa loading blog kita sehingga akses menuju halaman blog kita menjadi lama dan lemot sehingga membuat para pengunjung blog menjadi tidak betah berada di dalam blog kita.

Untuk mengakali hal tersebut kita dapat memakai teknik khusus dengan memakai script lazy load pada widget adsense untuk menunda reauest data sementara waktu sehingga membuat loading blog menjadi lebih ringan

Meringankan Loading Blog Dengan Menambahkan Script Lazy Load Untuk Iklan Google Adsense

Cara Mempercepat Loading Iklan Adsense Meggunakan Script Lazy Load

1. Silahkan kalian masuk kedalam situs blogger.com dan pilih blogmu.

2. Pilih menu "Tema" lalu klik "Edit HTML".

3. Setelah itu kalian cari semua kode seperti ini dan hapus kode tersebut
<script async="" src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

4. Selanjutnya tambahkan kode berikut ini sebelum atau di atas tag </body>
Jika tidak ada kode </body> maka letakkan di atas tag  <!--</body>--></body>
<script type='text/javascript'>
//<![CDATA[
// Script Lazy Load For AdSense
var lazyadsense=!1;window.addEventListener("scroll",function(){(0!=document.documentElement.scrollTop&&!1===lazyadsense||0!=document.body.scrollTop&&!1===lazyadsense)&&(!function(){var e=document.createElement("script");e.type="text/javascript",e.async=!0,e.src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";var a=document.getElementsByTagName("script")[0];a.parentNode.insertBefore(e,a)}(),lazyadsense=!0)},!0);
//]]>
</script>

5. Jika semuanya sudah selesai silahkan kalian klik "Simpan" untuk menyimpan kode tersebut.

Kalian juga dapat mengecek kecepatan blog kalian sendiri di Pagespeed Insight atau GTMetrix untuk melihat hasil perubahannya. Saya sendiri pernah membuktikannya sendiri, setelah menerapkan metode ini kecepatan blog saya naik sekitar 20%.
Baca juga:

Benarkah Memakai Script Lazy Load Untuk Adsense Bisa Menurunkan Pendapatan Blog?

Beredar kabar bahwa setelah menerapkan metode ini maka income dari google adsense akan mengalami penurunan karena iklan adsense akan menjadi jarang tayang.

Tapi kalian bisa melakukan riset sendiri untuk membuktikannya, jika mengalami penurunan maka lebih baik jangan menggunakan lazy load adsense daripada earning kalian menjadi kurang maksimal.

Kamis, 05 Desember 2019

Pengertian Apa Itu SEO Beserta Jenis Dan Manfaatnya Bagi Website

Pengertian Apa Itu SEO Beserta Jenis Dan Manfaatnya Bagi Website. Mungkin sebagian besar para blogger masih belum mengenal apa itu seo dan juga manfaatnya bagi blog mereka. Jika belum, maka kalian wajib belajar untuk memahaminya, sebab teknik inilah yang dapat membantumu untuk mengembangkan website agar bisa berkembang maju.

Untuk penerapannya, SEO akan terus berkembang dan berubah-ubah seiring dengan perubahan cara kerja Search Engine. Jadi mengerjakan teknik SEO bisa dikatakan tidak akan ada habisnya karena akan selalu update setiap saat.

Namun ada beberapa hal yang pasti tidak akan berubah walaupun mesin pencarian mengalami pembaruan terus menerus, yaitu pemahaman dasar mengenai konsep SEO yang akan saya jelaskan di bawah ini.

Memahami Tentang Konsep Atau Strategi Penggunaan SEO

Pengertian Apa Itu SEO Beserta Jenis Dan Manfaatnya Bagi Website
Trafik website dari penerapan SEO | Pixabay PhotoMIX-Company

1. Arti SEO

SEO merupakan sebuah singkatan dari Search Engine Optimization yang artinya ialah sebuah teknik yang berupaya untuk menempatkan posisi website kita berada di halaman mesin pencari dengan peringkat teratas. Beberapa contoh mesin pencari yang sangat populer yang sering dipakai untuk searching adalah Google, Yahoo, Bing, DuckDuckGo dan Yandex.

Dengan menerapkan teknik SEO ini maka kita bisa mendapatkan jumlah trafik yang begitu besar serta mampu mendatangkan visitor yang lebih tertarget dan sangat berpotensial. Sehingga teknik SEO juga bisa sering dipakai untuk perusahaan untuk menjalankan bisnisnya guna menargetkan produk website agar bisa memperluas pemasaran.

2. Jenis-Jenis SEO

Ada 2 jenis teknik SEO yang dapat kita terapkan untuk website kita dalam mendongkrak trafik website. Yakni menggunakan SEO On Page ataupun SEO Off Page, apabila kedua metode ini dikombinasikan dengan semaksimal mungkin maka kita akan mendapatkan hasil yang lebih optimal.

2.1. SEO On Page
Teknik SEO On Page merupakan sebuah tindakan untuk mengoptimasi website melalui konten website itu sendiri agar bisa mendapatkan ranking di mesin pencari.

Ada beberapa faktor yang mempengaruhi nilai seo pada teknik yang satu ini, yaitu penggunaan keyword pada Judul artikel, permalink, kustomisasi struktur dan kecepatan website, serta kualitas dari konten website itu sendiri.

2.2. SEO Off Page
Berbeda dengan metode sebelumnya yang melakukan optimasi dari dalam website, teknik selanjutnya yakni SEO Off Page adalah tindakan untuk mengoptimasi website dari luar.

Salah satu contoh yang sangat berpengaruh dalam faktor ini adalah sebuah backlink (inbound link), yang merupakan sebuah url untuk menuju ke website kita. Semakin banyak backlink yang mengarah ke situs kita sebagai bahan rujukan maka hal itu bisa meningkatkan kredibilitas web.

Ada banyak cara untuk mendapatkan backlink, yaitu menggunakan sosial media untuk melakukan promosi, memanfaatkan sosial bookmarking, melakukan guest post ke situs lain yang memiliki nilai DA tinggi.

3. Manfaat Dari Menerapkan SEO

Menggunakan teknik SEO kini menjadi sebuah hal sangat disarankan untuk menunjang website kita, sebab melalui metode inilah banyak sekali keutungan yang akan kita dapatkan untuk website kita.

3.1. Menguasai Mesin Pencarian
Apabila hampir semua halaman situs kita berada di Search Engine dan mendapat posisi pertama, maka kemungkinan besar kita akan menguasai trafik tersebut karena sebagian pengunjung lebih memilih konten yang berada di urutan pertama.

3.2. Mendapatkan Banyak Trafik Organik
Masih berhubungan dengan teori pertama, menggunakan strategi pemasaran melalui teknik SEO maka kita akan mendapatkan keuntungan yang lebih besar dalam menarik para visitor organik untuk mengunjungi situs kita, sebab mereka dapat dengan mudah menemukan situs kita melalui mesin pencari yang mereka gunakan.

3.3. Meningkatkan Brand Awareness Dan Kredibilitas
Jika kita sudah menguasai mesin pencarian di halaman SERP dan juga mendapatkan banyak visitor, maka secara tidak langsung hal itu bisa membuat brand kita akan menjadi populer di kalangan pengguna internet sehingga sudah familiar di ingatan mereka.
Baca juga:

Dari point-point di atas kita dapat menyimpulkan bahwa penggunaan SEO sangatlah penting dalam membangun sebuah website, baik itu untuk website yang sudah berumur maupun yang baru. Sebab persaingan dalam merawat sebuah website itu adalah dipengaruhi oleh kualitas konten yang telah kita optimasi sendiri.

Senin, 02 Desember 2019

4 Cara Ampuh Mencegah Dan Solusi Mengatasi Blog Dari Plagiat Konten

Cara Ampuh Mencegah Dan Solusi Mengatasi Blog Dari Plagiat Konten. Dalam dunia blogging tentu saja kita pasti akan menjumpai yang namanya peniru konten blog alias plagiat. Nah plagiat ini ada beberapa jenis, ada yang baik dan ada juga yang buruk alias pecundang (kebacut), dan untuk lebih jelasnya silahkan kalian simak baik baik.

Sebelum itu saya akan membuat pernyataan terlebih dahulu. Mungkin jika ada pelaku kopas yang membaca postingan maka dia akan geram terhadap tulisan ini dan akan merusak blog saya melalui Jingling dan semacamnya, atau bahkan blogku di AGC lagi.

Tapi saya tidak peduli akan hal itu lantaran tujuan utama saya membuat postingan ini adalah agar kita dapat membangun blog yang sehat dan bersaing dengan positif sehingga budaya buruk di negeri tidak merajalela dan dapat tergantikan oleh sinar kebaikan. "Sungguh mulia niatmu ini wahai anak muda" ~ (Cikgu Papa Zola).

Perbedaan Blog Copas Dan AGC

Cara Mencegah Dan Mengatasi Blog Dari Copaser Dan AGC

Blog Copy Paste (Copas)

Jenis blog yang satu ini adalah konten yang mereka dapatkan dari hasil plagiat miliki blog orang lain, sehingga mereka hanya menyalin semua isi artikel dan hanya melakukan perubahan sedikit pada konten tersebut.

Selain itu blog copas yang paling menjengkelkan ialah blog yang tidak menyertakan sumber aslinya yang berupa link atau url yang telah dijadikan sebagai bahan rujukan. Bahkan tak jarang pula artikel yang mereka copas tidak diedit sama sekali sehingga disalin mentah mentah begitu saja.

Blog Auto Generate Content (AGC)

Sedikit berbeda dari blog yang sebelumnya, AGC merupakan singkatan dari Auto Generate Content yang bisa diartikan sebagai alat untuk membuat konten secara otomatis.

Blog AGC akan mengcopas semua isi artikel yang ada di dalam blog kalian secara utuh dalam waktu yang singkat, sehingga mereka hanya perlu mengupload script yang berisi feed artikel blog kita lalu hanya menambahkan kalimat pembuka dan penutup dalam blognya.

Ini merupakan sebuah teknik haram yang sering dipakai oleh para blogger pecundang (kebacut) yang tidak pernah merasakan kesuksesan di dunia blogging sehingga mereka melakukan teknik terlarang tersebut.

Pengaruh Terhadap Blog Kita Sebagai Korban Copaser Dan AGC

  • Jika blog kita telah menjadi korban dari para pelaku tukang kopas maka blog kita akan menerima imbas yang sangat buruk.
  • Terjadinya duplikat konten blog sehingga akan dianggap spam oleh mesin pencari (Google, Yahoo, Bing, Yandex, dll).
  • Menurunkan pengunjung blog akibat domain kita yang telah pakai kalah bersaing pada nilai DA dan PA yang dapat menentukan posisi hasil pencarian.
  • Menurunkan nilai kulitas blog pada mesin pencari, seperti DA, PA, Moz Trust dan Alexa rank.
  • Pendapatan dari iklan akan menurun seiring menurunnya trafik blog.

Kesimpulan
Dari penjelesan di atas kita dapat mempelajari suatu hal yaitu bahwa kerja keras kita selama ini dalam membangun blog dari nol yang diawali dengan tekad bulat, riset keyword dan optimasi blog sana sini semuanya kini terasa sia sia akibat kelakuan terkutuk tersebut.

Bahkan ada beberapa orang yang saya jumpai di di sebuah forum, mereka dengan Pedenya menjual blog hasil AGC dan mematok harga tinggi. Dalam hati gue berkata "Eh, ini orang apa setan ya kok jualan barang orang lain tanpa izin dari pemiliknya".

Tips Mencegah Blog Kita Agar Terhindar Dari Serangan AGC

Jika kalian pernah menjadi korban AGC hingga saat ini dan kamu merasa resah maka kamu harus melakukan teknik berikut ini agar terhindar dari serangan pada kang agece.

1. Mencantumkan Nama Blog Dalam Artikel

Teknik pertama yang dapat kalian coba ialah dengan mencantumkan nama blog kalian sendiri kedalam artikel blog kalian sehingga konten artikel tersebut telah menjadi ciri khas dari blogmu.

Contohnya ialah kalian dapat menggunakan nama blog ataupun sapaan untuk pengunjungmu, seperti halo berjumpa lagi di Zona Internetku, atau bisa juga dengan halo sobat Zonetku bagaimana kabarmu, dan masih banyak lagi kalimat unik yang dapat kalian pakai sebagai ciri khas.

2. Menambahkan Link Internal

Selanjutnya adalah dengan memasang link internal pada setiap postingan, sehingga nantinya kita akan mengetahui blog yang telah meng-generate artikel kita melalui backlink yang menuju ke blog kita. Sebab memasang Internal Link secara manual di blog akan menyatu dengan konten artikel kita dan ikut terkena AGC.

3. Menggunakan Watermark Pada Gambar

Menggunakan Watermark alias nama logo blog kita dalam setiap gambar dan foto yang kita posting di artikel adalah cara jitu untuk menghindari AGC, karena mereka biasanya hanya akan mencari mangsa pada blog yang tidak diberi watermark dan hak cipta undang undang. Jika mereka sudah mengetahui bahwa konten blog kita telah diamankan maka sebagian besar dari mereka akan mengurungkan niatnya.

4. Membatasi Jumlah Feed Blog

Fungsi dari Feed atau Umpan pada sebuah blog merupakan halaman khusus yang dibuat untuk pembaca setia blog tersebut agar dapat melihat semua isi artikel dari yang lama hingga terupdate.

Namun sayangnya fitur ini seringkali disalahgunakan oleh para orang yang tidak bertanggungjawab seperti Copaser untuk meng-generate semua feed blog kita. Untuk mengatasi masalah tersebut kita harus mengatur jumlah feed untuk dibatasi agar blog susah untuk di AGC.
Silahkan pergi menuju ke menu "Setelan > Lainnya > Feed Situs" lalu pilih opsi "Singkat".

Jika kalian ingin lebih aman lagi dan terlihat rapi halaman feed blogmu maka kamu harus mendaftarkan blogmu ke Google Feedburner yang tutorialnya sudah saya buat dalam artikel Cara Mendaftarkan Blog Ke Google Feedburner.

Solusi Mengatasi Blog Pelaku Copaser Dan AGC

Apabila kamu telah menjadi korban dari para AGC dan Copaser yang sangat merugikan sekali bagi blogmu maka kamu harus melakukan hal berikut ini untuk melakukan sepak terjang berikut ini sebagai serangan balik. Dengan begini mereka semoga saja bisa belajar untuk mencari jalan *ninja* negblog yang benar.

1. Melaporkan Ke DMCA

Ini bisa dibilang sebagai cara yang paling ampuh dalam memberantas blog AGC, yaitu dengan melaporkan blog AGC tersebut kepada DMCA yang telah menjadi pelindung bagi konten yang ber-hak cipta sehingga blog mereka akan takedown atau smackdown biar mampos sehingga blognya tidak bisa muncul lagi di SERP dan dibanned Adsense karena melanggar pedoman komunitas Google.

2. Melaporkan Kepada Pemilik Blog Lainnya

Jika cara pertama masih belum menimbulkan efek yang kurang greget maka kita dapat mencari daftar korban blog AGC tersebut dan menghubunginya untu diajak kerja sama dalam melakukan report secara massal. Dengan begitu blog agece tersebut pasti dapat dibumihanguskan dari peradaban blogger.

3. Jangan Membeli Blog Hasil AGC

Jika kita menjumpai orang yang jualan blog kalian harus mengeceknya terlebih dahulu, apakah hasil karya sendiri atau hasil colongan dari AGC. Jika blog tersebut dari hasil AGC lebih baik kalian meng-urungkan niatmu karena blog hasil AGC itu tidak barokah karena hasil dari mencuri karya orang lain (ilegal), selain itu dari segi SEO blog AGC lebih rendah karena sebagian besar kontennya akan dianggap spam sehingga tidak memiliki kualitas.
Baca juga:

Itulah beberapa tips yang dapat kalian lakukan untuk menghindari terjadinya AGC dan copaser dari para plagiat konten. Semoga dengan semakin ketatnya kualitas keamanan konten blog kita maka hal itu bisa membuat para plagiat menjadi sadar untuk tidak bermain curang lagi. "Mugo-mugo nang cepet tobat yo tole".

Senin, 18 November 2019

Cara Membuat Halaman Partner Blog Yang Keren Dan Responsive

Cara Membuat Halaman Partner Blog Yang Keren Dan Responsive. Pada saat kamu pergi mengunjungi blog orang lain pasti kamu sering menemukan menu navigasi yang menuju ke halaman partner pada blog, lalu apa itu partner? Partner Blog merupakan salah satu cara untuk melakukan kerja sama dengan para blogger lainnya.
Jadi pada halaman tersebut umumnya berisi link atau url blog yang telah menjalin hubungan kerja sama. Dari kerja sama ini kita bisa diuntungkan dari beberapa hal.

Keuntungan Memiliki Partner Blog

  • Mendongkrak tingkat popularitas blog kita.
  • Menaikkan nilai DA dan PA blog, sehingga membuat blog kita menjadi lebih mudah berada di posisi Page One pada mesin pencarian.
  • Menambah teman atau membangun komunitas untuk saling bersilahturahmi sesama blogger.


Cara Membuat Halaman Khusus Untuk Menampilkan Daftar Blog Partner Kita

1. Masuk ke dalam halaman dashboard blogger kalian.
2. Setelah itu masuk ke menu "Halaman/Page"dan buatlah halaman baru laluberi judul "Partner Blog".
3. Selanjutnya masuk ke mode "HTML" dan copas kode berikut ini

Syarat untuk menjadi partner kami adalah...
<ol id="daftar-partner">
<li class="kotak-partner"><h3 class="judul-partner">
Blog Kalian</h3>
<div class="deskripsi-partner">
<center>
Deskripsi blog kalian ada disini</center>
<a class="link-partner" href="https://www.google.com" rel="dofollow">www.google.com</a></div>
</li>
</ol>

<style>
#daftar-partner{margin:0;list-style:none;counter-reset:num;display:block;overflow:hidden}
#daftar-partner .kotak-partner{background:#FFF;width:calc(95% - 40px);border:3px solid #3bbd71;border-radius:10px;margin-bottom:35px;padding:5px 10px;position:relative;float:left;list-style:none;margin:0 0 15px;counter-increment:num}
#daftar-partner .kotak-partner:before{content:counter(num)!important;font-size:25px;line-height:26px;text-align:center;background:#3bbd71;color:white;border-radius:0 10px 0 10px;font-weight:bold;font-style:italic;display:block;position:absolute;top:-1px;width:30px;height:30px;right:-1px}
#daftar-partner .kotak-partner:nth-child(even){background:#FFF;width:calc(95% - 40px);border:3px solid #3bbd71;border-radius:10px;margin-bottom:35px;padding:5px 10px;position:relative;float:right;list-style:none;margin:0 0 15px;counter-increment:num}
#daftar-partner .kotak-partner:nth-child(even):before{border-radius:10px 0 10px 0;top:-1px;left:-1px}
#daftar-partner .kotak-partner .judul-partner{text-align:center}
#daftar-partner .kotak-partner .deskripsi-partner{font-size:16px;margin: 0px 0px 20px 0;}
#daftar-partner .kotak-partner .link-partner{position:absolute;right:-1px;bottom:0;background:#3bbd71;color:#FFF;padding:0 10px;border-radius:5px 0 0 0;font-size:14px}
#daftar-partner .kotak-partner:nth-child(even) .link-partner{left:-1px;right:unset;border-radius:0 5px 0 0}
</style>

Cara Membuat Halaman Partner Blog Yang Keren Dan Responsive
  • Silahkan kalian ganti tulisan warna merah dengan Nama Blog Partner kalian.
  • Warna hijau untuk Deskripsi Blog Partner.
  • Warna biru untuk Link Blog Partner.

4. Setelah itu silahkan kalian klik tombol "Publish/Publikasikan".
Cara Membuat Halaman Partner Blog Yang Keren Dan Responsive 2
Perhatian: jika tampilannya berantakan maka hal itu sangat wajar, karena kita menggunakan jenis template blog yang berbeda, jadi kalian harus mengubah pengaturan kode CSS-nya dengan sendiri.

5. Langkah selanjutnya yaitu kamu harus memasang link halaman partner ke dalam menu navigasi blogmu, agar para pengunjung blogmu dapat melihat daftar partner kalian.
Kamu bisa memasangnya di menu navigasi seperti header, sidebar ataupun pada bagian footer blog.

Cara Menambah Partner Baru

Jika kalian ingin menambah daftar partner baru, maka kalian hanya perlu copas kode <li> sampai </li> lalu letakkan kode tersebut di bawah kode </li> seperti berikut.
<ol id="daftar-partner">
<li class="kotak-partner"><h3 class="judul-partner">
Blog Kalian</h3>
<div class="deskripsi-partner">
<center>
Deskripsi blog kalian ada disini</center>
<a class="link-partner" href="https://www.google.com" rel="dofollow">www.google.com</a></div>
</li>
<li class="kotak-partner"><h3 class="judul-partner">
Blog Kalian 2</h3>
<div class="deskripsi-partner">
<center>
Deskripsi blog kalian ada disini 2</center>
<a class="link-partner" href="https://www.google.com" rel="dofollow">www.google.com</a></div>
</li>
</ol>

Baca juga:

Itulah tutorial singkat untuk  Cara Membuat Halaman Partner Blog Yang Keren Dan Responsive yang bisa saya tunjukkan kepada kalian semua. Semoga bermanfaat.