Menu

Blogger Sarı Beyaz Navigation Menü Widget

Blogger için hazırlanmış olan bu navigasyon menü HTML ve CSS kullanılarak oluşturulmuştur.Blogger için hazırlanmış olan Sarı Navigasyon Menüde görüntüler akordeon şeklinde ayarlanmıştır.Bu menü ile kolay bir şekilde kategorilerden oluşturduğunuz etiket bağlantılarını ekleyebilirsiniz.

Eklentiyi kullanmak çok kolaydır JavaScript gedget ekleyerek menümüzü kullanabiliriz ayrıca HTML ve CSS kodlarını birbirlerinden ayırarak ta kodlarınızın içinde kullanabilirsiniz.

Blogger Sarı Beyaz Navigation Menü Widget

---Facebook Çizgifilim Animasyon Kapak Resimleri 8 Adet

---Google den Para Nasıl Kazanılır

---Blogger Film Temaları 2 Adet

Aşağıda verdiğim kodu test etmek için kodların tamamını kopyalayınız ve SEO Mektebi Kod Deneme Editörü ne ekleyiniz ve Kod Testi butonuna basınız açılan yeni sayfada kodun uygulamasını görürsünüz.

Blogger Sarı Beyaz Navigation Menü Widget

Blogger Sarı Beyaz Navigation Menü Widget Yükleme Adımları

İlk önce Blogger.com giriş yapınız sonra Yerleşim/Gedget Ekle/ HTML/JavaScript adımlarını takip ediniz.

HTML/JavaScript tıkladıktan sonra aşağıdaki kodu kopyalayarak resimdeki gibi boşluğa yapıştırınız, Blogger Sarı Beyaz Navigation Menü Widget site tasarımınıza uygun olarak istediğiniz yere ekleyebilirsiniz.


<style type="text/css">
#menu6 ul {
list-style:none;
font-family: "Trebuchet MS", sans-serif;
font-size: 28px;
font-weight: bold;
letter-spacing: -1px;
line-height: 1.1em;
float:left;
clear:both;
margin:20px;
border:4px groove #ffe430;
}
#menu6 ul li{
float:left;
}
#menu6 ul li a{
display:block;
text-decoration:none;
padding:10px 10px 5px 10px;
color:#fff;
background-color:#ffc730;
width:170px;
}
#menu6 ul li a span{
display:block;
}
#menu6 ul li a span.title{
border-bottom:2px solid #ffc730;
}
#menu6 ul li a:hover{
background-color:#fff;
}
#menu6 ul li a:hover span.title{
color:#ffc730;
border-bottom:2px solid #ffe430;
}
#menu6 ul li a span.text{
padding:0px 5px;
font-family: Helvetica, Arial, sans-serif;
font-size: 14px;
font-style: italic;
font-weight: normal;
letter-spacing: normal;
line-height: 1.4em;
background-color:#ffc730;
visibility:hidden;
color:#fff;
}
#menu6 ul li a:hover span.text{
visibility:visible;
}
</style>
<div id="menu6">
<ul>
<li><a href="">
<span class="title">About</span>
<span class="text">Who we are</span>
</a>
</li>
<li><a href="">
<span class="title">Portfolio</span>
<span class="text">What we do</span>
</a>
</li>
<li><a href="">
<span class="title">Blog</span>
<span class="text">What we talk about</span>
</a>
</li>
<li><a href="">
<span class="title">Contact</span>
<span class="text">How to get in touch</span>
</a>
</li>
</ul>
</div>


Blogger Sarı Beyaz Navigation Menü Widget Düzenleme:

Yayınladığımız bu eklentiler içinde ki renk kodları #XXXX şeklinde olan kodlardır bunları aşağıdaki SEO Mektebi renk kodları sayfasından istediğiniz renkleri seçerek ekleyebilirsiniz.

SEO Mektebi CSS Renk Kodlarına Buradan Ulaşabilirsiniz

Ayrıca eklentiler içindeki sayısal değerlerle oynayarak site tasarımına uygun olan ölçüleri sağlayabilirsiniz.


Sonraki Yazılar
« Prev Post
Önceki Yazılar
Next Post »

Henüz Yorum Yapılmamış " Blogger Sarı Beyaz Navigation Menü Widget "

Önerilen Yazı
×