Panduan Pengaturan Template LinkMagz
Daftar Isi
- 1 Pengaturan Fitur Template
- 2 Menambah Menu Navigasi
- 3 Menampilkan Menu Halaman Statis
- 4 Menambah Icon Media Sosial
- 5 Cara Posting Produk dan Jasa
- 6 Cara Posting Advertorial
- 7 Cara Mengaktifkan TOC (Table of Content)
- 8 Mengganti Judul Blog dengan Logo
- 9 Mengedit Tulisan di Footer
- 10 Mengganti Favicon
- 11 Menyembunyikan Label, Tanggal, Komentar, Dll.
- 12 Modifikasi Tampilan Template
- 13 Pertanyaan Umum
Pengaturan Fitur Template
Beberapa fitur-fitur pada template bisa diatur menggunakan kode pengaturan.
Cara penerapannya sebagai berikut:
- Buat kode pengaturan template menggunakan tool yang sudah disediakan di sini.
- Setelah kodenya dibuat, masuk ke menu Tata Letak > edit widget “Kode Pengaturan Template” > tempelkan kodenya di bagian Konten.
Kode pengaturan sifatnya opsional, boleh dipasang boleh juga tidak. Jika tidak dipasang maka akan menggunakan pengaturan default template.
Untuk memasang menu navigasi harus menggunakan kode HTML. Tapi tidak perlu khawatir karena sudah disediakan tool khusus untuk membuat kode HTML menu navigasi.
Berikut langkah-langkahnya:
- Buat kode menu navigasi menggunakan tool yang sudah disediakan di sini.
- Setelah kodenya dibuat, masuk ke menu Tata Letak > edit widget “Kode Menu Navigasi” > tempelkan kodenya di bagian Konten.
Menampilkan Menu Halaman Statis
Berbeda dengan menu navigasi utama (di bawah header), menu di bagian footer menggunakan widget halaman statis bawaan blogger, jadi tidak perlu menggunakan kode HTML.
Untuk menampilkan/menambah menu di footer bisa diedit langsung lewat menu Tata Letak.
Caranya sebagai berikut:
- Masuk ke “Tata Letak” > edit widget yang bernama “Menu Halaman Statis“
- Pilih/masukkan url halaman yang ingin ditampilkan di menu > klik “Simpan“
Menambah Icon Media Sosial
Seperti menu navigasi utama, untuk memasang icon media sosial juga perlu menggunakan kode HTML dan pastinya sudah disediakan tool-nya, jadi tinggal generate kode saja.
Berikut langkah-langkahnya:
- Buat kode icon media sosial menggunakan tool yang sudah disediakan di sini.
- Setelah kodenya dibuat, masuk ke menu Tata Letak > edit widget “Icon Media Sosial” > tempelkan kodenya di bagian Konten.
Cara Posting Produk dan Jasa
Untuk membuat postingan Produk atau Jasa harus menggunakan kode HTML khusus yang sudah disediakan, jadi tidak sama seperti membuat postingan biasa.
Berikut langkah-langkahnya:
- Siapkan dulu URL gambar produk yang akan diposting. Gambar bisa diupload ke blog menggunakan cara ini.
- Jika URL gambar sudah siap, buat kode postingan produk menggunakan tool yang sudah disediakan di sini.
- Setelah kodenya dibuat > buat postingan baru di blog > edit postingan menggunakan mode HTML > tempelkan kodenya di bagian konten.
- Di bagian label harus diisi dengan salah satu dari label berikut:
- Produk
- Products
- Jasa
- Services
Note: Nama label case-sensitive, huruf besar dan kecil harus ditulis sama persis. Misalnya untuk label Produk harus ditulis Produk bukan produk.
Cara Posting Advertorial
Untuk posting artikel Advertorial atau Iklan caranya seperti posting artikel biasa, hanya saja di bagian label harus diisi dengan salah satu dari label berikut:
- Advertorial
- Iklan
- Sponsor
Cara Mengaktifkan TOC (Table of Content)
Edit postingan yang ingin menampilan TOC, edit dalam mode HTML.
Setelah itu masukan kode ini di atas postingan atau di lokasi yang sobat inginkan.
<div id="toc"><b class="toc"></b></div>
Pastikan di dalam postingan sudah terdapat tag heading <h2> atau <h3>
Mengganti Judul Blog dengan Logo
- Pastikan sudah membuat gambar logonya. Ukuran logo bebas tapi usahakan dibuat memanjang, bukan kotak. Jika kotak nanti akan terlihat kecil.
- Masuk ke “Tata Letak” > edit widget “Header” > Upload gambar
- Pada bagian “Penempatan” pilih “Selain judul dan keterangan” > Simpan.
- 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 langsung berubah.
Menyembunyikan Label, Tanggal, Komentar, Dll.
- Masuk ke “Tata Letak” > edit widget “Postingan Blog“
- Hilangkan centang yang tidak ingin ditampilan > Simpan.
Modifikasi Tampilan Template
Sobat bisa dengan mudah mengganti warna, background, dan juga dimensi pada template ini melalui menu Desainer Tema Blogger.
Caranya:
- Masuk ke menu “Tema” > “Sesuaikan” > “Lanjutan”
Note:
- Modifikasi tampilan template melalui menu desainer tema akan kembali seperti semula ketika memasang template versi terbaru.
- Jika sobat familiar dengan kode CSS, saya merekomendasikan menggunakan widget custom CSS untuk memodifikasi tampilan linkmagz. Caranya baca di sini : Cara Modifikasi Tampilan LinkMagz via Widget Custom CSS.
Pertanyaan Umum
Pertama pastikan centang opsi “Dapat dilihat” pada setelan widget
Jika tetap tidak muncul atau tampilannya error, coba hapus dulu widgetnya setelah itu pasang ulang.
Solusi 1: Masuk ke Setelan > Komentar > Lokasi Komentar > pilih “Tersemat”.
Solusi 2: Masuk ke Tata Letak > edit bagian “Posting Blog” > pastikan centang opsi menampilkan komentar.
Solusi 3: Pastikan kolom komentar tidak dinonaktifkan di setelan postingan. Edit postingan yang komentarnya tidak muncul, cek opsi komentar di sebelah kanan bawah.
Solusinya bisa dibaca di sini
Resolusi gambar logo bebas, tapi usahakan logonya dibuat memanjang, bukan kotak. Jika logonya kotak nanti akan terlihat kecil setelah dipasang ke blog.
Rekomendasi gunakan gambar postingan dengan aspek rasio 16:9.
Misalnya jika lebar gambarnya 800px maka tingginya adalah 450px.
Sedangkan untuk postingan Produk dan Jasa, gunakan aspek rasio 1:1.
Misalnya jika lebar gambarnya 800px maka tingginya juga 800px.
Untuk menghitung aspek rasio bisa menggunakan tool ini : https://calculateaspectratio.com/
Edit postingan yang ingin diberi tombol download dalam mode HTML.
Masukan kode ini di dalam postingan:
<div style="text-align: center;">
<a class="buttonDownload" href="#">Download</a>
</div>
Edit tanda pagar yang berwarna merah dengan URL tujuan.
- Pastikan widget Navbar dinonaktifkan melalui menu Tata Letak
- Kompres setiap gambar yang digunakan di blog, baik itu gambar logo, gambar postingan, atapun gambar profil. Untuk cara kompres gambar bisa menggunakan tool online https://kraken.io/web-interface
- Batasi jumlah widget yang terpasang blog. Cukup pasang widget yang benar-benar dibutuhkan saja
Panduan pemasangan meta deskripsi bisa dibaca di sini.
Meta keywords sebenarnya sudah tidak ada pengaruhnya terhadap SEO.
Tapi di template ini masih tetap dipasang dan sudah diset otomatis, jadi tidak perlu memasang secara manual.
Silakan buat halaman statis baru. Pada editor halaman pilih mode HTML, setelah itu letakan kode ini:
<div class="tabbed-toc" id="tabbed-toc"><span class="loading">Memuat…</span></div><script>/*!
* Blogger Tabbed Style Table of Content Widget by Taufik Nurrohman
* Free for change but keep the original attribution.
* URL: https://plus.google.com/108949996304093815163/about
*/
var tabbedTOC={blogUrl:"https://linkmagz.sugeng.id/",containerId:"tabbed-toc",activeTab:1,showDates:!0,showSummaries:!1,numChars:200,showThumbnails:!0,thumbSize:60,noThumb:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC",monthNames:["Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","November","Desember"],newTabLink:!0,maxResults:99999,preload:0,sortAlphabetically:!0,showNew:7,newText:' – <em style="color:red;">New!</em>'};
!function(a,b){var c=(new Date).getTime(),d={blogUrl:"http://dte-feed.blogspot.com",containerId:"tabbed-toc",activeTab:1,showDates:!1,showSummaries:!1,numChars:200,showThumbnails:!1,thumbSize:40,noThumb:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC",monthNames:["Januari","Februari","Maret","April","Mei","Juni","Juli","Agustus","September","Oktober","November","Desember"],newTabLink:!0,maxResults:99999,preload:0,sortAlphabetically:!0,showNew:!1,newText:' – <em style="color:red;">Baru!</em>'};if("undefined"==typeof tabbedTOC)tabbedTOC=d;else for(var e in d)d[e]="undefined"!=typeof tabbedTOC[e]?tabbedTOC[e]:d[e];a["clickTabs_"+c]=function(a){for(var b=document.getElementById(d.containerId),c=b.getElementsByTagName("ol"),e=b.getElementsByTagName("ul")[0],f=e.getElementsByTagName("a"),g=0,h=c.length;h>g;++g)c[g].style.display="none",c[parseInt(a,10)].style.display="block";for(var i=0,j=f.length;j>i;++i)f[i].className="",f[parseInt(a,10)].className="active-tab"},a["showTabs_"+c]=function(e){for(var f=parseInt(e.feed.openSearch$totalResults.$t,10),g=d,h=e.feed.entry,i=e.feed.category,j="",l=0;l<(g.showNew===!0?5:g.showNew)&&l!==h.length;++l)h[l].title.$t=h[l].title.$t+(g.showNew!==!1?g.newText:"");h=g.sortAlphabetically?h.sort(function(a,b){return a.title.$t.localeCompare(b.title.$t)}):h,i=g.sortAlphabetically?i.sort(function(a,b){return a.term.localeCompare(b.term)}):i,j='<span class="toc-line"></span><ul class="toc-tabs">';for(var m=0,n=i.length;n>m;++m)j+='<li class="toc-tab-item-'+m+'"><a onclick="clickTabs_'+c+"("+m+');return false;" onmousedown="return false;" href="javascript:;">'+i[m].term+"</a></li>";j+="</ul>",j+='<div class="toc-content">';for(var o=0,n=i.length;n>o;++o){j+='<ol class="panel" data-category="'+i[o].term+'"',j+=o!=g.activeTab-1?' style="display:none;"':"",j+=">";for(var p=0;f>p&&p!==h.length;++p){for(var q,r=h[p],s=r.published.$t,t=g.monthNames,u=r.title.$t,v=("summary"in r&&g.showSummaries===!0?r.summary.$t.replace(/<br *\/?>/g," ").replace(/<.*?>/g,"").replace(/[<>]/g,"").substring(0,g.numChars)+"…":""),w=("media$thumbnail"in r&&g.showThumbnails===!0?'<img class="thumbnail" style="width:'+g.thumbSize+"px;height:"+g.thumbSize+'px;" alt="" src="'+r.media$thumbnail.url.replace(/\/s\d(\-c)?\//,"/s"+g.thumbSize+"-c/")+'"/>':'<img class="thumbnail" style="width:'+g.thumbSize+"px;height:"+g.thumbSize+'px;" alt="" src="'+g.noThumb.replace(/\/s\d(\-c)?\//,"/s"+g.thumbSize+"-c/")+'"/>'),x=r.category||[],y=g.showDates?'<time datetime="'+s+'" title="'+s+'">'+s.substring(8,10)+" "+t[parseInt(s.substring(5,7),10)-1]+" "+s.substring(0,4)+"</time>":"",z=0,A=r.link.length;A>z;++z)if("alternate"===r.link[z].rel){q=r.link[z].href;break}for(var B=0,C=x.length;C>B;++B){var D=g.newTabLink?' target="_blank"':"";x[B].term===i[o].term&&(j+='<li title="'+x[B].term+'"',j+=g.showSummaries?' class="bold"':"",j+='><a href="'+q+'"'+D+">"+u+y+"</a>",j+=g.showSummaries?'<span class="summary">'+w+v+'<span style="display:block;clear:both;"></span></span>':"",j+="</li>")}}j+="</ol>"}j+="</div>",j+='<div style="clear:both;"></div>',b.getElementById(g.containerId).innerHTML=j,a["clickTabs_"+c](g.activeTab-1)};var f=b.getElementsByTagName("head")[0],g=b.createElement("script");g.src=d.blogUrl.replace(/\/+$|[\?&#].*$/g,"")+"/feeds/posts/summary?alt=json-in-script&max-results="+d.maxResults+"&orderby=published&callback=showTabs_"+c,"onload"!==d.preload?a.setTimeout(function(){f.appendChild(g)},d.preload):a.onload=function(){f.appendChild(g)}}(window,document);</script>
Ganti yang bertanda merah dengan alamat blog milik sobat.