Blogger Sağa Açılıp Sol Tarafa Gizlenen Navbar Eklentisi


Blogger, Navbar üzerine gelince sağ tarafa açılan, maus çekilince sol tarafta Blog simgesine dönüşen Blogger Navbar eklentisi. Blogger’un varsayılan Navbar eklentisini bilmeyen yoktur. Blogger Navbar Gadget eklentisi yeni kayıt, tasarım, çıkış, kötüye kullanım bildirimi, sosyal paylaşım iconları ve arama penceresi ile oldukça kullanışlı bir araçtır. Ancak blog kullanıcılarını psikolojik olarak tedirgin eden bir eklentidir. Blog kullanıcısının devamlı gözünün önünde bulunması nedeni ile, bu eklenti ya kapatılır yada şablon kodlarından silinerek görülmemesi sağlanır.


Blogunuzu kullanırken Navbar eklentisini görmek istemeyen kullanıcılar için, Navbar gadgetini sol tarafta bir blog simgesine dönüştüren ve devamlı göze çarpmasını engelleyen bir CSS kod eklentisinden bahsetmek istiyorum. CSS kodlarını blogunuza eklediğinizde Navbar gadgetiniz görülmüyor. Bunun yerine sol tarafta sadece Blog simgesini görüyorsunuz. Blogunuzda yeni bir kayıt, tasarım, paylaşım veya çıkmak istediğinizde ise, mausu simge üzerine getirmeniz yeterli oluyor ve Navbar Gadgetinizi yine kullanabiliyorsunuz.

Simge durumundaki Navbarı guney6 test blogumdan inceleyebilirsiniz.


Blogger Navbar Görünümü

Blogger Navbar gadget eklentisini nasıl simge durumuna getirebileceğinizi aşağıda adım adım takip ederek kullanmaya başlayabilirsiniz.

Blogger Navbar’ı simge olarak kullanma :

1. Blogger kumanda paneline giriş yapın.

2. Sırası ile, Şablon → Özelleştir → Gelişmiş → Dikey çubuğu kaydırın, CSS Ekle, penceresine aşağıdaki kodları yapıştırın.
#navbar {
width: 36px;
border-top: 1px solid #888888;
border-right: 5px solid #888888;
position: fixed;
top: 0px;
left: -6px;
background: #fe6602;
border-radius : 0 5px 5px 0;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.2);

-moz-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
-webkit-transition: all 0.3s linear;
transition: all 0.3s linear;

-moz-transition-delay: 1.3s;
-ms-transition-delay: 1.3s;
-o-transition-delay: 1.3s;
-webkit-transition-delay: 1.3s;
transition-delay: 2.5s;

z-index: 10;
}

#navbar:hover {
width: 96%;

-moz-transition: all 0.6s linear;
-ms-transition: all 0.6s linear;
-o-transition: all 0.6s linear;
-webkit-transition: all 0.6s linear;
transition: all 0.6s linear;
}
 

3. Sağ tarafa açılan Navbar penceresi için tarayıcı dikey çubuğu arasında 4 px. boşluk verilmiştir.

4. Bu boşluk tarayıcı dikey çubuğu kullanırken engel yapmaması için verilmiş olup, isterseniz blog ana sayfanıza Navbarın tam oturmasını sağlayabilirsiniz.

Kod penceresinde iken sağ taraftaki dikey çubuğu kaydırın ve kod içinde mavi ile belirtilmiş olan, width: 96%, yazan rakamı 100 olarak değiştirin. Genişliği 100% yaptığınızda Navbar çubuğu blog temanıza tam olarak oturmuş olacaktır.

Bu blogdaki popüler yayınlar

Paint Net ile Resim arka plan Görüntüyü Şeffaf Yapma

Windows 10 Denetim Masası Komutlarına Kısa Yoldan Ulaşma

Windows İşletim Sistemi 32 Bit ve 64 Bit Arasındaki Fark

Blogger Açılır Menü Oluşturma

Facebook Candy Crush Saga Oyunu Çalışmıyor Çözüm

Paint ile Resim Boyutlandırma Seo

Windows 10 ve 8.1’de Oturum Parolasını Kaldırma

Aynur Nur - Acı Kaybımız

Windows Update 80240016 Hatasını Düzeltme

D-Smart Web İnternet Bağlantı Sorun ve Çözüm Ayarları