Skip to main content

Recent Disqus

Click Here On Load Disqus

Panduan Setting Template Viomagz Lengkap Versi Terbaru

Panduan Setting Template Viomagz Lengkap Versi Terbaru
Konten [Tampil]
Panduan Setting Template Viomagz Lengkap Versi Terbaru

www.azid45.web.idPanduan Setting Template Viomagz Lengkap Versi Terbaru. Assalamualaikum.wr.wb, pada kesempatan kali ini saya akan share panduan setting template viomagz milik mas sugeng. Sebenarnya mas sugeng sudah membuat panduan terkait setting template viomagz buatannya di www.sugeng.id, namun saya disini sebenarnya mendokumentasikannya untuk kepentingan pribadi saya agar tidak sulit lagi mencari di search engine terkait setting template viomagz.

Siapa yang gak tahu tentang mas sugeng blog terkenal sejak tahun 2000-an yang lalu, selain mas Adhy Suryadi mas sugeng juga merupakan blogger profesional dimana templatenya juga sangat fast loading dan dapat meningkatkan visitor blog. Mengapa demikian? tentunya blog mereka berdua sangat seo frendly, responsive, mobile frendly, support adsense, structur data blog yang cepat diindeks oleh google dan lain sebagainya. Selain template Viomagz, mas sugeng sebelumnya juga sudah membuat beberapa template seperti Evomagz yang juga fast loading. Viomagz sendiri menurut mas sugeng merupakan modifikasi dari template Evomagz, dan untuk yang suka blog AMP jangan khawatir karena mas sugeng juga sudah membuat template Viomagz AMP dengan harga yang lebih murah jika kalian sudah membeli template Viomagz versi non-AMP.

Ok. Mungkin sudah menunggu panduan settingg template Viomagz dapat dilihat dibawah ini;

Memasang Template


Berikut langkah-langkahnya:

Pertama, pastikan kalian sudah meng-unzip file template yang didownload. Di dalam file .zip terdapat file berekstensi .xml, nah file tersebut yang akan diupload atau pasang ke blog.

Kedua, untuk menghindari hal yang tidak diinginkan saya merekomendasikan untuk melakukan backup template yang akan diganti.
Caranya:
Login ke “Blogger” > Masuk ke menu “Tema”
Klik “Backup / Pulihkan”
Klik “Download tema”

Ketiga, Selanjutnya kalian tinggal mengupload file template ke blog.
Caranya:
Login ke “Blogger” > Masuk ke menu “Tema”
Klik “Backup / Pulihkan”
Klik “Choose File”
Pilih file template di Komputer > Klik “Upload”


Langkah Terakhir, Save Template.

Keterangan: agar template tidak berantakan nantinya, kalian bisa open with template dalam bentuk xml terlebih dahulu dan langsung pastekan ke blog kalian (di temrplate - edit HTML) dan save template. Cara tersebut ini direkomendasikan oleh kang Adhy Suryadi. Namun kelemahan pada cara ini, widget yang ada ditemplate kalian akan hilang, untuk itu bisa script dari widget dan kode lain yang dirasa penting di copy pastekan dahulu ke notepad.

Mengedit Menu Navigasi


Pada template VioMagz buatan mas sugeng ini terdapat dua menu navigasi, yaitu pertama terletak disebalh menu header dan yang kedua terletak diatas footer.

Untuk mengedit kedua menu navigasi kalian harus mengeditnya melalui menu Edit HTML.

Login ke “Blogger” > Masuk ke menu “Tema” > Klik “Edit HTML”.

Menu Navigasi Pertama (Sebelah Kanan Header)

Cari kode ini di dalam kode template:

<!-- menu navigasi header start -->
<ul>
  <li><a href='#'>Menu</a></li>
  <li><a href='#'>Menu</a></li>
  <li><a href='#'>Menu</a></li>
  <li><a href='#'>Menu</a>
  <ul>
 <li><a href='#'>SubMenu1</a></li>
 <li><a href='#'>SubMenu2</a></li>
 <li><a href='#'>SubMenu3</a></li>
  </ul>
  </li>
  <li><a href='#'>Menu</a>
  <ul>
 <li><a href='#'>SubMenu1</a></li>
 <li><a href='#'>SubMenu2</a></li>
 <li><a href='#'>SubMenu3</a></li>
 <li><a href='#'>SubMenu4</a></li>
  </ul>
  </li>
</ul>
<!-- menu navigasi header end -->

Edit text dengan tanda # dengan URL tujuan dan tulisan Menu/ SubMenu dengan nama menu yang diinginkan.

Menu Navigasi Kedua (Di Atas Footer)

Cari kode ini di dalam kode template:

<!-- menu navigasi footer start -->
<ul>
  <li><a href='#'>About</a></li>
  <li><a href='#'>Contact</a></li>
  <li><a href='#'>Privacy Policy</a></li>
  <li><a href='#'>Disclaimer</a></li>
</ul>
<!-- menu navigasi footer end -->

Edit text dengan tanda # dengan URL tujuan dan tulisan Menu/ SubMenu dengan nama menu yang diinginkan.

Kemudian Save Template Kalian.

Menghapus Menu Navigasi


Untuk menghapus salah satu menu cukup hapus dari kode <li> sampai </li>. Misalnya ingin menghapus menu “SubMenu4” maka hapus kode :
<li><a href='#'>SubMenu4</a></li>

Menambah menu Navigasi


Untuk menambahkan menu, copy kode ini:

<li><a href='#'>NamaMenu</a></li>
Paste kode tersebut di atas kode :

</ul>
<!-- menu navigasi header end -->
Jangan lupa sesuaikan URL tujuan menu dan Nama menunya.

Jika sudah diedit semua, save template.

Menambah Menu dengan SubMenu Navigasi


Untuk menambahkan menu dengan submenu, copy kode ini :

<li><a href='#'>NamaMenu</a>
  <ul>
 <li><a href='#'>NamaSubMenu1</a></li>
 <li><a href='#'>NamaSubMenu2</a></li>
  </ul>
</li>

Paste kode tersebut di atas kode :

</ul>
<!-- menu navigasi header end -->

Jangan lupa sesuaikan URL tujuan menu dan Nama menunya.

Jika sudah diedit semua, save template.

Menambah Tombol Media Sosial


Secara default tombol social media dari template viomagz buatan mas sugeng tidak terpasang ketika template baru pertama kali diupload.

Untuk memasangnya silakan ikuti langkah di bawah:

Login ke “Blogger” > Masuk ke menu “Tata Letak”
Klik “Tambahkan Gadget” di atas Footer
Pilih Gadget “HTML/JavaScript”
Selanjutnya tambahkan kode di bawah ini pada bagian Konten:

<!-- social media button start -->
<ul class='nav-social'>
  <li><a class='fcb' href='https://www.facebook.com/' rel='nofollow'><i class='fa fa-facebook-square fa-2x'/></a>
  </li>
  <li><a class='igicon' href='https://www.instagram.com/' rel='nofollow'><i class='fa fa-instagram fa-2x'/></a>
  </li>
  <li><a class='gpl' href='https://plus.google.com/' rel='nofollow'><i class='fa fa-google-plus-square fa-2x'/></a>
  </li>
  <li><a class='twt' href='https://twitter.com/' rel='nofollow'><i class='fa fa-twitter-square fa-2x'/></a>
  </li>
  <li><a class='ytb' href='https://www.youtube.com' rel='nofollow'><i class='fa fa-youtube fa-2x'/></a>
  </li>
</ul>
<!-- social media button end -->

Jangan lupa klik “Simpan”
Jangan lupa rubah URL yang bertanda hijau di atas dengan URL profil social media milik kalian.

Menambahkan Widget Featured Post


Untuk memasang widget Featured Post caranya sangatlah mudah.
Caranya:
Login ke “Blogger” > Masuk ke menu “Tata Letak”
Klik “Tambahkan Gadget” tepat di atas Posting Blog
Pilih Gadget “Entri yang Diunggulkan”
Setelah itu tinggal pilih artikel mana yang ingin ditampilkan pada Featured Post

Jika sudah, klik “Simpan”

Modifikasi Tampilan Template


Kalian bisa dengan mudah mengganti warna, background, dan juga font pada template Viomagz buatan mas sugeng ini melalui menu Desainer Tema Blogger.

Caranya:
Login ke “Blogger” > Masuk ke menu “Tema”
Klik tombol “Sesuakan”
Setelah itu klik “Tingkat Lanjut”

Pada menu tersebut kalian bisa merubah background dan juga warna template sesuai keinginan.

Memasang Widget Artikel Terbaru


Untuk memasang widget artikel terbaru silakan ikuti langkah-langkah berikut:

Login ke “Blogger” > “Tata Letak” > klik “Tambahkan gadget“
Pilih Gadget “HTML/JavaScript“
Pada bagian judul isi sesuai keinginan, misalnya “Daftar Artikel“
Pada bagian konten isi dengan kode ini:

<div class='artikel-terbaru'>
<script>
function artikelterbaru(e){document.write("<ul>");for(var t=0;t<e.feed.entry.length;t++){for(var r=0;r<e.feed.entry[t].link.length&&"alternate"!=e.feed.entry[t].link[r].rel;r++);var n="<li><a href="+("'"+e.feed.entry[t].link[r].href+"'")+'">'+e.feed.entry[t].title.$t+"</a> </li>";document.write(n)}document.write("</ul>")}
</script>
<script src="/feeds/posts/summary/?max-results=5&alt=json-in-script&callback=artikelterbaru"></script>
</div>

Jika sudah, klik “Simpan“

Keterangan : Angka 5 pada script tersebut adalah jumlah artikel yang dimunculkan, silakan dirubah sesuai keinginan.

Menampilkan Kotak Berlangganan FeedBurner

Template Viomagz buatan mas sugeng ini sudah tersedia fitur kotak berlangganan via email menggunakan feedburner, tapi secara default tidak ditampilkan.

Untuk menampilkannya silakan ikuti langkah-langkah berikut:

Login ke “Blogger” masuk ke menu “Tema” > Klik “Edit HTML“
Cari kode ini :

<b:include data='post' name='relatedpost'/>
Jika ketemu, tambahkan kode ini tepat di bawahnya :

<b:include data='post' name='postsubscribebox'/>

Selanjutnya cari kode ini :
https://feedburner.google.com/fb/a/mailverify?uri=BlogMasSugeng
Ganti yang saya tandai merah dengan ID FeedBurner milik sobat

Cari lagi kode ini :
<input name='uri' type='hidden' value='BlogMasSugeng'/>
Ganti yang saya tandai merah dengan ID FeedBurner milik sobat

Terakhir klik “Simpan tema“

Memasang Daftar Isi di Halaman Statis Template VioMagz


Widget daftar isi template VioMagz buatan mas sugeng ini menggunakan kode JavaScript buatan dari dte.web.id yang sudah dimodifikasi tampilannya supaya pas untuk dipasang di template VioMagz.

Langsung saja berikut langkah-langkahnya:

Login ke Blogger > Masuk ke menu “Halaman“
Klik tombol “Halaman baru” untuk membuat halaman statis baru
Selanjutnya ganti mode editor dari “Compose” menjadi “HTML“
Masukan judul halaman (contoh: “Daftar Isi“)
Masukan kode di bawah ini pada bagian konten:


<div class="tabbed-toc" id="tabbed-toc">
<span class="loading">Memuat…</span></div>
<script>
var tabbedTOC = {
    blogUrl: "https://domain.com/", // Blog URL
    containerId: "tabbed-toc", // Container ID
    activeTab: 1, // The default active tab index (default: the first tab)
    showDates: true, // `true` to show the post date
    showSummaries: false, // `true` to show the posts summaries
    numChars: 200, // Number of summary chars
    showThumbnails: true, // `true` to show the posts thumbnails (Not recommended)
    thumbSize: 60, // Thumbnail size
    noThumb: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC", // A "no thumbnail" URL
    monthNames: [ // Array of month names
        "Januari",
        "Februari",
        "Maret",
        "April",
        "Mei",
        "Juni",
        "Juli",
        "Agustus",
        "September",
        "Oktober",
        "November",
        "Desember"
    ],
    newTabLink: true, // Open link in new window?
    maxResults: 99999, // Maximum post results
    preload: 0, // Load the feed after 0 seconds (option => time in milliseconds || "onload")
    sortAlphabetically: true, // `false` to sort posts by published date
    showNew: 7, // `false` to hide the "New!" mark in most recent posts, or define how many recent posts are to be marked
    newText: ' &ndash; <em style="color:red;">New!</em>' // HTML for the "New!" text
};
</script>

<script src="//cdn.rawgit.com/tovic/dte-project/2fd2d2971c3398029ea5e149696447243e7f4d94/tabbed-toc.min.js"></script>
Ganti tulisan www.domain.com dengan URL blog milik kalian
Terkahir klik “Simpan tema“

Contoh tampilan daftar isi bisa tombol dibawah ini

Adapun jika kalian berimnat membuat template seperti Kang Adhy Suryadi bisa melihat tutorialny disini

Baca Juga: Cara Membuat Daftar Isi Seperti Kompiajaib

Menghilangkan Widget Baca Juga di Template VioMagz


Pada template blog VioMagz buatan mas sugeng ini terdapat fitur “Baca Juga” yang muncul di tengah artikel. Widget tersebut otomatis menampilkan daftar artikel terkait berdasarkan label artikel. Bagi kalian pengguna template VioMagz yang kurang suka dengan fitur tesebut, kalian bisa menghapusnya dengan menyimak cara Menghilangkan Widget Baca Juga di Template VioMagz di bawah ini.

Berikut langkah-langkahnya:

Login ke blogger > masuk ke menu “Tema“
Klik “Edit HTML“
Cari dan hapus kode ini di dalam template:

  <div id='baca-juga'>
  <b:loop values='data:post.labels' var='label'>
  <b:if cond='data:label.isLast != &quot;true&quot;'>
  </b:if>
  <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=bacajuga&amp;max-results=5&quot;' type='text/javascript'/>
  </b:loop>
  <script type='text/javascript'>
  var judulbacajuga=&quot;<b:switch var='data:blog.locale'><b:case value='id' /><h2>Baca Juga</h2><b:default /><h2>Related</h2></b:switch>&quot;
  var jumlahbacajuga=3;
  removeRelatedDuplicates();
  printRelatedLabels(&quot;<data:post.url/>&quot;);
  </script>
  </div>

Klik “Simpan tema“

Menghilangkan Nomor Urut Pada Popular Post


Jika kalian pengguna template VioMagz  versi terbaru buatan mas sugeng ini, dan kalian kurang suka dengan tampilan Nomor urut pada widget popular post, kalian bisa mengikuti langkah-langkah di bawah ini untuk menghilangkan nomor urut tersebut.

Login ke blogger > Tema > Edit HTML
Cari dan hapus kode ini di dalam template

.PopularPosts ul li .item-thumbnail-only:before, .PopularPosts ul li .item-content:before, .PopularPosts ul li > a:before {
 content: counter(num) !important;
 font-size: 24px;
 font-weight: 500;
 display: block;
 position: absolute;
 top: 0;
 left: 0;
 bottom: 0;
 background: linear-gradient($(link.color), #fff);
 color: #fff !important;
 width: 26px;
 padding-top: 10px;
 text-align: center;
}
.PopularPosts ul li > a {
 display: block;
 padding-left: 32px;
 min-height: 45px;
}
.PopularPosts .item-title, .PopularPosts .item-thumbnail, .PopularPosts .item-snippet {
 margin-left: 32px;
}

Jika sudah, klik “Simpan tema“

Menampilkan Hanya Judul Artikel Pada Menu Home Page


Bagi kalian pengguna template VioMagz buatan mas sugeng ini yang ingin memodifikasi tampilan halaman depan supaya hanya muncul judul artikel saja yang tentunya beresiko blog menjadi lebih cepat, silakan ikuti panduan di bawah ini:

Login ke Blogger > Masuk ke menu “Tema” > klik “Edit HTML”
Cari dan hapus kode ini:

<b:include data='post' name='postthumbnail'/>
Hapus juga kode ini:

<b:eval expr='snippet(data:post.body, { length: 150, links: false, linebreaks: false })' />
Hapus juga kode ini:

<div class='post-info info-1'>
 <b:include data='post' name='postauthorinfo'/>
 <b:include data='post' name='postdateinfo'/>
 <b:include data='post' name='postcommentinfo'/>
 <b:include data='post' name='postQuickEdit'/>
</div>

Selanjutnya cari kode CSS ini :

.info-1, .info-2, h2.post-title, .post-snippet {
 margin-left: 275px;
}
Hapus dan ganti dengan kode CSS ini:

.info-1, .info-2, h2.post-title, .post-snippet {
 margin-left: 0px !important;
}

Jika sudah semua, klik “Simpan tema”

Memasang Iklan Infeed


Silakan diikuti langkah-langkahnya di bawah ini:

Masuk ke Akun AdSense dan buat unit iklan InFeed.
Jika sudah, salin kode unit iklannya
Masuk ke Blogger > Tema > Edit HTML
Cari kode ini di dalam template :

      <data:defaultAdStart/>
      <b:loop values='data:posts' var='post'>
Hapus kode tersebut dan ganti dengan kode berikut :
      <data:defaultAdStart/>
      <b:loop values='data:posts' var='post' index='x'>

Selanjutnya cari kode berikut :

<div class='post-outer'>

Note: Kode tersebut terdapat lebih dari satu, cari yang lokasinya paling dekat dengan kode yang sudah diedit sebelumnya.

Jika ketemu, tambahkan kode ini tepat di bawahnya :

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<b:if cond='data:x==1'>
<div class='post'>
...kode iklan in-feed di sini...
</div>
</b:if>
<b:if cond='data:x==3'>
<div class='post'>
...kode iklan in-feed di sini...
</div>
</b:if>
</b:if>

Ganti kode tulisan ...kode iklan in-feed di sini... dengan kode iklan in-feed yang sudah diparse tadi.

Terakhir klik “Simpan tema“

Memasang Iklan Matched Content di bawah Related Post


Bagi kalian pengguna template VioMagz buatan mas sugeng, jika ingin memasang iklan AdSense jenis Matched Content di bawah related posts, silakan ikuti langkah-langkah di bawah ini:

1. Login ke Blogger > masuk ke menu “Tema” > klik “Edit HTML”

2. Cari kode ini di dalam template:

<b:include data='post' name='relatedpost'/>
3. Letakan kode iklan matched content tepat di bawah kode tersebut

4. Jika ingin menghilangkan related posts, cukup hapus kode
 <b:include data='post' name='relatedpost'/>


5. Terakhir, klik “Simpan tema“

Menghapus Label Diatas Postingan


silakan ikut langkah-langkah di bawah ini:

1. Login ke Blogger > masuk ke menu “Tema” > Klik “Edit HTML”
2. Cari kode ini di dalam template:

   <b:if cond='data:post.labels'>
   <div class='label-line'>
   <span class='label-info-th'>
   <b:loop values='data:post.labels' var='label'>
  <a expr:href='data:label.url + &quot;?&amp;max-results=8&quot;' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'></b:if>
   </b:loop>
   </span>
   </div>
   </b:if>

3. Jika ketemu, hapus kode tersebut.

4. Terakhir, klik “Simpan tema“

Memasang Iklan Ditengah Artikel Postingan

Pada template VioMagz buatan mas sugeng ini sudah tersedia widget khusus untuk menampilkan iklan di tengah postingan supaya klian tidak perlu memasang kode iklan secara manual ke dalam template.

Untuk cara menggunakan widget tersebut sangatlah mudah.

Pertama login ke “Blogger” > “Tata Letak“
Pada bagian bawah posting blog terdapat 4 widget untuk memasang kode iklan. Widget tersebut adalah :
Iklan Atas Artikel
Iklan Tengah Artikel 1
Iklan Tengah Artikel 2
Iklan Bawah Artikel
Klik edit pada widget-widget tersebut dan letakan kode iklannya.
Widget tersebut tidak harus digunakan semuanya. Jika sobat hanya ingin menampilkan iklan di bawah artikel, maka cukup letakan kode iklannya pada widget Iklan Bawah Artikel.

Mengatur Posisi Iklan Ditengah Artikel 


Caranya sebagai berikut:

Masuk ke “Blogger” > “Tema” > “Edit HTML“
Untuk mengatur letak iklan di tengah artikel yang pertama cari kode ini di dalam template:
if (lokasi.length &gt; 2) {
    insertAfter(iklan1,lokasi[2]);
}
Rubah angka 2 yang saya tandai hijau sesuai dengan keinginan. Semakin besar angkanya, letak iklannya samakin ke bawah.

Untuk mengatur letak iklan di tengah artikel yang kedua cari kode ini di dalam template:
if (lokasi.length &gt; 10) {
    insertAfter(iklan2,lokasi[10]);
}
Rubah angka 10 yang saya tandai hijau sesuai dengan keinginan. Semakin besar angkanya, letak iklannya samakin ke bawah.


Jangan lupa klik “Simpan tema” jika sudah selesai mengedit.

Mengatasi Iklan Tengah Artikel Tidak Muncul


Solusi pertama :

Pastikan tidak menggunakan 1 unit iklan lebih dari 1 kali. Jika sobat ingin memasang 4 iklan di blog, maka pastikan menggukan 4 unit iklan yang berbeda.
Solusi kedua :

Pertama, hapus semua script di bawah ini pada kode unit iklan adsense yang terpasang di blog, termasuk unit iklan Auto ads:

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
Kedua, masuk ke “Blogger” > “Tema” > “Edit HTML“
Cari kode ini :
</body>
Jika ketemu, letakan kode ini tepat di atasnya :

<script type='text/javascript'>
//<![CDATA[
(function() { var ga = document.createElement('script'); ga.type =
'text/javascript'; ga.async = true; ga.src =
'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js'; var
sa = document.getElementsByTagName('script')[0];
sa.parentNode.insertBefore(ga, sa); })();
//]]>
</script>

Jangan lupa klik “Simpan tema“

Baca Juga: Mempercepat Blog Dengan Mengurangi Kode Iklan Adsense Tanpa Diulang Biar Blog Fast Loading

Menghilangkan Sidibar Wrapper Template Viomagz

silakan ikuti langkah-langlah di bawah ini:

Login ke “Blogger” > Masuk ke menu “Tema“
Klik “Edit HTML“
Salin kode ini :

<style>
#post-wrapper, #wrapper {
 max-width: 1000px !important;
}
#post-wrapper {
 width: 100% !important;
}
#sidebar-wrapper {
 display: none;
}
.post-container {
 padding-right: 0 !important;
}
</style>

Letakan kode tersebut di bawah kode :
]]></b:template-skin>
Jika kolom artikel menjadi terlalu lebar, cukup edit pada bagian 1000px, Misalnya edit menjadi 800px.

Terakhir, klik “Simpan tema“

Jika kalian ingin hanya menyembunyikan sidebar pada halaman tertentu seperti hanya dihompe page, atau laman statis dan artikel bisa mengikuti panduannya dengan klik disini

Keterangan: setelah membaca artikel tersebut, untuk mempermudah bisa menaruh kode berikut diatas kode </head> dan beri kode kondisional <bif> sesuai keinginan


<style type='text/css'>#comments,#sidebar-wrapper {display:none;}#post-wrapper {float:none;width:100%;margin:0 auto;max-width:100%;}</style>

Cara Menampilkan Full Artikel Pada Menu Home Page


silakan ikuti langkah-langkahnya di bawah ini:

Pertama, login ke “Blogger” > Masuk ke menu “Tema“
Klik “Edit HTML“
Cari dan hapus kode ini :

<b:include data='post' name='postthumbnail'/>
Selanjutnya, cari kode ini :
<div class='post-snippet'>
<b:eval expr='snippet(data:post.body, { length: 150, links: false, linebreaks: false })' />
</div>

Hapus kode tersebut dan ganti dengan kode ini :

<data:post.body/>
Selanjutnya, cari kode CSS ini :
.info-1, .info-2, h2.post-title, .post-snippet {
 margin-left: 275px;
}

Hapus dan ganti dengan ini:

.info-1, .info-2, h2.post-title, .post-snippet {
 margin-left: 0px !important;
}
Terakhir, klik “Simpan tema“

Membuat Loading Blog Template Viomagz Super Cepat


Sebenarnya template Viomagz sudah fast loading, namun jika kalian ingin kecepatannya lebih super cepat bisa mengikuti langkah dibawah ini, tetapi tentunya bisa mengorbankan penampilan.

Pertama, Menonaktifkan Navbar
Hal pertama yang bisa dilakukan adalah menonaktifkan Navbar pada template. Menonaktifkan Navbar tidak mempengaruhi tampilan template. Navbar pada template VioMagz sebenarnya sudah disembunyikan menggunakan CSS, namun navbar tersebut masih aktif meskipun tidak terlihat. Untuk menonaktifkannya silakan ikuti langkah-langkah berikut:

Login ke Blogger > Masuk ke menu “Tata Letak”
Klik edit pada bagian widget Navbar (letaknya di atas Header)
Selanjutnya pilih “Off”
Klik “Simpan”

Selesai

Kedua, Menghilangkan Thumbanail Post di Home Page
Caranya seperti berikut:

Login ke Blogger > Masuk ke menu “Tema”
Klik tombol “Edit HTML”
Cari dan hapus kode ini pada template:

<b:include data='post' name='postthumbnail'/>
Selanjutnya cari kode CSS ini :
.info-1, .info-2, h2.post-title, .post-snippet {
 margin-left: 275px;
}

Hapus dan ganti dengan ini:

.info-1, .info-2, h2.post-title, .post-snippet {
 margin-left: 0px !important;
}

Jika sudah, klik “Simpan tema”

Ketiga, Menghilangkan Fitur Numbered Page Navigation
Berikut langkah-langkahnya:

Login ke Blogger > Masuk ke menu “Tema”
Klik tombol “Edit HTML”
Cari dan hapus kode ini pada template:

<script>
//<![CDATA[
if(typeof firstText=="undefined")firstText="First";
...
...
... sampai dengan ....
...
...
"+perPage+"#PageNo="+noPage}location.href=pAddress}
//]]>
</script>

Jika sudah, klik “Simpan tema”

Keempat, Menghilangkan Thumbnail pada Widget Popular Posts
Jika kalian memasang Widget Popular Posts, silakan atur supaya tidak menampilkan Thumbnail pada judul.

Kelima, Mengurangi Jumlah Widget yang Terpasang
Terakhir sebisa mungkin untuk tidak memasang terlalu banyak Widget.Semakin banyak widget yang terpasang, semakin berat loading template.

Terakhir, Cara Ampuh
Jika kalian suka dengan thumbnail post dan popular post karena menjadikan blog keren dan menarik, kalian bisa menuju pada tutorial dibaawah ini;

Optimasi Imgae Dengan CDN Staticaly
Optimasi Image Dengan Script Lazy Load

Demikianlah Panduan Setting Template Viomagz Lengkap Versi Terbaru, Semoga bermanfaat. Saya berterimakasih banyak kepada mas sugeng yang sudah membuat template begitu fast loading dan juga panduan template yang lengkap dan jelas.
Reactions
PERHATIAN:Jika anda mendownload di blog ini, maka anda akan di redirect terlebih dahulu ke laman Short Safelink untuk keamanan blog. Oleh karena itu jika terjadi error 404 maka terjadi kesalahan dalam klik di laman redirect atau terjadi refresh laman redirect. Untuk mengatasinya anda bisa mengulang kembali klik file yang akan anda download di blog ini. Dan Jika anda ingin bertanya atau bantuan bisa kontak kami dengan Klik Disini atau nomor berikut 089677337414 - Terima kasih.
Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi tautan tidak akan ditampilkan sebelum disetujui
Buka Komentar
Tutup Komentar