Search here

Type a word related to the post, then click the search button !

Memuat...
English
Bru masuk angin!

Arsip...

Flag Counters

Flag Counter

Pengikut

Recent Comments plus Kode CSS Box Gelap

Recent Comments

blog-indonesia.com

Vertical Menu

CLICK any categories for open!
Gubhug Reyot

Sobat Ngeblogh

Sobat Ngeblogh

Buat sobat blogger yang mau ikutan jadi follower silahkan KLIK link Follower (Follow) di ujung kanan-bawah. Dari hasil monitoring, ternyata yang link-nya telah dimasukkan ke "Sobat Ngeblogh" mengalami pertambahan pengunjung secara signifikan!
Terima kasih .: Salam :.
gubhug reyot

Tampilkan Navbar Blogger di Halaman Bawah Blog

Melihat navbar blogger di blog pada ujung teratas adalah hal yang lumrah karena posisi yang disediakan oleh desain templatenya memang di situ. Melihat blog tanpa navbar juga bukan lagi barang aneh karena memang bisa tidak ditampilkan (dihilangkan). Bagaimana seandainya navbar ini tetap kita tampilkan atau kita manfaatkan namun posisinya kita pindah di halaman terbawah blog. Navbar kita buat selalu terlihat biar halaman digulung naik ataupun turun, tetapi dibuat terlihat samar-samar (transparan) dan baru tampak jelas ketika tersentuh cursor? Biar sedikit efek membuat tampilan navbar lebih cantik, bagaimana kalau kode CSS3 kita dayagunakan? Lebih menarikkan blog jadinya? Bagaimana kalau kita coba saja dan lihat hasilnya? Perlu demo? He ... eh .... Sebaiknya nggak usah, ya .... He ... he ... Biar makin penasaran dengan gaya navbar yang sedikit lain dari biasanya ini!

Untuk membuatnya silahkan copy paste kode CSS berikut di atas kode ]]></b:skin>

Kode CSS


#navbar-iframe{
display:block;
position:fixed;
bottom:0;
left:0;
opacity:0.2;
-o-transition:opacity 1s ease-in;
-moz-transition:opacity 1s ease-in;
-webkit-transition:opacity 1s ease-in;
filter:alpha(opacity=20);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
}
#navbar-iframe:hover{
opacity:1.0;
filter:alpha(opacity=100);
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

  • Login ke Blogger.
  • Setelah menuliskan Email Address, Password dan KLIK "Login", maka halaman "Dasboard (Dasbor)" akan terlihat. KLIK "Design/Rancangan".
  • KLIK "Edit HTML".
  • KLIK "Download Full Templates/Download Template Lengkap" untuk back-up templates.
  • Simpan file template di folder PC.
  • Kembali ke "Edit HTML" dan cari kode ]]></b:skin>. Gunakan Ctrl+F untuk mencari kode tersebut supaya lebih mudah dan cepat.
  • Copy-paste kode CSS dan letakkan di atas kode ]]></b:skin>.
  • KLIK "SAVE Templates/Simpan Template".


Keterangan/Catatan:
  • Buka Special Tutorials di menu Accordiaon sebelah kiri untuk mengikuti tutorial cara cepat mencari kode HTML di template dengan Ctrl+F dan untuk mengetahui pentingnya serta cara back-up template.
  • Karena efek opacity telah dipadukan dengan kode CSS3 transition maka desain ini akan terlihat efeknya dengan sempurna hanya di browser yang telah support dengan CSS3. Silahkan download melalui link download browser di menu sebelah kiri di atas spesial tutorials.


Silahkan juga buka Tutorial lain yang sangat menarik dan patut di ikuti sampeyan semua. Akses melalui link di bawah ini :


» Happy Blogging - gubhugreyot «

5 komentar:

  1. Dah saya coba Bos .. namun tidak ada perubahan !!??
    ...mumet2.. mumet boss !!!*&^??$%^&**.. (lagi gk kosen} mikirin THR belum turun. "hahahahaaaa..
    { nanti saya akan coba lagi )
    Trims Boss !!! I Love U :-P

    BalasHapus
    Balasan
    1. Coba lihat kepala (Head Template) Saya, Crut.. marut.. Ada tanda panah terlihat {sebelah kiri paling atas)!!!, tau tuh dari mana asalnya ?? sudah saya Obrak-abrik template (experimen Elemen). sempat.. Blank (ERorr) blog saya. untungnya saya ga lupa..

      ...
      5.KLIK "Download Full Templates/Download Template Lengkap" untuk back-up templates.
      6.Simpan file template di folder PC.
      ...

      harap maklum blogger pemula bos!! heheheheeee ... (mohom sarannya}

      Hapus
    2. @Agung Albani :
      Ada beberapa kesalahan pemasangan kode di template, baik kode css maupun javascript. Tlg jika berkenan berikan alamat email karena jawabannya sangat panjang!
      @liputantutor @Eva Wangi dan semuanya... salam persahabatan & jika masih banyak kekurangan mohon maaf sebesar2nya!

      Salam ...

      gubhugreyot

      Hapus

 
GR | Edited by | gubhug reyot