Dokumentasi Lengkap Materia X2 Premium (Major Updates)


  1. Cara Backup Template Blogger
  2. Cara Install Template Blogger
    1. Cara 1: Metode Upload
    2. Cara 2: Metode Paste
    3. Cara 3: Metode Overwrite
  3. Pengaturan Tema
    1. Mengatur Judul dan Logo Blog/Website
      1. Memasang Header Logo
    2. Mengatur Menu Sidebar (Drawer)
      1. Membuat Dropdown/Multilevel/Sub Menu
      2. Memasang Icon pada Menu
    3. Mengatur Header Menu Kanan
    4. Memasang Custom Widget
      1. Memasang Block Post Widget
      2. Memasang Grid Post Widget
      3. Memasang Left Post Widget
      4. Memasang Right Post Widget
      5. Memasang Video Post Widget
    5. Memasang Kode Iklan
    6. Mengatur Sidebar Widget
    7. Pengaturan Variabel, CSS, dan Facebook SDK
      1. Facebook SDK
      2. Default Variables
      3. Mengatur Format Bulan (Opsional)
      4. Mengatur Jumlah Related Post (Opsional)
      5. Mengatur Teks Tampilkan Selengkapnya (Opsional)
      6. Mengatur Teks Follow by Email (Opsional)
      7. Mengatur Comment System (Opsional)
      8. Mengatur Shortname untuk Disqus
      9. Mengatur CSS Options
      10. Membuat Garis Batas (Border) pada Sidebar Menu (Drawer)
    8. Pengaturan Theme Designer
      1. Mengaktifkan/Menonaktifkan Fitur eCommerce
      2. Mengaktifkan/Menonaktifkan Fitur Syntax Highlighter
      3. Mengaktifkan/Menonaktifkan Fitur Sticky/Fixed Sidebar
      4. Mengaktifkan/Menonaktifkan Thumbnail di Posisi Kanan/Kiri
      5. Mengaktifkan/Menonaktifkan Menu Sidebar (Navigation Drawer)
      6. Mengaktifkan/Menonaktifkan Layout Grid
      7. Mengaktifkan/Menonaktifkan Pre Loader
      8. Mengaktifkan/Menonaktifkan Fitur Dark Mode
      9. Mengaktifkan/Menonaktifkan Versi Comment System Blogger Terbaru
      10. Mengaktifkan/Menonaktifkan Jumlah Komentar
      11. Mengaktifkan/Menonaktifkan Breadcrumb
      12. Mengaktifkan/Menonaktifkan Tombol Share dibawah Nama Author
      13. Mengaktifkan/Menonaktifkan Tombol Navigasi Postingan
      14. Pengaturan Lainnya
  4. Menggunakan Post Shorcode
    1. Shortcode Alert
      1. Alert Warning
      2. Alert Info
      3. Alert Error
      4. Alert Success
    2. Shortcode Tombol
    3. Shortcode Code Box/Syntax Highlighter
    4. Shortcode Contact Form

Cara Backup Template Blogger

Sebelum menginstal template baru untuk Blogger, alangkah baiknya jika kalian mem-Backup terlebih dahulu template lama guna meminimalisir kesalahan yang mungkin saja bisa terjadi. Ikutilah beberapa tahap berikut:

Cara Backup Template Blogger
  1. Masuk ke Blogger, pilih menu Theme (Tema) > Backup/Restore > Download Theme (Download Tema).

Cara Install Template Blogger

Cara 1: Metode Upload

Jika sudah di-Backup, selanjutnya kalian dapat menginstal template. Ikutilah panduan berikut:

Cara 1: Metode Upload
  1. Masuk ke Blogger, pilih menu Theme (Tema) > Backup/Restore > Browse > pilih File tema yang ingin digunakan (.xml) > Klik tombol Upload.

Cara 2: Metode Paste

Jika gagal atau tidak bisa, kalian dapat mengikuti tahap berikut:

 Cara 2: Metode Paste
  1. Buka  File tema dengan menggunakan Text Editor (Notepad, Notepad++, Sublime Text, dll) dan salin semua kode dengan menekan tombol CTRL + A kemudian CTRL + C pada Keyboard.
  2. Masuk ke Blogger, pilih menu Theme (Tema) > Edit HTML.
  3. Seleksi semua kode dengan menekan tombol CTRL + A dan pastekan kode yang telah kalian salin sebelumnya dengan menekan tombol CTRL + V pada Keyboard.
  4. Terakhir, tekan tombol Save Theme (Simpan Tema).

Cara 3: Metode Overwrite

Jika kedua langkah diatas masih tetap gagal, kalian dapat mengikuti beberapa tahap berikut:

 Cara 3: Metode Overwrite
  1. Masuk ke Blogger, pilih menu Theme (Tema).
  2. Gunakanlah Tema bawaan (Default) dari Blogger terlebih dahulu, kalian bisa menggunakan tema Contempo, Soho, Emporio, Notable, dll.
  3. Jika sudah, kalian dapat mengulangi Cara 1.

Catatan:
  • Sebelum menginstall, pastikan kalian sudah mem-Backup terlebih dahulu.
  • Jika ketiga cara diatas tidak berhasil, kalian dapat menghubungi Developer untuk mendapatkan dukungan instalasi.

Pengaturan Tema

Jika kalian sudah berhasil mem-Backup dan meng-Instal tema, selanjutnya kalian dapat mengikuti panduan berikut untuk mengatur Tema yang ingin kalian gunakan.

Mengatur Judul dan Logo Blog/Website

  1. Masuk ke Blogger, pilih menu Layout (Tata Letak) > Cari Section yang berjudul MAIN LOGO > Klik Icon pensil untuk mengedit Judul dan Logo.
  2. Akan muncul jendela konfigurasi Header, pada kolom Blog Title (Judul Blog), masukkan nama Blog kalian.
  3. Pada kolom Blog Description (Deskripsi Blog), masukkan deskripsi Blog kalian.
  4. Terakhir, klik tombol Save (Simpan).

Memasang Header Logo

Jika kalian ingin menggunakan Logo, pastikan tinggi (Height) dari logo adalah 34 pixel. Kalian dapat menggunakan Template Logo yang sudah disertakan pada File Tema.
  1. Masih pada jendela yang sama, pada bagian Image (Gambar), klik tombol Browse dan pilih Logo yang ingin kalian gunakan.
  2. Selanjutnya, pada bagian Placement (Peletakkan), pilih Instead of Title and Description.
  3. Terakhir, klik tombol Save (Simpan).

Mengatur Menu Sidebar (Drawer)

  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul LEFT NAVIGATION > Klik Icon pensil.
  3. Akan muncul jendela konfigurasi Link List, pada kolom New Site Name (Nama Website Baru), masukkan nama Menu kalian.
  4. Pada kolom New Site URL (URL Website Baru), masukkan Link yang ingin digunakan.
  5. Jika sudah, klik tombol Add Link (Tambahkan Link).
  6. Terakhir, klik tombol Save (Simpan).

Membuat Dropdown/Multilevel/Sub Menu

Cara membuatnya masih hampir sama dengan tahap sebelumnya, kalian dapat mengikuti beberapa tahap berikut:
  1. Masih pada jendela yang sama, untuk membuat Sub-Menu kedua, kalian dapat memasukkan satu karakter Underscore "_" pada kolom New Site Name (Nama Website Baru).
  2. Untuk membuat Sub-Menu ketiga, kalian dapat memasukkan dua karakter Underscore "__" pada kolom New Site Name (Nama Website Baru).
Jadi, strukturnya dapat terlihat seperti berikut:
Menu 1
_Menu 1.1
__Menu 1.1.1
Menu 2
_Menu 2.1
_Menu 2.2
__Menu 2.2.1
Menu 3
Menu 4

Catatan: Pastikan Menu yang memiliki karakter Underscore ada di bagian bawah menu yang tidak ada karakter Underscore.

Memasang Icon pada Menu

  1. Untuk memasang Icon, kalian dapat menginstall Plugin yang bernama Material Design Icons terlebih dahulu untuk Browser Chrome atau Firefox.
  2. Setelah terinstall, klik icon Plugin Material Design Icons, ketikkan nama icon yang ingin kalian gunakan pada kolom pencarian.
  3. Pilih/seleksi Icon tersebut, kemudian pilih menu (titik tiga) di bagian bawah dan klik Copy SVG.
  4. Masuk ke Blogger > Layout (Tata Letak).
  5. Masih pada jendela yang sama, pastekan Path SVG yang telah kalian salin tepat sebelum New Site Name (Nama Website Baru). Contoh
    <svg>...</svg> Nama Menu.
  6. Jika sudah, jangan lupa untuk mengeklik tombol Add Link (Tambahkan Link).
  7. Terakhir, klik tombol Save (Simpan).

Catatan:
  • Kalian tidak bisa menggunakan Icon pada Sub-Menu kedua atau Ketiga, hanya Menu utama yang bisa menggunakan Icon SVG.
  • Jika bingung, kalian dapat menghubungi Developer untuk mendapatkan bantuan.

Mengatur Header Menu Kanan

  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul RIGHT NAVIGATION > Klik Icon pensil.
  3. Akan muncul jendela konfigurasi Link List, pada kolom New Site Name (Nama Website Baru), masukkan nama Menu kalian.
  4. Pada kolom New Site URL (URL Website Baru), masukkan Link yang ingin digunakan.
  5. Jika sudah, klik tombol Add Link (Tambahkan Link).
  6. Terakhir, klik tombol Save (Simpan).

Catatan: Pada Menu Header Kanan, kalian tidak bisa menggunakan SVG Icon.

Memasang Custom Widget

Kalian dapat memasang Custom Widget Seperti Block Post, Grid Post, Right Post, Left Post, dan Video Post HANYA pada Section yang bernama POST WIDGETS 1 dan POST WIDGETS 2. Kedua Section tersebut hanya akan muncul pada bagian Homepage Blog kalian.

Memasang Block Post Widget

  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul POST WIDGETS 1 (Bagian Atas) atau POST WIDGETS 2 (Bagian Bawah) > Klik Add a Gadget (Tambahkan Gadget) > Pilih HTML/JavaScript.
  3. Di dalamnya, kalian dapat memasukkan Shortcode berikut:
    
    [customWidgets] -results=[5] -label=[recent] -type=[blocks] -color=[#f9db3b]
    
    

Keterangan:
  1. [customWidgets] = Merupakan indikator bahwasannya yang ingin dibuat adalah Custom Widget.
  2. -results=[x] = Merupakan indikator jumlah Post yang ingin ditampilkan, kalian dapat mengubah nilai x dengan angka yang kalian inginkan.
  3. -label[x] = Merupakan indikator nama Label dari Post yang ingin ditampilkan, kalian dapat mengubah nilai x dengan nama Label atau memasukkan recent untuk menampilkan Postingan terbaru.
  4. -type=[blocks] = Merupakan indikator tipe Custom Widget untuk Block Post.
  5. -color=[x] = Merupakan indikator Warna Hover Link dan Loader untuk Custom Widget (Opsional), kalian dapat mengubah nilai x dengan kode Warna (HEX).

Contoh: Disini saya ingin membuat Block Post Widget dengan hasil Postingan yang ingin ditampilkan sebanyak 5 Post dengan Label Teknologi dan berwarna biru (#1a73e8). Berikut adalah contoh Shortcodenya:

[customWidgets] -results=[5] -label=[Teknologi] -type=[blocks] -color=[#1a73e8]


Catatan:
  • Semua Shortcode Custom Widget itu Case Sensitive. Artinya, besar atau kecilnya huruf sangat berpengaruh.
  • Kalian dapat menggunakan/tidak menggunakan Shortcode -color=[x] (Opsional).

Memasang Grid Post Widget

  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul POST WIDGETS 1 (Bagian Atas) atau POST WIDGETS 2 (Bagian Bawah) > Klik Add a Gadget (Tambahkan Gadget) > Pilih HTML/JavaScript.
  3. Di dalamnya, kalian dapat memasukkan Shortcode berikut:
    
    [customWidget] -results=[3] -label=[recent] -type=[grids] -color=[#e81a1a]
    
    

Keterangan:
  1. [customWidgets] = Merupakan indikator bahwasannya yang ingin dibuat adalah Custom Widget.
  2. -results=[x] = Merupakan indikator jumlah Post yang ingin ditampilkan, kalian dapat mengubah nilai x dengan angka yang kalian inginkan.
  3. -label[x] = Merupakan indikator nama Label dari Post yang ingin ditampilkan, kalian dapat mengubah nilai x dengan nama Label atau memasukkan recent untuk menampilkan Postingan terbaru.
  4. -type=[grids] = Merupakan indikator tipe Custom Widget untuk Grid Post.
  5. -color=[x] = Merupakan indikator Warna Hover Link dan Loader untuk Custom Widget (Opsional), kalian dapat mengubah nilai x dengan kode Warna (HEX).

Contoh: Disini saya ingin membuat Grid Post Widget dengan hasil Postingan yang ingin ditampilkan sebanyak 3 Post dengan Label Teknologi dan berwarna biru (#1a73e8). Berikut adalah contoh Shortcodenya:

[customWidget] -results=[3] -label=[Teknologi] -type=[grids] -color=[#1a73e8]


Catatan:
  • Semua Shortcode Custom Widget itu Case Sensitive. Artinya, besar atau kecilnya huruf sangat berpengaruh.
  • Kalian dapat menggunakan/tidak menggunakan Shortcode -color=[x] (Opsional).

Memasang Left Post Widget

  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul POST WIDGETS 1 (Bagian Atas) atau POST WIDGETS 2 (Bagian Bawah) > Klik Add a Gadget (Tambahkan Gadget) > Pilih HTML/JavaScript.
  3. Di dalamnya, kalian dapat memasukkan Shortcode berikut:
    
    [customWidgets] -results=[4] -label=[recent] -type=[colleft] -color=[#1ae822]
    
    

Keterangan:
  1. [customWidgets] = Merupakan indikator bahwasannya yang ingin dibuat adalah Custom Widget.
  2. -results=[x] = Merupakan indikator jumlah Post yang ingin ditampilkan, kalian dapat mengubah nilai x dengan angka yang kalian inginkan.
  3. -label[x] = Merupakan indikator nama Label dari Post yang ingin ditampilkan, kalian dapat mengubah nilai x dengan nama Label atau memasukkan recent untuk menampilkan Postingan terbaru.
  4. -type=[colleft] = Merupakan indikator tipe Custom Widget untuk Left Post.
  5. -color=[x] = Merupakan indikator Warna Hover Link dan Loader untuk Custom Widget (Opsional), kalian dapat mengubah nilai x dengan kode Warna (HEX).

Contoh: Disini saya ingin membuat Left Post Widget dengan hasil Postingan yang ingin ditampilkan sebanyak 4 Post dengan Label Teknologi dan berwarna biru (#1a73e8). Berikut adalah contoh Shortcodenya:

[customWidgets] -results=[4] -label=[Teknologi] -type=[colleft] -color=[#1a73e8]


Catatan:
  • Semua Shortcode Custom Widget itu Case Sensitive. Artinya, besar atau kecilnya huruf sangat berpengaruh.
  • Kalian dapat menggunakan/tidak menggunakan Shortcode -color=[x] (Opsional).
  • Untuk Right & Left Post Widget, posisinya harus sejajar.

Memasang Right Post Widget

  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul POST WIDGETS 1 (Bagian Atas) atau POST WIDGETS 2 (Bagian Bawah) > Klik Add a Gadget (Tambahkan Gadget) > Pilih HTML/JavaScript.
  3. Di dalamnya, kalian dapat memasukkan Shortcode berikut:
    
    [customWidgets] -results=[4] -label=[recent] -type=[colright] -color=[#1ae822]
    
    

Keterangan:
  1. [customWidgets] = Merupakan indikator bahwasannya yang ingin dibuat adalah Custom Widget.
  2. -results=[x] = Merupakan indikator jumlah Post yang ingin ditampilkan, kalian dapat mengubah nilai x dengan angka yang kalian inginkan.
  3. -label[x] = Merupakan indikator nama Label dari Post yang ingin ditampilkan, kalian dapat mengubah nilai x dengan nama Label atau memasukkan recent untuk menampilkan Postingan terbaru.
  4. -type=[colright] = Merupakan indikator tipe Custom Widget untuk Left Post.
  5. -color=[x] = Merupakan indikator Warna Hover Link dan Loader untuk Custom Widget (Opsional), kalian dapat mengubah nilai x dengan kode Warna (HEX).

Contoh: Disini saya ingin membuat RightPost Widget dengan hasil Postingan yang ingin ditampilkan sebanyak 4 Post dengan Label Teknologi dan berwarna biru (#1a73e8). Berikut adalah contoh Shortcodenya:

[customWidgets] -results=[4] -label=[Teknologi] -type=[colright] -color=[#1a73e8]


Catatan:
  • Semua Shortcode Custom Widget itu Case Sensitive. Artinya, besar atau kecilnya huruf sangat berpengaruh.
  • Kalian dapat menggunakan/tidak menggunakan Shortcode -color=[x] (Opsional).
  • Untuk Right & Left Post Widget, posisinya harus sejajar.

Memasang Video Post Widget

  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul POST WIDGETS 1 (Bagian Atas) atau POST WIDGETS 2 (Bagian Bawah) > Klik Add a Gadget (Tambahkan Gadget) > Pilih HTML/JavaScript.
  3. Di dalamnya, kalian dapat memasukkan Shortcode berikut:
    
    [customWidgets] -results=[3] -label=[recent] -type=[videos] -color=[#1a29e8]
    
    

Keterangan:
  1. [customWidgets] = Merupakan indikator bahwasannya yang ingin dibuat adalah Custom Widget.
  2. -results=[x] = Merupakan indikator jumlah Post yang ingin ditampilkan, kalian dapat mengubah nilai x dengan angka yang kalian inginkan.
  3. -label[x] = Merupakan indikator nama Label dari Post yang ingin ditampilkan, kalian dapat mengubah nilai x dengan nama Label atau memasukkan recent untuk menampilkan Postingan terbaru.
  4. -type=[videos] = Merupakan indikator tipe Custom Widget untuk Video Post.
  5. -color=[x] = Merupakan indikator Warna Hover Link dan Loader untuk Custom Widget (Opsional), kalian dapat mengubah nilai x dengan kode Warna (HEX).

Contoh: Disini saya ingin membuat Left Post Widget dengan hasil Postingan yang ingin ditampilkan sebanyak 4 Post dengan Label Teknologi dan berwarna biru (#1a73e8). Berikut adalah contoh Shortcodenya:

[customWidgets] -results=[4] -label=[Teknologi] -type=[videos] -color=[#1a73e8]


Catatan:
  • Semua Shortcode Custom Widget itu Case Sensitive. Artinya, besar atau kecilnya huruf sangat berpengaruh.
  • Kalian dapat menggunakan/tidak menggunakan Shortcode -color=[x] (Opsional).

Memasang Kode Iklan

Untuk memasang kode iklan, kalian dapat meletakkannya pada Section yang bernama Home ADS 1 (Bagian Atas) dan Home ADS 2 (Bagian Bawah) untuk iklan yang ingin di tampilkan pada Homepage, serta POST ADS 1 dan POST ADS 2 untuk iklan yang ingin ditampilkan pada Postpage, dan SIDEBAR ADS untuk iklan Sidebar yang ditampilkan hanya pada bagian Postpage. Ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul Home ADS 1, HOME ADS 2, POST ADS 1, POST ADS 2, atau SIDEBAR ADS  > Klik Add a Gadget (Tambahkan Gadget) > Pilih HTML/JavaScript atau AdSense.
  3. Pastekan kode Iklan ke dalam Gadget tersebut.
  4. Terakhir, klik tombol Save (Simpan).

Mengatur Sidebar Widget

  1. Untuk memasang Sidebar Widget, kalian dapat meletakkanya pada Section yang bernama MAIN SIDEBAR.
  2. Disana kalian dapat menggunakan Widget bawaan yang disediakan oleh Blogger seperti Popular Post, Link List, Page List, Follow by Email, dll.

Pengaturan Variabel, CSS, dan Facebook SDK

Facebook SDK

Facebook SDK perlu kita atur jika kita menggunakan Comment System dari Facebook. Jika kalian tidak menggunakannya, maka kalian bisa melewati langkah ini.
  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul THEME OPTIONS > Facebook SDK > klik Icon Pensil.
  3. Pastekan kode berikut ke dalam Gadget tersebut:
    
    <script async="async" defer="defer" crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&version=v3.2"></script>
    
    
  4. Terakhir, klik tombol Save (Simpan).

Default Variables

Default Variables berfungsi untuk mengatur Format Bulan, Jumlah Related Post yang ingin ditampilkan, Teks Tampilkan Selengkapnya pada judul Widget, Teks Follow by Email, Mengatur Comment System, dan mengatur Shortname Disqus.

Mengatur Format Bulan (Opsional)

Format Bulan digunakan untuk menampilkan nama bulan berdasarkan bahasa yang kita gunakan. Kalian juga dapat melewati pengaturan ini karena pada dasarnya kami sudah merancangnya agar menjadi otomatis dari sistem. Jika kalian ingin mengaturnya, kalian dapat mengikuti panduan berikut:
  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul THEME OPTIONS > Default Variables > klik Icon Pensil.
  3. Akan muncul jendela konfigurasi Link List, pada kolom New Site Name (Nama Website Baru), masukkan kode monthFormat.
  4. Pada kolom New Site URL (URL Website Baru), masukkan kode berikut:
    
    ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
    
    
  5. Jika sudah, klik tombol Add Link (Tambahkan Link).
  6. Terakhir, klik tombol Save (Simpan).

Catatan:
Kalian dapat mengubahnya menjadi bahasa Indonesia atau membuatnya menjadi Tiga huruf.

Mengatur Jumlah Related Post (Opsional)

Defaultnya, Related Post yang akan ditampilkan hanya sebanyak 3 Post. Jika kalian ingin mengatur jumlahnya, maka ikutlah panduan berikut:
  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul THEME OPTIONS > Default Variables > klik Icon Pensil.
  3. Akan muncul jendela konfigurasi Link List, pada kolom New Site Name (Nama Website Baru), masukkan kode relatedPostsNum.
  4. Pada kolom New Site URL (URL Website Baru), masukkan jumlah postingan dalam bentuk angka. Mis, 3, 6, 8, 10, dst.
  5. Jika sudah, klik tombol Add Link (Tambahkan Link).
  6. Terakhir, klik tombol Save (Simpan).

Mengatur Teks Tampilkan Selengkapnya (Opsional)

Defaultnya, Teks Tampilkan Selengkapnya akan otomatis teratur tergantung dengan bahasa Blogger yang kita gunakan. Jika kalian ingin mengaturnya, maka ikutilah panduan berikut:
  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul THEME OPTIONS > Default Variables > klik Icon Pensil.
  3. Akan muncul jendela konfigurasi Link List, pada kolom New Site Name (Nama Website Baru), masukkan kode showMoreText.
  4. Pada kolom New Site URL (URL Website Baru), masukkan teks Tampilkan Selengkapnya atau dengan teks yang kalian inginkan.
  5. Jika sudah, klik tombol Add Link (Tambahkan Link).
  6. Terakhir, klik tombol Save (Simpan).

Mengatur Teks Follow by Email (Opsional)

Defaultnya, Teks Follow by Email akan otomatis teratur tergantung dengan bahasa Blogger yang kita gunakan. Jika kalian ingin mengaturnya, maka ikutilah panduan berikut:
  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul THEME OPTIONS > Default Variables > klik Icon Pensil.
  3. Akan muncul jendela konfigurasi Link List, pada kolom New Site Name (Nama Website Baru), masukkan kode followByEmailText.
  4. Pada kolom New Site URL (URL Website Baru), masukkan teks Dapatkan Notifikasi Postingan Terbaru melalui Email atau dengan teks yang kalian inginkan.
  5. Jika sudah, klik tombol Add Link (Tambahkan Link).
  6. Terakhir, klik tombol Save (Simpan).

Mengatur Comment System (Opsional)

Defaultnya, Comment System adalah dengan menggunakan komentar Blogger versi Lama/Baru, kalian dapat mengubahnya dengan menggunakan Comment System Facebook atau Disqus. Jika kalian ingin mengatur jumlahnya, maka ikutlah panduan berikut:
  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul THEME OPTIONS > Default Variables > klik Icon Pensil.
  3. Akan muncul jendela konfigurasi Link List, pada kolom New Site Name (Nama Website Baru), masukkan kode commentsSystem.
  4. Pada kolom New Site URL (URL Website Baru), masukkan kode blogger, facebook, atau disqus.
  5. Jika sudah, klik tombol Add Link (Tambahkan Link).
  6. Terakhir, klik tombol Save (Simpan).

Catatan:
  • Jika kalian ingin menggunakan Comment System Facebook, kalian harus mengatur Facebook SDK.
  • Jika kalian ingin menggunakan Comment System Disqus, kalian harus mengatur Shortname Disqus.

Mengatur Shortname untuk Disqus

Jika kalian menggunakan Comment System Disqus, maka kalian wajib mengatur bagian ini. Jika tidak, kalian bisa melewatinya. Ikutilah panduan berikut:
  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul THEME OPTIONS > Default Variables > klik Icon Pensil.
  3. Akan muncul jendela konfigurasi Link List, pada kolom New Site Name (Nama Website Baru), masukkan kode disqusShortname.
  4. Pada kolom New Site URL (URL Website Baru), masukkan Shortname Disqus yang telah kalian buat sebelumnya.
  5. Jika sudah, klik tombol Add Link (Tambahkan Link).
  6. Terakhir, klik tombol Save (Simpan).

Catatan:
  • Kami tidak mendukung Comment System Facebook dan Disqus karena tidak dapat menampilkan jumlah komentar pada bagian Homepage/Multiple Page. Jadi, saya sarankan agar kalian menggunakan Comment System Default (Blogger) karena kami sudah memperbarui versinya.

Mengatur CSS Options

Untuk saat ini, CSS Options bisa kalian gunakan untuk mengatur Garis Batas (Border) pada daftar Menu Sidebar (Navigation Drawer).

Membuat Garis Batas (Border) pada Sidebar Menu (Drawer)

Untuk mengaturnya, ikutilah panduan berikut:
  1. Masuk ke Blogger > Layout (Tata Letak).
  2. Cari Section yang berjudul THEME OPTIONS > CSS Options > klik Icon Pensil.
  3. Akan muncul jendela konfigurasi Link List, pada kolom New Site Name (Nama Website Baru), masukkan kode menuBorder.
  4. Pada kolom New Site URL (URL Website Baru), masukkan angka dimana pembatas tersebut akan ditampilkan. Contoh, saya ingin membuat Pembatas pada Menu ketiga, maka disini saya harus mengisi nilainya dengan angka 3.
  5. Jika sudah, klik tombol Add Link (Tambahkan Link).
  6. Terakhir, klik tombol Save (Simpan).

Catatan: Untuk membuat beberapa pembatas, kalian dapat mengulangi tahap diatas sebanyak beberapa kali.

Pengaturan Theme Designer

Terdapat pengaturan lain yang sangat mudah untuk digunakan yaitu Theme Designer. Disini, kalian dapat mengatur Warna, Mengaktifkan/Menonaktifkan beberapa Fitur Premium, dll. Untuk mengaturnya, kalian dapat mengikuti panduan berikut:

Mengaktifkan/Menonaktifkan Fitur eCommerce

Defaultnya, Fitur eCommerce tidaklah aktif. Untuk mengaktifkannya, ikutlah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Premium Features.
  3. Pada Slider Enable eCommerce, geser ke kanan sehingga nilainya menjadi 1px.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan:
  • Slider: 1px = aktif, 0px = nonaktif.
  • Dokumentasi tentang Fitur eCommerce akan dijelaskan pada artikel terpisah.

Mengaktifkan/Menonaktifkan Fitur Syntax Highlighter

Fitur ini berfungsi untuk postingan tentang Coding agar kode yang ditampilkan dapat memiliki Style dan bahasa atau markup dari Kode tersebut akan terdeteksi secara otomatis. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Premium Features.
  3. Pada Slider Enable Syntax Highlighter, geser ke kanan sehingga nilainya menjadi 1px.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan:
  • Slider: 1px = aktif, 0px = nonaktif.
  • Untuk menggunakannya, kalian dapat melihat bagian tentang Post Shortcode.

Mengaktifkan/Menonaktifkan Fitur Sticky/Fixed Sidebar

Fitur ini berfungsi untuk membuat Sidebar menjadi Sticky/Fixed. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Feature Options.
  3. Pada Slider Fixed Sidebar, geser ke kanan sehingga nilainya menjadi 1px.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan: Slider: 1px = aktif, 0px = nonaktif.

Mengaktifkan/Menonaktifkan Thumbnail di Posisi Kanan/Kiri

Fitur ini berfungsi untuk membuat Thumbnail menjadi di posisi kiri/kanan. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Feature Options.
  3. Pada Slider Right Thumbnails, geser ke kanan untuk membuat Thumbnail di posisi kanan atau geser ke kiri untuk membuat Thumbnail di posisi kiri.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan:
  • Slider: 1px = Thumbnail posisi Kanan, 0px = Thumbnail posisi Kiri.
  • Jika kalian mengaktifkan Fitur Grid, maka kalian harus mengatur Slider menjadi 1px.

Mengaktifkan/Menonaktifkan Menu Sidebar (Navigation Drawer)

Fitur ini berfungsi untuk membuat Navigation Drawer menu dapat terbuka/tertutup ketika Blog kalian di buka pertama kali. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Feature Options.
  3. Pada Slider Hide Side Navigation for First Load, geser ke kanan untuk mengaktifkan atau geser ke kiri untuk menonaktifkan.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan: Slider: 1px = aktif, 0px = nonaktif.

Mengaktifkan/Menonaktifkan Layout Grid

Fitur ini berfungsi untuk membuat Layout menjadi Grid/List. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Feature Options.
  3. Pada Slider Enable Grid Layout, geser ke kanan untuk mengaktifkan atau geser ke kiri untuk menonaktifkan.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan:
Slider: 1px = aktif/Layout Grid, 0px = nonaktif/Layout List.
Jika kalian mengaktifkan Fitur ini, maka kalian harus menonaktifkan fitur Right/Left Thumbnail.

Mengaktifkan/Menonaktifkan Pre Loader

Fitur ini berfungsi untuk menampilkan/menyembunyikan animasi Loading di bagian Header. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Feature Options.
  3. Pada Slider Enable Loader, geser ke kanan untuk mengaktifkan atau geser ke kiri untuk menonaktifkan.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan: Slider: 1px = aktif, 0px = nonaktif.

Mengaktifkan/Menonaktifkan Fitur Dark Mode

Fitur ini berfungsi untuk menampilkan/menyembunyikan fitur dan tombol Dark Mode. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Feature Options.
  3. Pada Slider Enable Toggle Dark Mode, geser ke kanan untuk mengaktifkan atau geser ke kiri untuk menonaktifkan.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan: Slider: 1px = aktif, 0px = nonaktif.

Mengaktifkan/Menonaktifkan Versi Comment System Blogger Terbaru

Fitur ini berfungsi untuk membuat Comment System Bawaan Blogger menjadi versi terbaru. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Feature Options.
  3. Pada Slider New Blogger Comments System, geser ke kanan untuk mengaktifkan atau geser ke kiri untuk menonaktifkan.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan: Slider: 1px = aktif, 0px = nonaktif.

Mengaktifkan/Menonaktifkan Jumlah Komentar

Fitur ini berfungsi untuk menampilkan jumlah komentar pada Homepage. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Feature Options.
  3. Pada Slider Show Add Comments Text, geser ke kanan untuk mengaktifkan atau geser ke kiri untuk menonaktifkan.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan: Slider: 1px = aktif, 0px = nonaktif.

Mengaktifkan/Menonaktifkan Breadcrumb

Fitur ini berfungsi untuk menampilkan/menyembunyikan Breadcrumb. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Post Options.
  3. Pada Slider Show Post Breadcrumbs, geser ke kanan untuk mengaktifkan atau geser ke kiri untuk menonaktifkan.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan: Slider: 1px = aktif, 0px = nonaktif.

Mengaktifkan/Menonaktifkan Tombol Share dibawah Nama Author

Fitur ini berfungsi untuk menampilkan/menyembunyikan Tombol Share dibawah Nama Author. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Post Options.
  3. Pada Slider Show Share Buttons Before Post Content, geser ke kanan untuk mengaktifkan atau geser ke kiri untuk menonaktifkan.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan: Slider: 1px = aktif, 0px = nonaktif.

Mengaktifkan/Menonaktifkan Tombol Navigasi Postingan

Fitur ini berfungsi untuk menampilkan/menyembunyikan Tombol Navigasi Postingan di bawah kolom komentar. Untuk mengaktifkan/menonaktifkannya, ikutilah beberapa tahap berikut:
  1. Masuk ke Blogger > Theme (Tema) > Customize.
  2. Pilih menu Advanced > Post Options.
  3. Pada Slider Show Post Bottom Navigation, geser ke kanan untuk mengaktifkan atau geser ke kiri untuk menonaktifkan.
  4. Jika sudah, klik tombol Apply to Blog (Terapkan pada Blog).

Catatan: Slider: 1px = aktif, 0px = nonaktif.

Pengaturan Lainnya

Pada bagian Theme Designer, kalian dapat mengatur hal lain seperti mengatur jenis Font, Warna Keseluruhan, Warna Header, Warna Navigation Drawer, Warna Body, Warna Post, Warna Utama, Warna Footer, Warna Widget, dan Warna Tombol dengan mudah.

Menggunakan Post Shorcode

Shortcode untuk Post yang tersedia adalah Alert: Warning, Info, Success, dan Error, Contact Form, Tombol, dan Code-Box/Syntax Highlighter.

Shortcode Alert

Alert Warning

Berikut adalah cara untuk membuat Alert Warning:

Alert Warning

Alert Info

Berikut adalah cara untuk membuat Alert Info:

Alert Info

Alert Error

Berikut adalah cara untuk membuat Alert Error:

Alert Error

Alert Success

Berikut adalah cara untuk membuat Alert Success:

Alert Success

Shortcode Tombol

Berikut adalah cara untuk membuat tombol:

Shortcode Tombol

Shortcode Code Box/Syntax Highlighter

Berikut adalah cara untuk membuat Code Box/Syntax Highlighter:

Shortcode Code Box/Syntax Highlighter

Shortcode Contact Form

Berikut adalah cara untuk membuat Contact Form:

Shortcode Contact Form

0 Komentar