Cabe Pedas, Template Blogger Versi Baru SEO Responsive Mobile Friendly

 DOKUMENTASI TEMPLATE CABE PEDAS

Cabe Pedas, Template Blogger Versi Baru SEO Responsive Mobile Friendly, assalamualaikum warahmatullah wabarakatuh Pada kesempatan kali ini saya akan berbagi seputar tema blog ataupun template blogger yang bernama cabe pedas yang di mana tampek ini memiliki layout seperti pada kampret kampret premium dengan dua kolom yaitu sibar maupun kolom postingan atau artikel dan untuk warna default-nya yaitu warna biru dan untuk halaman index merupakan bentuk Grid.

Yang di mana tempat ini disesuaikan dengan kebutuhan pengguna ponsel ataupun Android ataupun Smartphone untuk berinteraksi dengan dunia maya atau internet yang setiap harinya terus naik sangat signifikan dan untuk fiturnya merupakan fitur seperti pada tanpa premium dengan berbagai menu yang sudah disediakan dan untuk font icon sendiri menggunakan svg bukan fontawesome tentu saja akan menambah kecepatan dari template anda.

Kemudian untuk pengujian di gtmetrix atau yslow bahkan di Google page speed Hasilnya sangat memuaskan jadi untuk menghasilkan yang memuaskan perhatikan beberapa parameter bisa anda atur seperti yang akan saya bahas di bawah.

 Berikut adalah beberapa fitur yang ada pada template blogger cabe pedas.

- Sangat responsif

- Loading cepat di halaman posting maupun halaman index

- Data tekstur sangat baik

- Stycky sidebar

- Breadcrums index

- Lazy load gambar dan video

- 2 iklan di dalam postingan

- Related post

- Media sosial berbagi

- Komentar bawaan dan komentar disqus

 Dan berikut adalah dokumentasi yang bisa anda lakukan untuk mengedit template cabe pedas tersebut

1. Meta Tag SEO

* Meta Keyword Tinggal disesuaikan

<meta content='Kata Kunci 1, Kata Kunci 2, Kata Kunci 3, Kata Kunci 4' name='keywords'/>

* Meta Search Engine Tinggal disesuaikan

<meta content='xxxx' name='facebook-domain-verification'/>
<meta content='xxxx' name='google-site-verification'/>
<meta content='xxxx' name='alexaVerifyID'/>
<meta content='xxxx' name='p:domain_verify'/>
<meta content='xxxx' name='yandex-verification'/>
<meta content='xxxx' name='msvalidate.01'/> 

* Meta Sosial Media Tinggal disesuaikan

 <meta content='https://www.facebook.com/xxxx' property='article:author'/>
 <meta content='https://www.facebook.com/xxxx' property='article:publisher'/>
 <meta content='xxxx' property='fb:app_id'/>
 <meta content='xxxx' property='fb:admins'/>
 <meta content='xxxx' property='fb:profile_id'/>
 <meta content='xxxx' property='fb:pages'/>
 <meta content='@xxxx' name='twitter:creator'/>

 Catatan: xxxx ganti dengan parameter yang dibutuhkan

2. Mengubah warna Link warna kolom berlangganan warna tombol warna label dan warna header

 Silahkan kalian cari dengan kode warna yang ada dalam template 75539e silakan Anda ganti dengan warna yang anda sukai Anda bisa menggunakan alat gratis HTML Color Picker kemudian pada bagian header template ini menggunakan gradien dan untuk mengubahnya silakan lakukan secara manual pada kode #header

 3. Lazy load untuk gambar dan video

Untuk mempercepat gambar maupun video dan untuk lazy load video YouTube bisa baca DISINI Kemudian untuk memperCepat gambar atau lazy img Silakan anda perhatikan kode yang ada di bawah ini

 - Gambar sebelum di lazy load

 <img border="0" data-original-height="350" data-original-width="500" height="250" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjX0ccdqO5sq39rhfcG0_fS2d7f6g9lyj2K3JlN-XueTX4SP9oE8HhHhk4QSn7HshUXsq-L8ETjnB9aRBXtmbG4ynleA6nG1nb1M1mn_t-ZasFWMvYE_-VLObrAMPKAJ1b_BYKsAYk2YnM/s400/vegetables-1584999_500-min.jpg" width="400" />

 - Gambar setelah di lazy load

 <img border="0" data-original-height="350" data-original-width="500" height="250" data-src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjX0ccdqO5sq39rhfcG0_fS2d7f6g9lyj2K3JlN-XueTX4SP9oE8HhHhk4QSn7HshUXsq-L8ETjnB9aRBXtmbG4ynleA6nG1nb1M1mn_t-ZasFWMvYE_-VLObrAMPKAJ1b_BYKsAYk2YnM/s400/vegetables-1584999_500-min.jpg" width="400" src='data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAMAAAAoyzS7AAAAA1BMVEXz8/SVuXQoAAAACklEQVQI12NgAAAAAgAB4iG8MwAAAABJRU5ErkJggg==' />

4. Mengatur komentar

 - Untuk mengatur komentar disqus langkah pertama silakan Anda cari "disqusmu" untuk mempercepat pencarian gunakan tombol CTRL+F Lalu setelah ketemu ganti disqusmu dengan milik shortname disqus kalian, lalu pada menu setelan > Postingan, komentar dan berbagi > lokasi komentar lalu pilih sembunyikan (opsional)

 - Merubah komentar DISQUS ke komentar bawaan blogger

 Edit tema cari kode ini:

 <b:include data="post" name="disqus-comments"/>

 Lalu ganti dengan kode ini;

 <b:include data="post" name="comments"/>

5. Mengubah Email berlangganan

 Cari kode uri=CabePedas lalu silakan Anda ganti dengan feedburner milik kalian

 

6. Mengatur Iklan

 Edit tema cari kode <!--pasang kode iklan disini--> kira-kira nanti dibawahnya akan terlihat kode seperti ini, dan Silahkan ganti dengan kode iklan milik kalian

 <div class='testad' style='width:100%;height:200px;background:#eee'/>

 

Jika kode iklan yang kalian miliki terbilang baru untuk menghindari error pada iklan tersebut silakan ubah kode async jadi async='' ataupun async='async' untuk parse iklan bisa gunakan alat PARSE HTML

 

7. Gambar di atas judul artikel/postingan 

 

Dan untuk memindahkan gambar di atas judul artikel atau postingan silakan Anda edit pada menu edit HTML lalu tambahkan kode kira-kira seperti dibawah ini 

 

<a id="desc" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggMTCcwKtHLJO2wT0pNOlQlzfv88g3Mo4r0Z4Qcn0kwo_0aOHmOeRR1SqU7yhAUMsRfCRElZJVrcc6wPkX-SoSScBeRktJvF8wkb3h7YAiiF0fubgSf-mfzi772hOLwjAjc7pDmPq-5Bw/s1600/food-1239423_500-min.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" data-original-height="348" data-original-width="640" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggMTCcwKtHLJO2wT0pNOlQlzfv88g3Mo4r0Z4Qcn0kwo_0aOHmOeRR1SqU7yhAUMsRfCRElZJVrcc6wPkX-SoSScBeRktJvF8wkb3h7YAiiF0fubgSf-mfzi772hOLwjAjc7pDmPq-5Bw/s1600/food-1239423_640-min.jpg" /></a> 

 

Pilih salah satu gambar yang ingin dinaikkan ke atas judul artikel dengan menambahkan kode id="desc" 

 

8. Mengatur tampilan mobile 

 

Pilih TEMA> TEMA SAYA > SETELAN SELULAR > Ingin menampilkan tema Desktop atau Seluler di perangkat seluler? > pilih DESKTOP 

 

9. Mengubah nomor WhatsApp 

 

TEMA > EDIT HTML > ctrl+f cari kode NO-WAMU dan silakan ganti dengan nomor whatsApp milik kalian

 

10. Untuk tema cabe pedasnya download DISINI 

 

Hanya itu saja dulu Apa yang bisa saya sampaikan pada kesempatan kali ini tentang template blogger gratis dan template blogger premium yang dimana tempat ini sangat seo responsif dan sangat user friendly semoga bermanfaat dan terima kasih banyak