Lompat ke konten Lompat ke sidebar Lompat ke footer
Beranda / Blogger

Cara Setting Dan Mengatasi Error Template Viomagz Amp



Cara Setting Template VioMagz AMP semoga Valid AMP 100%


Halo sahabat blogger kali ini aku akan membagikan tutorial untuk setting template VioMagz dan mengatasi error AMP semoga Valid,seperti yang anda tahu bahwa Google semakin gencar mempromosikan penggunaan Accelerated Mobile Page dan mengutamakan indexing bagi situs dengan tampilan mobile yang mempunyai wakti pemuatan (loading) cepat.

Alhasil para pengguna Blogger semakin banyak yang pindah ke AMP,dan dari fenomena tersebut Mas Sugeng menunjukkan kejutan dengan merilis VioMagz AMP. Namun sejauh ini belum ada support secara eksklusif untuk VioMagz versi AMP tersebut alasannya ialah Mas Sugeng merilisnya secara gratis sebagai hadiah bagi para pelanggannya.

Oleh alasannya ialah itu disini aku akan membagikan cara setting Template Blogger VioMagz AMP dan cara mengatasinya semoga Valid AMP dengan benar. Berikut ini tutorialnya.

a. Cara Memasang Template VioMagz

1. Back Up Template

Sebelum anda mengganti tema ada baiknya untuk mencadangkan template yang sedang anda gunakan ketika ini,caranya cukup gampang :


  1. Buka Blogger.com
  2. Sign In dengan Akun Google anda
  3. Masuk ke Dashboard Blogger
  4. Pilih sajian Tema
  5. Klik Backup / Pilihan
  6. Lalu pilih Download Tema


Hal ini untuk mengatasi apabila nantinya anda merasa tidak cocok dengan tampilan yang gres sehingga dapat lebih cepat dan gampang kembali ke tampilan yang sebelumnya tanpa mengatur ulang.

2. Memasang Template

Untuk memasang template blogger kau dapat melaksanakan dengan gampang menyerupai biasanya dengan mengupload file .XML melalui sajian Tema di Dashboard Blogger, namun ada baiknya untuk membuka File .XML template melalui notepad kemudian copy-paste semua scriptnya ke kolom HTML Tema di blogger. Hal ini alasannya ialah biasanya ketika mengunggah file .XML secara eksklusif biasanya ada sisa-sisa dari Tema Blog yang sebelumnya.

b. Cara Edit Menu Navigasi di VioMagz AMP

Bila biasanya kita hanya perlu mengatur satu sajian navigasi dalam VioMagz,maka berbeda dengan versi AMPnya,karena kita perlu mengedit 2 sajian navigasi. Yaitu versi desktop dan versi mobile. Berikut ini tutorialnya :

1. Mengatur Menu Navigasi VioMagz AMP versi Desktop


  • Buka Blogger.com
  • Sign In dengan Akun Anda
  • Masuk ke Dashboard Blogger
  • Pilih sajian Tema
  • Lalu cari arahan berikut ini :
<!-- sajian navigasi header start -->
<ul>
  <li><a href='Link-Tujuan'>Menu</a></li>
  <li><a href='Link-Tujuan'>Menu</a></li>
  <li><a href='Link-Tujuan'>Menu</a></li>
  <li><a href='Link-Tujuan'>Menu</a>
  <ul>
<li><a href='Link-Tujuan'>SubMenu1</a></li>
<li><a href='Link-Tujuan'>SubMenu2</a></li>
<li><a href='Link-Tujuan'>SubMenu3</a></li>
  </ul>
  </li>
  <li><a href='Link-Tujuan'>Menu</a>
  <ul>
<li><a href='Link-Tujuan'>SubMenu1</a></li>
<li><a href='Link-Tujuan'>SubMenu2</a></li>
<li><a href='Link-Tujuan'>SubMenu3</a></li>
<li><a href='Link-Tujuan'>SubMenu4</a></li>
  </ul>
  </li>
</ul>
<!-- sajian navigasi header end -->

  • Ganti pada tulisan Link-Tujuan yang sudah aku tandai dengan Bold di arahan diatas dengan URL dari halaman/post yang akan kalian pasang di Menu atau SubMenu

2. Menambah dan Mengurangi Menu Navigasi VioMagz AMP versi Desktop

Anda juga dapat menambah maupun mengurangi jumlah sajian ataupun submenu di Navigasi VioMagz AMP versi Desktop,berikut ini caranya :

  • Menambah dan Mengurangi Menu

Tambahkan arahan berikut untuk Menambah Menu atau Hapus arahan berikut untuk Menghapus Menu
<li><a href='Link-Tujuan'>Menu</a></li>

  • Menambah dan Mengurangi SubMenu

Tambahkan arahan berikut untuk Menambah Menu atau Hapus arahan berikut untuk Menghapus SubMenu
<li><a href='Link-Tujuan'>Menu</a>
  <ul>
<li><a href='Link-Tujuan'>SubMenu1</a></li>
<li><a href='Link-Tujuan'>SubMenu2</a></li>
<li><a href='Link-Tujuan'>SubMenu3</a></li>
<li><a href='Link-Tujuan'>SubMenu4</a></li>
  </ul>
  </li>

3. Mengatur Menu Navigasi VioMagz AMP versi Mobile

Nah yang ketiga ialah cara mengatur sajian yang tampil dari samping ketika blog diakses memakai perangkat mobile. Berikut ini caranya :

  • Cari arahan berikut :

<!-- sajian navigasi halaman AMP start -->
<ul class='sidebar'>
  <li><a href='Link-Tujuan'>Menu</a></li>
  <li><a href='Link-Tujuan'>Menu</a></li>
  <li><a href='Link-Tujuan'>Menu</a></li>
  <li><a href='Link-Tujuan'>Menu</a>
</ul>
<!-- sajian navigasi halaman AMP end -->

  • Ganti Link-Tujuan dengan URL halaman yang ingin di tampilkan lewat sajian dan ganti goresan pena Menu dengan Judul/Nama Menu yang ingin di tampilkan.

4. Mengatur Menu Navigasi di Atas Footer

Cari arahan berikut :
<!-- sajian navigasi footer start -->
<ul>
  <li><a href='Link-Tujuan'>About</a></li>
  <li><a href='Link-Tujuan'>Contact</a></li>
  <li><a href='Link-Tujuan'>Privacy Policy</a></li>
  <li><a href='Link-Tujuan'>Disclaimer</a></li>
</ul>
<!-- sajian navigasi footer end -->
Silahkan anda ganti arahan yang aku tandai dengan Bold menyerupai pada tutorial sebelumnya,mulai dari Link Tujuan dan nama-nama Menu.

c. Cara Memasang Header dan Favicon

Berikut ini cara memasang Header dan Favicon VioMagz AMP

1. Memasang Header untuk VioMagz AMP versi Desktop


  • Buka Blogger.com
  • Sign In dengan Akun Anda
  • Masuk ke Dashboard Blogger
  • Pilih sajian Tata Letak
  • Lalu klik Header
  • Setelah itu Upload file gambar yang ingin kalian gunakan sebagai header blog

Namun gambar hanya akan tampil jikalau blog diakses melalui Desktop,agar dapat tampil pada versi mobile anda harus memakai satu kode. Anda dapat mengikuti tutorial di bawah ini.

2. Memasang Header untuk VioMagz AMP versi Mobile


  • Buka Blogger.com
  • Sign In dengan Akun Anda
  • Masuk ke Dashboard Blogger
  • Pilih sajian Tema
  • Klik Edit HTML
  • Cari dan Hapus arahan berikut
<p class='title alt-blog-logo'><b:include name='title'/></p>

  • Ganti dengan arahan berikut : 
<amp-img expr:alt='data:title' height='28' width='159' layout='fixed' src='Link-Gambar-Logo-Header-Blog'>
</amp-img>

  • Anda sesuaikan height/tinggi dan width/lebar yang diatas dengan ukuran gambar,namun tingginya maksimal hanya 28px sedangkan untuk lebar dapat anda sesuaikan.
  • Ganti juga Link-Gambar-Logo-Header-Blog dengan URL dari gambar yang akan dijadikan Header
  • Bila sudah silahkan klik Simpan Tema

3. Cara Memasang Favicon


  • Buka Blogger.com
  • Sign In dengan Akun Anda
  • Masuk ke Dashboard Blogger
  • Pilih sajian Tata Letak
  • Kllik Favicon
  • Lalu Upload file Favicon.ico yang sudah anda buat

d. Cara Memasang Komentar di VioMagz AMP

Nah alasannya ialah di AMP tidak dapat memakai sistem komentar versi blogger,maka kolom komentar hanya muncul jikalau blog diakses melalui Desktop. Untuk menampilkan kolom komentar mobile anda membutuhkan santunan pihak ke-3 menyerupai sistem komentar Facebook atau Disqus.

e. Cara Membuat Postingan yang Valid AMP Blogger


Untuk tutorial mengedit postingan semoga valid AMP anda dapat membacanya di artikel berikut ini => Cara Menulis Artikel Valid AMP di Blogger

f. Cara Mengatasi Error Javascript Not Allowed di VioMagz AMP

Untuk error ini anda cukup mematikan NavBar melalui tata letak.


  • Buka Blogger.com
  • Sign In dengan Akun Anda
  • Masuk ke Dashboard Blogger
  • Pilih sajian Tata Letak
  • Klik NavBar
  • Lalu pilih Off



g. Mengatasi Error Attribute:'xmlns'

Berikutnya adalag Errot Attribute:'xmlns' ,biasanya ini muncul sehabis anda menambah,mengurangi atau mengubah widget. Cara mengatasinya cukup mudah,anda cari arahan berikut :

<html b:css='false' b:responsive='true' b:version='2' class='v2' expr:dir='data:blog.languageDirection' lang='id' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

Lalu ganti dengan arahan berikut :

<html b:css='false' b:responsive='true' b:version='2' class='v2' expr:dir='data:blog.languageDirection' lang='id'>

Penutup 

Itulah Cara Setting Template VioMagz AMP,anda dapat mendapat template tersebut secara gratis jikalau anda membeli VioMagz ke Mas Sugeng secara langsung. Cukup sekian tutorialnya,selamat mencoba.
Sumber https://www.dirga.id/