Cara Mengonfigurasi Header dan Bilah Navigasi

Masuk ke Dashboard Blogger > pilih menu Tata Letak.

Cari bagian yang berjudul Header Logo and Title.

Klik tombol edit (ikon pensil) di Gadget Header (Gadget Header Halaman).

Akan muncul pop-up konfigurasi Header.

Pada kolom Judul Blog, masukkan nama blog Anda.

Di bidang Deskripsi Blog, masukkan deskripsi blog Anda.

Di bagian Gambar, ada dua Opsi. Pilih antara Masukkan URL gambar atau Upload gambar dari komputer. Berikut penjelasannya:

• Masukkan URL gambar: Anda harus menempelkan URL gambar yang diunggah ke bidang URL Gambar. Contoh: https://blogger.googleusercontent.com/img/a/AVvXsEikvUhbyLLGRdV7RwW2wZ6nODIfx1TgMpMdx-QK6nAvNc9cB8Ty4FcuEJhXecLRzts8A34zYkkJgIs7jOfHD8msew9eDt_RbVKABkJfHJz4HeEf7Q-2m4R2oEKQNH4czBw9cbR7_KK0Q14aw-T0iBVslR-LEqcTjJEbfYv1Vhad8l3o5BRLul_jP43Ai4B2=w640
• Upload gambar dari komputer: Anda perlu mengunggah gambar baru dari komputer Anda dengan mengeklik tombol Jelajahi dan pilih gambar logo yang ingin Anda gunakan.
• Setelah diatur semua klik tombol SIMPAN di sampingnya.

NB: Jika ingin hanya menampilkan Gambar saja tanpa ada teks Judul & Deskripsi. Berikut penjelasannya:

• Masukkan URL gambar: Anda harus menempelkan URL gambar yang diunggah ke bidang URL Gambar. Contoh: https://blogger.googleusercontent.com/img/a/AVvXsEi73YGUr_hh2jEnvnVBTyQ582iI9rKXH3UBtkUF6ohAD8EfbPXXrvOH9B4FL_AnoermVPLd2kXKJ4k3zVzFOUkyMGhGvZYiPyucPAn7N-8jyKsh5I7T_uJO99wJXsakcHUo5Z7MG5pZaiYdXEFFHmxp1AcmJnWRRCxOQezXN7FA0IILipU4YN06jfBMUDI4=s179
• Upload gambar dari komputer: Anda perlu mengunggah gambar baru dari komputer Anda dengan mengeklik tombol Jelajahi dan pilih gambar logo yang ingin Anda gunakan.
• Penempatan Gambar: biarkan default atau tetap pada Di balik judul dan deskripsi
• Aktifkan pada bagian tombol switch Susutkan agar sesuai (Opsional).
• Setelah diatur semua klik tombol SIMPAN di sampingnya.
• Selesai, kemudian Lanjut ke Cara menampilkan hanya Gambar Logo untuk pengaturan CSS.

Setelah semua dikonfigurasi klik tombol SIMPAN.

Selesai

Customasi Tambahan: Selanjutnya perlu menambahkan kode CSS letakkan diatas kode ]]></b:skin>. Berikut penjelasannya:

• Masuk ke Dashboard Blogger > pilih menu Tema.
• Klik Ikon Dropdown (Ikon Panah Bawah yang ada di sebelah tombol Sesuaikan).
• Pilih menu Edit HTML.
• Akan muncul tampilan format Edit HTML Tema.
• Pada kolom Edit HTML tekan CTRL + F. cari kode ]]></b:skin> dan pastekan diatasnya kode CSS berikut:
  

  .mstore_header .header_widget_start img{width:auto!important;max-width:130px;}.mstore_header .header_widget.behindImageStyle{display:block!important!}.header_widget_end{display:none;}

• Setelah semuanya dikonfigurasi, klik tombol ikon SIMPAN di sebelah pojok kanan atas.
• Selesai

Masuk ke Dashboard Blogger > pilih menu Tata Letak.

Cari bagian yang berjudul Blog Notification.

Klik tombol edit (ikon pensil) di Notification Button.

Akan muncul pop up konfigurasi Widget.

Pada kolom Judul, isikan sesuai keinginan (Opsional).

Pada kolom Caption, isikan dengan deskripsi notifikasi Anda.

Pada kolom Link, isikan dengan URL/Link beranda atau tujuan notifikasinya.

Di bagian Gambar, ada dua opsi. Pilih antara Masukkan URL gambar atau Upload gambar dari komputer. Berikut penjelasannya:

• Masukkan URL gambar: Anda harus menempelkan URL gambar yang diunggah ke bidang URL Gambar. Contoh: https://blogger.googleusercontent.com/img/a/AVvXsEhWk1R4OEs6RhHeAK0W9UriRLlzOLBSeqaAbMPJ6J9IHmy-LVCC-XL1kn1gUCBBC0aibGSQQcmHna6uFvw2JZr2OmSSrcRj1LrOqIyRd1v7WyiGnFg0VsJDndSXApxaYyUdDTjw_Kbkx51e_QCELcnsBh7jp0Z20MdcHoRxGNfveY9dMqjwF4ti_XE6cs2p=s1440
• Upload gambar dari komputer: Anda perlu mengunggah gambar baru dari komputer Anda dengan mengeklik tombol Jelajahi dan pilih gambar banner yang ingin Anda gunakan.
• Aktifkan pada bagian tombol switch Susutkan agar sesuai (Opsional).

Aktifkan pada bagian tombol switch Tampilkan widget ini.

Setelah semuanya dikonfigurasi, klik tombol SIMPAN di bagian bawah.

Masuk ke Dashboard Blogger > pilih menu Tata Letak.

Cari bagian yang berjudul Header Widgets Home.

Klik tombol edit (ikon pensil) di Header Bottom Widget (Homepage).

Akan muncul pop-up konfigurasi Header.

Pada kolom Judul Blog, isi sesuai keinginan (Opsional).

Di bidang Konten Blog, ubah teks sesuai keinginan.

Contoh bagian yang perlu di ubah. Berikut penjelasannya:

• Tag HTML welcome_title: Selamat datang di website MStore Theme v1.0 ubah sesuai selera. Contoh:
  <div class="welcome_title">Selamat datang di website MStore Theme v1.0</div>
• Tag HTML welcome_description: Dapatkan kemudahan dengan memiliki blog dan toko online dalam satu tampilanubah sesuai selera. Contoh:
  <div class="welcome_description">Dapatkan kemudahan dengan memiliki blog dan toko online dalam satu tampilan.</div>
• Tag HTML mstore_button & welcome_logo: Jelajahi Sekarang / MTS ubah sesuai selera. Contoh:
  <a class="mstore_button small filled fwm rounded" href="#!">Jelajahi Sekarang</a>
  bagian yang di tebalkan #! biarkan pada default atau bisa ganti link target ketika di klik.
  <div class="welcome_logo">MST</div> bagian yang di tebalkan MST ubah sesuai keinginan
• Setelah diatur semua klik tombol SIMPAN di sampingnya.

Setelah semua dikonfigurasi klik tombol SIMPAN.

Selesai