| Portal berita | Technologi Information |
Teknik Komputer |

Thursday, June 28, 2012

On 11:19:00 PM by Unknown in ,    2 comments
Dipostingan kali ini saya akan share tentang cara membuat Simple Navbar pada blog. untuk demonya Seperti Ini . Bagaimana, Member P.I.C tertarik untuk mencobanya di blog Member P.I.C. silahkan ikuti tutorial berikut :

Berikut langkahnya..
  • Log in ke blogger Member P.I.C
  • Masuk ke Template > Edit Html
  • Tekan Ctrl + F, lalu cari kode ]]></b:skin>
  • Setelah ketemu copy code dibawah ini lalu letakkan di atas kode           ]]></b:skin>
#DADnavbar{
font-family: Comic Sans Ms;
font-size: 11pt; color: white;
background:url(/favicon.ico) no-repeat center left fixedblack;
border: 1px solid red;
padding: 3px;
z-index: 100000000;
top: 1px; left: 1px; right: 1px;
position: fixed;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-o-border-radius: 10px;

}
#DADnavbar .dmnavleft{float:left;font-weight:bold;padding:2px 10px;}
#DADnavbar .dmnavright{float:right;padding:0px 2px;}

  • Kemudian cari lagi kode </body>
  • Dan lalu copy lagi kode di bawah ini dan letakkan diatas code </body>
<div id='DADnavbar' style='position:fixed;'>
<span class='dmnavleft'>
GANTI TEXT INI DENGAN KATA KATA-KATA MEMBER P.I.C SENDIRI (isi navbar sebelah kiri)
</span>
<span class='dmnavright' style='font-family:verdana;'>
GANTI TEXT INI DENGAN KATA KATA-KATA MEMBER P.I.C SENDIRI atau widget lain (untuk isi navbar sebelah kanan)
</span></div>

Bila Member P.I.C ingin mengeditnya, silahkan lihat keterangan berikut.
  • Ganti yang berwarna emas dengan font yang Member P.I.C inginkan.
  • Ganti yang berwarna pink dengan ukuran font yang Member P.I.C inginkan.
  • Ganti yang berwarna kuning dengan warna teks yang ada di navbar dengan warna sesuka Member P.I.C.
  • Ganti yang berwarna coklat dengan warna background navbar yang Member P.I.C inginkan.
  • Ganti yang berwarna merah dengan ukuran, style, dan warna border / garis tepi sesuka Member P.I.C sendiri. Jangan nanya cara gantinya gimana, cari di Google.
  • Untuk yang berwarna hijau, top itu artinya, nanti navbar Member P.I.C akan melayang sisi atas. Jika  Member P.I.C  ingin memindahkan navbar  Member P.I.C  agar tampil di sisi bawah browser, tinggal ganti saja dengan bottom.
  • Untuk kode yang ditulis miring, itu pengaturan untuk garis meengkung di setiap sudut navbar  Member P.I.C . Jika  Member P.I.C  ingin sudut navbar  Member P.I.C  tetep runcing, atau bentuk navbarnya tetap persegi (gak pakai melengkung) maka tinggal hapus saja kode tersebut.
  • Ganti yang berwarna orange dengan teks / kata-kata atau apalah yang ingin  Member P.I.C  masukkan ke dalam navbar  Member P.I.C . Terserah apa saja boleh asal muat 

Selamat mencoba, dan semoga bermanfaat....

Silahkan Di Share Jika Bermanfaat, tapi jangan lupa sertakan Sumbernya
Ikuti kiriman artikel-artikel seputar Komputter, Hacking, Editing, Blogging dengan mengirimkan email anda untuk berlangganan artikel kami. Enter your email address:


Delivered by FeedBurner

2 comments:

Catatan:
• Dilarang menulis link aktif !
• Dilarang ngiklan di kolom komentar !
• Untuk menyisipkan kode, gunakan tag <i rel="code">... KODE ...</i>
• Untuk menyisipkan kode panjang, gunakan tag <i rel="pre">... KODE ...</i>
• Untuk menyisipkan catatan, gunakan [catatan].. TEKS ...[/catatan]
• Untuk menyisipkan gambar, gunakan [img]URL GAMBAR[/img]>