Blogger'a Favicon Yapıyoruz



Öncelikle başlamadan önce bu olayı MaFiAMaX Blog'taki sohbet bölümünde worLd182 sayesinde öğrendimi söyleyeyim..Blogger Destek'te paylaşılmış ancak fazla detaya girilmeden anlatıldığı için sorunlar olduğunu gördüm.Paylaşayım dedim.Neyse fazla uzatmayayım..

Yapmaya Başlıyoruz :)

Favicon nedir?
Favicon adres çubuğunun yanında bulunan sizin sitenizin küçük logosudur..
Şu resimler ne dediğimi açıklayacaktır:


Öncelikle bu işlem Photoshop bilgisi gerektirmez..Paintle de yapılabilir ama daha profesyonel ve kolay kullanımı olan PaintNET'i tavsiye ediyorum..PaintNET hakkında bilgi almak için TIKLA

1.Adım
Paint.NET'e girdik..Arkaplanı seçiyoruz.
Arkaplana geçmek için kırmızıyla belirtilmiş tuşa tıklıyoruz.

Daha sonra renkleri belirliyoruz.

Sol menüden A yani yazı moduna geçiyoruz.


Yazı moduna geçtiğimizde üstte bir menü belirecektir.Buradan yazı tipini,büyüklüğünü vb. şeyleri ayarlıyoruz..Üstte bulunan sayı değerlerini elinizle yani manuel olarak giriyoruz.500 yazalım..Büyük veya küçük gelirse sayıyı da aynı şekilde büyültüp küçültebiliriz..
Şu yani:


Onu da yaptık..Yani resmimiz tamamlandı..

2.Adım
http://www.html-kit.com/favicon/  bu linke tıklıyoruz.

Bu 2'ye ayrılıyor.
Source Image ve Scrolling Text

Source Image'ı yapıyorsanız Seç butonuna basın ve yaptığınız resmi seçin.
Eğer yazı+resim favicon kullanmak isterseniz Scrolling Text'i seçin..

Scrolling Text'i seçtiyseniz

Örneğin TaFuGu Blog için bir favicon yapıyoruz.Paint.NET'te de T harfini yaptık.diğer aFuGu Blog kısmını Scrolling Text ile yapabiliriz.Böylece kayan bir faviconumuz olur ;)


O işlemleri yaptıktan sonra Test in Browser'a tıklayın.Beğendiyseniz Download Favİcon'a tıklayın..

İndirilen dosya WinRAR olduğundan .ico ve .png dosyalarınız şu şekilde gelir:

o yüzden dosyaları dışarıya çıkarıyoruz..Böylece yukarıdaki hatayla karşılaşmıyoruz.

3.Adım
Blogger'a girş yaptıktan sonra Yerleşim'e(Şablon diye de geçer) tıklayın..HTML Düzenle'ye tıklayın..
ÖNEMLİ UYARI:ŞABLONUZUN YEDEĞİNİ MUTLAKA ALIN.
daha sonra ctrl+a yapıp ctrl+f ile head kodunu arayın..head kodundan tam üstündeki satıra (tireleri kaldırın) <-link rel='shortcut icon' href='LİNKİ YAZIN'-><-/link-> yazın.

4.Adım
Faviconu bir yere yüklemek için Google Sayfa Oluşturucusunu kullanabilirsiniz..

Veya .png dosyanızı imageshack'e yükleyebilirsiniz..
Yukarıdaki LİNKİ YAZIN yerine direk linki verin..

Önizleme yapın;oldu mu?Kaydedin..
Tebrikler..Artık Blogger'ın Favicon'undan kurtuldunuz...

Bu yazıya 25 adet yorum yapılmış. Düşüncelerini belirtmek istiyorsan durma yorumunu paylaş!

25 yorum:

gokhans dedi ki...

Saol Furkan güzel anlatmışsın.Bloggerin faviconunu beğenmesem bloguma yapardım ama bloggerin faviconuda fena değil.Yinede değiştirmek isteyenler için güzel bir bilgi ;)

worLd182 dedi ki...

Bende bugün anlatımını yaptım benim blogta. =) Ben geçici bi tane favicon koydum ama değiştirmeyi düşünüyorum... Teşekkürler anlatım için..

Schumi dedi ki...

kayan yazı nasıl yapılıyor?Örneğin sesebian kayan yazı yapmış..

tafugu dedi ki...

@Schumi yazıyı bir daha okuyabilir misin?..
Biraz güncelleme yaptım..Dediğin konuya da değindim...

İyi Günler

Schumi dedi ki...

Saol tafugu..

Schumi dedi ki...

Saol tafugu..

donjuanyasin dedi ki...

teşekkürler gerçekten detaylıca bir anlatım olmuş izniniz olursa blogger destek'de yayınlamak isteriz.

tafugu dedi ki...

Tabii olabilir...Alıntı gösterildiği sürece sorun yok :)

karahann dedi ki...

çok güzel anlatım sağol

Emrah dedi ki...

head kodundan tam üstündeki satıra (tireleri kaldırın) abi burayı anlamadım nasıl olacak bi yardım etseniz..emrahdodanli@hotmail.com

tafugu dedi ki...

head kodundan bir üst satıra o yazdığım koddaki tireler(-)kalkacak ve yapıştırılacak.Bu kadar...

Program Türk dedi ki...

Yaa ben bunu yaptım fakat sitemi şablon kodları arasına verdiğiniz kodları koyuyorum kaydet diyorum kodlar otomatik olarak değişiyor. Ve bir değişiklikde olmuyor . Nedendir acaba ?

ersin dedi ki...

teşekkürler.

secorama dedi ki...

eywallah saolasın kardeşim

Adsız dedi ki...

Çok çok teşekkürler..Sayenizde favicon yapımını da öğrendim..

TaFuGu dedi ki...

Sağol Ersin,secorama ve İsimsiz

Adsız dedi ki...

yok bi değişiklik! her şeyi aynen gösterdiğiniz gibi yaptım ve bir hata da vermedi ama değişiklik yok!

Adsız dedi ki...

tamam sorun çözüldü tirelerin(-) hepsini kaldırıp boşluk bırakmamak gerekiyor. eyvalla!

muhaber.net dedi ki...

teşekkür ederim. fakat ie ile açtığım zaman ilkin favicon çıkmıyor. bloğumun alt linklerini tıkladığım zaman favicon çıkıyor. yani anasayfayı açar açmaz gelmiyor favicon...

gamedowncity dedi ki...

olmuyo kardeş png bile olmuyo!!:(

side.tv dedi ki...

chrom da calismiyor. sizin ki hariç

fatih mazi dedi ki...

Sanırım blogger bir önlem almış. Benim faviconlar uçmuş. Acep sizin şablon eski olan mı yeni mi, gördüğümm kadarı ile faviconunuz hala duruyor. fatihmazi.com

Adsız dedi ki...

www.besbelli.net.tc 'ye de beklerim bedava karikatürünüzü yapıyoruz güncel mizah sitesi

Adsız dedi ki...

"head" tagından önce ve sonra kodu yerleştirirseniz çalışmaz. Blogger önlem almış ama <-/head-> (- ler yok) diye aratıp hemen altına kodu yerleştirirseniz çalışacaktır

Mehmet Karadeniz dedi ki...

Teşekkürler. Gayet açıklayıcı ve güzel olmuş.

Yorum Gönder

Mesajlarınızda ahlak dışı kelime olursa yorumunuz silinecektir..
Yorumlarınızda güzel bir Türkçe kullanmaya özen gösteriniz..
Hepinize iyi yorumlamalar...

Son 5 Yorum

TaFuGu Blog-Teknolojiye Farklı Bir Açıdan Bakış
Clicky Web Analytics