cssdockmenu etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
cssdockmenu etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster

Blogger Css Dock Menu Tasarımı

| | Comments

Evet yeni bir Ajax uygulamasının bloggere uyarlanması işlemiyle karşınızdayım. Önceki yazımızda köşeden açılan reklam yani pageear yapımını anlatmıştık. Bu yazımızda ise Css Dock Menü'nün blogger alt yapısında nasıl kullanılabileceğini uygulamalı olarak anlatacağız. Css Dock Menünün ne olduğunu veya nasıl göründüğünü merak ediyorsanız burayı ziyaret edin!.. 

1. Öncelikle buradan üzerinde çalışacağımız dosyaları indirelim. Dosyayı indidikten sonra images klasörü içindeki resimlerin hepsini herhangi bir resim barındırma sitesine veya googlepagesinize yükleyin.

2. Ardından stlye dosyasını Notepad ++ ile veya herhangi bir metin editörü ile açarak url(images/main-bg.gif)şeklinde olan yerlere yüklediğiniz resim dosyasının linkini kopyalayın. Örnek olarak url(http:www.test.googlepages.com/images/main-bg.gif) vb. gibi... Resim linklerini kpyaladıktan sonra dosyayı kaydedin.

3. Şimdi stlye.css , iepngfix , interface.js , jquery.js dosyalarını googlepagesinize veya alternatif bir siteye yükleyin.

4. Artık blogumuza entegre işlemine geçebiliriz. Şimdi HTML düzenleme moduna geçiyoruz. Öncelikle herhangi bir sorunla karşılaşmamak için temamızın bir yedeğini alıyoruz. Şablonu genişlet diyerek işlemimize başlayalım.
5. <head> kodunun hemen altına


<script src='http://denemeler.weebly.com/uploads/1/1/4/2/1142610/jquery.js' type='text/javascript'/> <script src='http://denemeler.weebly.com/uploads/1/1/4/2/1142610/interface.js' type='text/javascript'/> <link href='http://denemeler.weebly.com/uploads/1/1/4/2/1142610/style.css' rel='stylesheet' type='text/css'/> <!--[if lt IE 7]> <style type="text/css"> .dock img { behavior: url(http://denemeler.weebly.com/uploads/1/1/4/2/1142610/iepngfix.htc) } </style> <![endif]-->  
<style>

kodunu kopyalıyoruz. Yukarıdaki kod içindeki dosya bağlantılarını kendi yüklediğimiz dosyaların bağlantıları ile değiştiriyoruz.

6. <body> kodunun hemen altına bu kodu kopyalıyoruz. Burası işlemlerimizin son aşamasıydı artık buradaki ikonları ve bağlantıları kendi isteğinize göre düzenleyebilirsiniz. Temanızı kaydetmeden önce önizleme yaparak işlemleri doğru yapıp yapmadığınızdan emin olabilirsiniz. Her temada aynı düzende görünmeyebilir.


Css Dock Menünün bloggere uygulanması biraz zahmetli ama yine de çok zor değil takıldığınız bir yer olduğunda yorum yaparak sorununuzu / isteğinizi açıkça belirtirseniz elimden geldiğince yardımcı olmaya çalışırım.

Yazan : TeknoMobi Editörü
Not : Eğer bu yazıyı kendi siteniz veya blogunuzda yayınlamak isterseniz yazınızın altında TeknoMobi ve yazının tam linkini vermelisiniz.