Tutorial Setting Viomagz Premium Terbaru V.4.6.0

 Viomagz Terbaru Buatan Mas sugeng Merupakan Template Perpaduan antara Linkmagz, Cara Setting Template ini Juga Hampir sama Persis Dengan Template Linkmagz, Berikut Panduan Setting Viomagz v4.6.0 Terbaru.

Pemasangan template Viomagz Premium Terbaru V.4.6.0

Terdapat dua Metode dalam Pemasangan Template ini.

Metode Manual

Metode Manual disarankan bagi sobat yang mengganti template yang sebelumnya tidak menggunakan Viomagz premium, caranya sebagai berikut:

  • Buka File Viomagz yang berbentuk .zip menggunakan Aplikasi Winrar. maka di dalamnya akan terdapat dile yang berextensi .xml. extract/ keluarkan dile tersebut. buka file yang sudah di extract dengan menggunakan notepad/notepad++ kemudian Copy semua kode yang ada di dalamnya.
  • login ke blogger dan pilih blog yang mau sobat ganti templatenya. Pilih Menu TEMA kemudian Klik Icon yang bertanda TITIK TIGA. Pilih Menu edit HTML.
  • Hapus Semua Kode yang ada di dalamnya. Kemudian Ganti dengan kode yang sudah Sobat Copy sebelumnya dari Notepad.
  • Simpan Template, selesai.

Metode Pulihkan

Metode ini tidak disarankan bagi sobat yang sebelumnya tidak menggunakan Template Premium Viomagz, dikarenakan Jika Menggunakan Metode ini Template akan Tidak sesuai dengan keinginan Sobat seperti Widget dll. fitur bawaan default Blogger masih terbawa nantinya.

Jika sobat ingin menggunakan Metode ini caranya sebagai Berikut.

  • unrar/extract file yang viomagz Premium
  • Login ke Blogger
  • Pilih Menu Tema
  • klik icon yang bertanda titik tiga
  • Pilih Opsi Pulihkan
  • Upload template sobat
  • Selesai

Cara Menambah menu Navigasi Template Viomagz V.4.6.0

Masuk ke menu “Tata Letak” > edit widget “Kode Menu Navigasi” > setelah itu masukan kode ini di bagian konten widget:

<li><a href=”#“>MENU</a></li>

Ganti yang bertanda merah dengan URL tujuan, misalnya jika ingin menunya mengarah ke halaman label, maka isi dengan URL label.

Yang bertanda hijau juga diganti sesuai dengan keinginan.

Jika ingin menambahkan menu lagi, cukup salin kodenya dan letakan tepat di bawahnya.

Cara Menambahkan Submenu Pada Viomagz V4.6.0

Untuk menambahkan menu disertai dengan submenu, gunakan kode ini:

<li class=”has-sub”><a href=”#“>Menu Utama</a>
  <ul>
    <li><a href=”#“>Submenu Satu</a></li>
    <li><a href=”#“>Submenu Dua</a></li>
    <li><a href=”#“>Submenu Tiga</a></li>
  </ul>
</li>

Letakan kode tersebut tepat di bawah kode menu yang sebelumnya.

Ganti yang bertanda merah dengan URL tujuan, dan yang berwana hijau diganti dengan nama menu sesuai kebutuhan.

Menampilkan Menu Halaman Statis (Footer)

Masuk ke “Tata Letak” > edit widget “Menu Halaman Statis” > centang halaman-halaman yang ingin ditampilkan di menu > klik “Simpan

Menambah Icon Media Sosial

Masuk ke “Tata Letak” > edit widget “icon media sosial” > masukkan kode ini di bagian konten widget:

<a aria-label="facebook-icon" href="#"><span class="social-icon facebook-icon"><i></i></span></a>

Edit yang bertanda hijau dengan nama icon media sosial yang digunakan dan yang bertanda merah dengan URL akun media sosial milik sobat.

Jika ingin memasang icon media social lebih dari satu, cukup salin kode tersebut dan ubah bagian nama icon media sosialnya.

Berikut beberapa nama icon media sosial yang tersedia di template VioMagz:

  • facebook-icon
  • youtube-icon
  • twitter-icon
  • instagram-icon
  • linkedin-icon
  • telegram-icon
  • whatsapp-icon
  • googlemaps-icon
  • pinterest-icon
  • tiktok-icon
  • github-icon
  • dribbble-icon
  • behance-icon

Note:

Nama icon harus ditulis huruf kecil semua.

Mengedit Kode Pengaturan Template

Beberapa fitur pada template dapat diatur melalui widget “Kode Pengaturan Template” yang tersedia di tata letak.

Untuk mengeditnya silakan masuk ke menu “Tata Letak” > edit widget “Kode Pengaturan template“.

Setelah itu sobat masukkan kode ini di bagian konten widget:

<script>
var vioMagzSetting = {
relatedPosts: true,
jumlahRelatedPosts: 4,
relatedPostsThumb: true,
numberedPageNav: true,
perPage: 8,
bacaJuga: true,
jumlahBacaJuga: 3,
judulBacaJuga: "Baca Juga",
};
</script>

Berikut penjelasan dari kode tersebut:

  • relatedPosts
    Isi true untuk mengaktifkan fitur related posts, atau isi false untuk menonaktifkannya.
  • jumlahRelatedPosts
    Jumlah postingan yang muncul di related posts di bawah postingan, edit sesuai selera.
  • relatedPostsThumb
    Isi true untuk menampilkan related posts dengan thumbnail, atau isi false untuk menampilkan related posts tanpa thumbnail.
  • numberedPageNav
    Isi true untuk mengaktifkan fitur navigasi halaman bernomor. atau isi false untuk untuk menonaktifkannya.
  • perPage
    Samakan angkanya dengan setelan jumlah postingan yang dimunculkan di homepage
  • bacaJuga
    Isi true untuk mengaktifkan fitur related posts di tengah postingan, atau isi false untuk menonaktifkannya.
  • jumlahBacaJuga
    Jumlah postingan yang muncul di related posts di tengah postingan, edit sesuai selera.
  • judulBacaJuga
    Judul related posts di tengah postingan, edit sesuai selera.

Mengganti Judul Blog dengan Logo

Pertama, pastikan sudah membuat gambar logonya. Ukuran logo bebas, berapa saja bisa.

Kedua, masuk ke “Tata Letak” > edit widget “Header” > Upload gambar > di bagian “Penempatan” pilih “Selain judul dan keterangan” > Simpan.

Mengedit Tulisan di Footer

Masuk ke “Tata Letak” > edit widget “Teks Footer” > di bagian konten widget masukkan tulisan apa saja yang ingin dimunculkan di footer > simpan.

Mengganti Favicon

Masuk ke menu “Setelan” > “Dasar” > “Favicon” > Upload favicon milik sobat.

Note:

  • Pastikan gambar favicon persegi dan ukurannya tidak lebih dari 100KB.
  • Jika Favicon tidak berubah di browser, clear cache browser dulu setelah itu cek lagi
  • Jika Favicon tidak berubah di Google, harap bersabar, butuh waktu tidak bisa otomatis berubah.

Menampilkan/Menyembunyikan Label, Tanggal, Komentar, Dll.

Masuk ke “Tata Letak” > edit widget “Postingan Blog” > centang yang ingin ditampilkan, hilangkan centang yang tidak ingin ditampilan > Simpan.

Mengaktifkan LazyLoad pada Iklan AdSense

Di template VioMagz versi 4.6.0 ke atas sobat bisa mengaktifkan fitur LazyLoad pada iklan AdSense.

Cara mengaktifkannya cukup mudah, sobat hanya perlu mengedit sedikit kode iklan AdSense yang terpasang di blog.

Pada setiap kode iklan AdSense umumnya terdapat kode seperti ini di bagian atas:

<script async src='https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'></script>

Nah sobat hanya perlu mengedit kode tersebut menjadi seperti ini :

<script>Defer.js('https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js', 'adsense', 2000);</script>

Untuk Iklan Auto Ads

Fitur LazyLoad ini juga bisa diterapkan pada iklan auto ads.

Caranya cukup ubah kode iklan auto ads-nya menjadi seperti ini:

<script>Defer.js('https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1234567890xxxxxx', 'adsense', 2000);</script>

Letakkan kode tersebut di atas kode </head> atau bisa juga di widget “Custom JavaScript Footer

Note:

  • Ganti 1234567890xxxxxx dengan ID akun AdSense sobat
  • Jangan letakkan kodenya di bawah kode <head>. Jika diletakkan di situ, fitur lazyload tidak bisa berfungsi.

Demikian Cara Setting Viomagz Premium Terbaru V.4.6.0 Semoga Bermanfaat

Related Posts

2 thoughts on “Tutorial Setting Viomagz Premium Terbaru V.4.6.0

Leave a Reply

Your email address will not be published. Required fields are marked *