Cara Seting & Modifikasi Template New Johny Wuss

CB Blogger | January 07, 2015

Cara Seting & Modifikasi Template New Johny Wuss (NJW).


New Johny Wuss
TAMPILAN blog demo template NJW yang SEO Responsive dan Fast Loading ini sedikit berbeda dengan tampilan sebelumnya yang serba hitam elegan! Ada sedikit modifikasi soal warna, biar tidak monoton hitam.

Sentuhan warna di template seo friendly & responsive ini akan mempercantik tampilan. Dalam tampilan baru ini ada latar belakang (background) warna merah di menu HOME.

Selain itu, warna latar Featured Post juga "membiru", mirip birunya jersey Persib Bandung. Maklum, admin adalah bobotoh Persib Nu Aing! :) The most popular football club di the world! (Update: kini jadi runner up, Barcelona nomor 1).

Back to... NJW!
Template Blog New Johny Wuss
Tampilan Baru Blog Demo NJW.*

Background footer juga admin ubah menjadi warna asli dan khas template Johny Wusss: Biru! Jadi, dikembalikan ke asalnya atau aslinya.

CARA MODIFIKASI TEMPLATE NJW
Dominasi warna hitam bisa diubah menjadi warna apa saja sesuai dengan selera Anda. Tapi disarankan, jangan terlalu banyak warna, cukup misalnya hitam, biru, dan merah. Hitam elegan. Biru Persib & Chelsea. Merah? Glory Glory Manchester United!

Bagaimana caranya? Ini dia modifikasi yang dilakukan terhadap blog demo NJW. Masuk dulu ke template ya: "Template" > "Edit HTML"

1. Latar HOME Warna Merah.
Tambahkan kode ini di jajaran CSS Code #menu

#menu a.home {background: #c00;}

Ubah pula HTML menunya di jajaran kode "menu"

<li><a href='/'>Home</a></li>

diubah menjadi:

<li><a class='home' href='/'>Home</a></li>

2. Warna Latar Featured Post
Temukan kode #featured post dan ganti kode warna #000 menjadi #0066B3 atau warna lain. (Daftar Kode Warna HTML).

#featuredpost {background:#0066B3;float:left;.... dst}

3. Wara Latar Footer
Temukan kode #credit{background:#000; dan ubah menjad menjadi

#credit{background:#0a2e56;

Itu dia modifikasi template NJW dari sisi warna.

MENGUBAH UKURAN THUMBNAIL IMAGE
Ada juga yang bertanya, bagaimana caranya memperbesar gambar di homepage? Yang ukuran 72x72 Pixel itu.

Disarankan, jangan diperbesar!!! Biar kan apa adanya. "Let it be," kata The Beatle mah. Soalnya, itu akan mempengaruhi loading blog, tambah berat nanti!

Ukuran 72 Pixel Thumbnail Gambar di Home itu standar yang sudah ditentukan oleh Google/Blogger sebagai ukuran thumbnail terbaik di homepage, biar ringan!

CARA SETTING MENU NJW
Masih banyak pengguna template New Johny Wuss ini yang bertanya soal cara mengubah daftar menu navigasi. Itu lho... HOME, ABOUT, dsb.

Caranya: Template > Edit HTML dan temukan kode <nav id='menu'> seperti di bawah ini. Ganti linknya (tanda #) dengan link page/halaman, atau bisa juga permalink posting, juga nama menu-nya. Misalnya, link ABOUT seperti ini: http://newjohnywuss.blogspot.com/p/about.html

<nav id='menu'>
<input type='checkbox'/>
<label>&#8801;<span>Navigation</span></label>
<ul>
<li><a class='home' href='/'>Home</a></li>
<li><a href='#'>About</a></li>
<li><a href='#'>Sitemap</a>

dan seterunya...

Demikian cara modif template NJW dari sisi warna plus cara setting navigasi menu-nya. Panduan lain ada di posting sebelumnya: New Johny Wuss - Best SEO, Fast, Responsive Blogger Template.*

Previous
« Prev Post

Related Posts

19 komentar on Cara Seting & Modifikasi Template New Johny Wuss

  1. makasih informasinya gan

    ReplyDelete
  2. gan CB ane boleh make ni template ga? (http://newjohnywuss.blogspot.com) tetep ane kasi credit agan kok.. boleh gak nieee.....:D

    ReplyDelete
    Replies
    1. ini template memang gratis, silakan, thanks for not removing credit link footer.....

      Delete
  3. gan mau nanya cara buat Widget diatas credit yang "skor seo 100, New from CB, CB magazine, Sepakbola magz" itu bagaimana??? minta diberikan tutorial tersendiri gan....saya mau gunakan tmplate tapi kok dicoba ga bisa....

    ReplyDelete
    Replies
    1. Anda tidak gunakan template NJW ini, jadi silakan tanyakan ke desainer template yang Anda gunakan

      Delete
  4. Punya saya kok halaman utamanya ada ruang ruang kosong ya, Om?
    Itu gimana ngebenarinnya?

    Sekalian ijin pake templatenya, Om.

    ReplyDelete
    Replies
    1. Baca dong panduannya:
      http://newjohnywuss.blogspot.com/2014/03/new-johny-wuss-seo-fast-and-responsive.html

      Delete
    2. Makasih Om

      Kurang baca aja saya...

      Delete
  5. Sama gan pnya ane juga ada space kosong di homepagenya sebelah atas daftar postingan, itu ngisinya gimana? kalo punya masnya kan halaman kosong itu isinya posting yg ukurannya aga gedean, cara biar kaya gitu gimana bang?

    ReplyDelete
    Replies
    1. http://newjohnywuss.blogspot.com/2014/03/new-johny-wuss-seo-fast-and-responsive.html

      Delete
    2. Buat mas admin trimakasih atas pencerahannya >.< sya yg anonimus diatas
      thxs postingan agan yg ini
      http://newjohnywuss.blogspot.com/2014/04/dua-kesalahan-blogger-yang-sering.html
      membuat saya sadar dari kehilafan saya, sudah tak balikin ke aselinya ko gan
      makasih, sukses buat agannya

      Delete
  6. Punyaku kok diatas postingan ada lahan kosong ya? Caranya biar ada isinya gimana mas.? :)

    ReplyDelete
  7. cara nambah kotak search kyk diblog ini gmana gan?

    ReplyDelete
    Replies
    1. Coba kamu googling. Cara menambah kotak pencarian di Blog.

      Delete
  8. bingun gan, cara untuk merubah warna background di home page itu gimana? pingin ngubah dari hitam ke putih.

    ReplyDelete
  9. Knp saya search menggunakan site:(bloganda) dan (kata kunci ) gak nampil, template ini malah malah saya search site:"blog anda" nampil judul blog dan best seo... gak ada judul postingannya

    ReplyDelete
  10. tampilan di hp ko kaya belum resvonsive beda dengan versi web?

    ReplyDelete

 
Copyright © 2020. New Johny Wuss - All Rights Reserved
Template by CB Blogger & Maskolis