Kerimsel: gadget

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

Pazartesi, Ocak 24

İdeal bir blog için gerekli her şey

Posted in blog, Blogger ipucu, gadget, widget

Bir blog yazmaya karar verdiniz ve bu blogun öyle sıradan bir şey olmasını istemiyorsunuz. Bunun için karşılaşacağınız en büyük sorunlardan biri ihtiyacınız olan gadgetlerin (widget, ya da eklenti artık ne derseniz) her birini ayrı bir yerde bulmak zorunda kalmanızdır. İşte bu yazının amacı da bu sorunu çözmek ve işinize en çok yarayacak gadgetlere ulaşımınızı sağlamak. Eklenti örneklerini benim sitemde de görebilirsiniz. :)

"Önemli uyarı. Bu değişiklikleri yapmadan önce temanızın bir yedeğini almayı unutmayın."

Alan Adı:

Öncelikle blogunuz için bir alan adı (domain) kullanmak istiyorsanız bunun iki kolay yolu var. İlki Blogger için Google'dan alan ismi almak. Bunu yaptığınızda blogunuzun bu alan adına yönlendirilmesi otomatik şekilde Google tarafından yapılıyor. Nasıl yapılır? Blogger kumanda paneli - Ayarlar - Yayıncılık - Özel Alan burada almak istediğiniz alan adını yazın, uygunluğunu kontrol edin ve satın alın. Bu kadar. :)

İkinci kolay yol ise http://www.isimtescil.net/'ten bir alan adı almak. Bu siteden alacağınız alan isimlerini Blogger'a yönlendirebilmeniz için özel ayar bölümü bulunuyor. Nasıl yapılır? Önce İsimtescil sitesinden alan adınızı satın alın, daha sonra Domainler kısmına gidip Detaylı Yönetim kısmına tıklayın. Açılan sayfada sekizinci sıradaki IP Bazlı Gelişmiş Dns Yönetimi(gmail, blogger, hotmail, msn, özel web server) bölümüne tıklayın. Burada en altta yer alan DNS Kaydı kısmından A Recordu ekle başlığını seçin ve açılan Kayıt kutusuna www yazın, IP kutusuna ise 74.125.93.121 yazın ve kaydedin. Benzer ayarlar için resme bakabilirsiniz. Daha sonra blogger addresine gidin, Blogger kumanda paneli -Ayarlar - Yayıncılık - Özel Alan - Gelişmiş ayarlar kısmında Etki alanınız bölümüne alan adınızı yazın ve kaydedin. Blogunuz yönlendirilmiş olacaktır.

Favicon:

Bu aslında siteleri internet tarayıcılarında temsil eden küçük resimlerdir. Tıpkı benim blogumda olduğu gibi. Herkes bilir ki görsellik insanın daha kolay ilgisini çeker ve sizin de blogunuzu temsil eden bir favicon kullanmanız okuyucunun gözünde bir artı daha almanızı sağlar. Google Chrome'da bir blogger sayfası açtığınızda bu özellik sekteye uğrayabilir, ama bu vereceğim kodla böyle bir sorununuz da olmayacak. Nasıl yapılır? Öncelikle bir resim yükleme sitesine (http://tinypic.com/ gibi) sitenizin logosunu yükleyin. Blogger Tasarım-Html'yi düzenle bölümüne gidip Widget şablonlarını genişlet kısmını işaretleyin. Ardından Ctrl+F yapıp açılan bölüme alttaki kodu yazın.

</head>

Kodu bulunca hemen altına aşağıdaki kodu yapıştırın ve kaydedin, tabi sizin logonuzun adresini ekleyerek:

<link href='sizin logonuzun adresi' rel='shortcut icon' type='image/x-icon'/>

Linkopacity:

Başka sitelerle link değişimi yapmanın en güzel yolu o sitelerin logolarını yayınlamaktır. Ancak logolar rengarenk olacağından okuyucuların gözünü alabilir. Bunun önüne geçmenin yolu da linkopacity ile mümkün. Bu özelikle logolar saydamlaşacak ve fare imleci ile üzerine gelindiğinde orjinal hali görünecektir. Nasıl yapılır? Öncelikle Blogger Tasarım-Html'yi düzenle bölümüne gidip Widget şablonlarını genişlet kısmını işaretleyin ve Ctrl+F ile bu kodu bulun:

]]></b:skin>

Kodu bulunca hemen üstüne aşağıdaki kodu yapıştırın ve kaydedin:

a.linkopacity img{filter:alpha(opacity=50); -moz-opacity: 0.5; opacity: 0.5;} a.linkopacity:hover img{filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0;}

Bundan sonra bu özelliği kullanmak istediğiniz resimlerin kodlarının içinde linkopacity ibaresini eklemeniz gerek, bu ibareyi kodların arasına eklerseniz resimler saydam olacaktır:

<a href=http://www.kerimsel.com/p/iletisim.html target="_blank" class="linkopacity"><img src="sizin logo adresiniz" border="0" class="linkopacity" title="Link Değişimi!" width="28" height="28" /></a>

Benzer yazılar:

Yazdığınız konuların altında benzer yazıların görünmesi okuyucuların sitenizde daha fazla zaman geçirmesini sağlayacaktır. Benzer yazıları sitenize eklemenin en iyi yolu da Linwithin. Üstelik yazıların üzerinde resimler de yer alıyor. Nasıl yapılır? Sırasıyla önce http://www.linkwithin.com/learn adresine gidip sağ alttaki kısıma e-posta ve site adresinizi yazın, platform bölümünde Blogger'ı seçin ve kaç benzer yazı görünsün istiyorsanız Width bölümünden o sayıyı seçin (Eğer blogunuz benimki gibi koyu zemin üzerine açık renk yazılı ise "My blog has light text on a dark background" kısmını işaretleyin) Get Widget butonuna tıklayın. Açılan yeni sayfada Install Widget bölümüne tıklayın ve son olarak da açılan yeni sayfada Widget Ekle kısmına tıklayın. Bundan sonra yazılarınızın alt kısmında benzer yazılar görünecektir.

Sosyal sitelerde paylaş:

Add this, ya da share it ifadesi de kullanılan ve yazılarınızın okuyucular tarafından Twitter, Facebook, Digg vb sitelerde paylaşılabilmesini sağlayan özellik. Bu özellik Blogger'ın kendisinde de olmasına karşın belki görsel açıdan hoşunuza gitmeyebilir. İşte size bir alternatif, benim de blogumda kullandığım paylaş eklentisi.

Nasıl yapılır? Blogger kumanda paneli - Tasarım - Html'yi düzenle bölümüne gidip Widget şablonlarını genişlet kısmını işaretleyin. Ctrl+F yapıp aşağıdaki kodu bulun:

<div class='post-footer-line post-footer-line-1'>

Bazı temalarda yukarıdaki kod bulunmuyor, eğer sizin temanızda da yukarıdaki kod yoksa bu kodu arayın.

<p class='post-footer-line post-footer-line-1'>

Kodu bulunca, hemen ardına alttaki kodları ekleyin ve kaydedin.

<div align='center'> 

    <!--SOSYAL-AG-TUSLARI-BASLA-->

    <b:if cond='data:blog.pageType == &quot;item&quot;'>

<!--Paylas-->

     <img alt='Paylaş' src='http://lh5.ggpht.com/_lMDRhlG07eY/TTqSL4m3VZI/AAAAAAAABzE/ZmpggLwICRs/s800/payla%C5%9F2.png'/>

    <!--Facebook-->

     <a expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title= &quot; + data:post.title' onmouseout='document.getElementById(&quot;socialtext&quot;).firstChild.data=&quot;paylaş&quot;;' onmouseover='document.getElementById(&quot;socialtext&quot;).firstChild.data=&quot;Facebooka ekle&quot;;' target='_blank' title='Facebook a ekle'><img alt='Facebook' border='0' src='http://lh6.ggpht.com/_lMDRhlG07eY/TTlmZ0kF2-I/AAAAAAAAByU/mxxAeVGAC0o/s800/facebook.png'/></a>

    <!--Twitter-->

     <a expr:href='&quot;http://twitthis.com/twit?url=&quot; + data:post.url' rel='external nofollow' target='_blank'><img alt='Twitter ile Paylaş' src='http://lh6.ggpht.com/_lMDRhlG07eY/TTlmhbmzKEI/AAAAAAAAByk/7FLkT1Dyf_8/s800/twitter.png'/></a>

    <!--Digg-->

     <a expr:href='&quot;http://digg.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank'><img alt='Digg ile Paylaş' src='http://lh5.ggpht.com/_lMDRhlG07eY/TTlmZwQUTFI/AAAAAAAAByQ/EgshEwL2kjI/s800/digg.png'/></a>

    <!--Stumble-->

     <a expr:href='&quot;http://www.stumbleupon.com/submit?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Stumble ile Paylaş' src='http://lh4.ggpht.com/_lMDRhlG07eY/TTlmhHHeH3I/AAAAAAAAByc/Fi7dcsG4_zM/s800/stumbleupon-stumble.png'/></a>

    <!--Delicious-->

     <a expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' rel='external nofollow' target='_blank'><img alt='Delicious ile Paylaş' src='http://lh3.ggpht.com/_lMDRhlG07eY/TTlmZtTTgzI/AAAAAAAAByM/7AvfgkdBc3g/s800/delicious.png'/></a>

    <!--Technorati-->

     <a expr:href='&quot;http://technorati.com/faves?add=&quot; + data:post.url' rel='external nofollow' target='_blank'><img alt='Technorati ile Paylaş' src='http://lh3.ggpht.com/_lMDRhlG07eY/TTlmhBFlE5I/AAAAAAAAByg/RKwm1T9Gohc/s800/technorati.png'/></a>

    <!--Reddit-->

     <a expr:href='&quot;http://reddit.com/submit?url=&quot; + data:post.url + &quot;&amp;title= &quot; + data:post.title' onmouseout='document.getElementById(&quot;socialtext&quot;).firstChild.data=&quot;paylaş&quot;;' onmouseover='document.getElementById(&quot;socialtext&quot;).firstChild.data=&quot;Reddite ekle&quot;;' target='_blank' title='Reddit e ekle'><img alt='Reddit' border='0' src='http://lh6.ggpht.com/_lMDRhlG07eY/TTlmZ4uRUHI/AAAAAAAAByY/Ic_UZ78fWdA/s800/reddit.png'/></a> </b:if>

    <!--SOSYAL-AG-TUSLARI-BITIR-->

    </div>

Yazılara kod eklemek:
Blogger yazı panelinde ne yazık ki kod ekleme kısmı yok, bu nedenle yazının içerisine bir kod eklediğinizde hata oluşabiliyor veya kod görünmüyor. Bunun önün geçmek de oldukça kolay. Nasıl yapılır? http://formatmysourcecode.blogspot.com/ adresine gidin, yazmak istediğiniz kodu üstteki kutuya yapıştırın ve Format Text butonuna tıklayın. Ardından alt kutuda oluşan kodu kopyalayıp blog yazınıza yapıştırın.

Umarım faydalı olur. :)

Pazar, Ağustos 29