Rengarenk etiket bulutu yapmak artık çok kolay. Hemde etiket özgürlüğünüzden ödün vermeden sadece en önemli etiketleri belirlemeniz yeterli...
Etiket bulutu kullanıcılara kaynaklık eder.Sitenize ilk kez helen bir ziyaretçiyi blogunuzun hangi konular üzerien olduğu konusunda kısa bir fikir verir... Fakat etiket sayısınız arttıkça bloggerda sahip olduğunuz etiketler widgetı canınızı sıkabilir. İşte bu harika uygulamayla etiketler konusunda özgür olacaksınız...
İşe koyulalım:)
1. Kodlar
<div style="width: 265px; background-color: #e5e7db; text-align: left; ; font-family: 'Verdana';">
</div>
2. Kodlar
<a style="font-size: 14px; color: #87a800; text-decoration: none;
" href="http://tambirblog.blogspot.com/search/label/programlar">programlar</a>
Önce
Yerleşim>Sayfa öğelerine gelip html/javascript aracını ekliyoruz. Daha sonra 1. Kodu yapıştırıyoruz. Daha sonra 2. kodları istediğimiz kadar kopyalarak 1. koddaki
</div>
Şimdi bu kodlarda yapmamız gereken ayarlara gelelim...
1. kodda yapmanız gereken ayarlar: Aşağıdaki kırmızı kodları kendinize göre değiştirebilirsiniz.
width: 265px > etiket bulutunun genişliğini ayarlar. 265 i kendinize göre ayarlayabilirsiniz.
background-color: #e5e7db; > kategori bulutumuzun arkaplan resmini ayarlamanızı sağlıyor.
font-family: 'Verdana' > etiketlerinizin fontunu bu kodla ayarlayabilirsiniz.
2. kodda yapmanız gereken ayarlar: Aşağıdaki yeşil kodları kendinize göre değiştirebilirsiniz.
font-size: 14px; > etiketinizin boyutunu belirler.
color: #87a800; > etiketinizin rengini belirler.
http://tambirblog.blogspot.com/search/label/programlar > etiketinizin ismini ve gideceği Url'yi buradan ayarlayabilirsiniz.
programlar > etiketinizin ismini belirleyebilirsiniz.
"*Her bir etiket için 2. kod ayarlarını yapmanız gerekmektedir. 1. kod zaten bir defa kullanılacaktır. 2. kodları 1. koddaki div kodunun önüne yapıştırmayı unutmayın.."
Eğer yapamadıysanız hazır bir örnek sizler için yaptım:
<div style=" background-color: #FFFFFF; text-align: left; ; font-family: 'Verdana';">
<a href='http://tambirblog.blogspot.com/search/label/blogger%20templates' style="font-size: 22px; color: #039faf; text-decoration: none;">blogger temaları</a>
<a href='http://www.logiprint.co.uk/en/Printing.html' style="font-size: 12; color: #00CCCC; text-decoration: none;">printing</a>
<a href='http://tambirblog.blogspot.com/search/label/blogger%20templates' style="font-size: 21px; color: #006600; text-decoration: none;">blogger temaları</a>
<a href='http://tambirblog.blogspot.com/search/label/blogger%20templates' style="font-size: 18px; color: #00CCCC; text-decoration: none;">blogger temaları</a>
<a href='http://tambirblog.blogspot.com/search/label/blogger%20templates' style="font-size: 20px; color: #006600; text-decoration: none;">blogger temaları</a>
<a href='http://tambirblog.blogspot.com/search/label/blogger%20templates' style="font-size: 19px; color: #00CCCC; text-decoration: none;">blogger temaları</a>
</div>
Renk kodlarını bulmakta zorlanmamanız için aşağıda renk kodlarını da verdim. Kolay gelsin....
Yazıyı İmle
21 yorum
merhaba,bu anlattığınız konu çok güzel ama ben üstteki smile ekleyin bölümüne bayıldım...hele o sokak afişlerinde isminiz çokkkk hoş olmuş...siz mi yaptınız?benimde böyle birşey yapma şansım olabilirmi?:))
10 Mart 2009 21:52
evt sizinde böyle bir şey yapma şansınız var sizi hemen bu yazıma alıyım..
http://tambirblog.blogspot.com/2009/02/photoshop-hic-bu-kadar-kolay-olmamst.html
umarım iyi vakit geçirirsiniz...:))
smile ekjle bölümüne benzer bi menü yapımını blogumda anlattım ona da buradan ulaşabilirsiniz...
http://tambirblog.blogspot.com/2009/03/bloggera-featured-contetnt-eklentisi.html
10 Mart 2009 22:27
Çok güzel bir çalışma olmuş, benim gibi kodlara kafası basmayanlar için ideal. Sağolasın.
11 Mart 2009 02:02
Teşekkürler...
11 Mart 2009 15:32
Arkadaşım ya senden bır rıca isteyebılırmıyım.Şu kopyalama işiyle ılgılı..
Blogumda ki yazılarımı ve şiirlerımı kopyalanmaya karsı nasıl bır koruma yöntemi tavsıye edersın..şimdiden tşkler...
11 Mart 2009 20:27
Ben nerede yanlıs yaptım anlayamadım. Ekran goruntumu aldım sıze gondermek ıcın , bu bolumden ekleme sansım var mı ?
16 Mart 2009 17:59
tabi gönderebilirsin...
16 Mart 2009 18:26
benim yaptığım örneği kopyala yapıştırıp linkleri renkleri ve boyutları değiştirebilirsin...
16 Mart 2009 18:29
Sanırım benım yapamadım sey , etıket ısmıne tıklandıgın da gıdılecek sayfanın belırtılmemesı...
Bu sayfa o etıketı tıkladıgımda yukarırda gorulen lınkmıdır.
17 Mart 2009 21:22
şeffaf olması için mesela arka planın kodun ne olması gerekiyor acaba ? olabilirmi öyle ?
7 Nisan 2009 16:50
yanlışlıkla iki ## yanyana koydum renk kodu yerine renk kodunu yapıştırıken ve şeffaf oldu arka plan rendimin bunun bir zararı olur mu kodlarıma ?
7 Nisan 2009 17:05
olmaz sanmıyorum:D
7 Nisan 2009 17:22
ehehe uzuuunn ugraşlar sonucu ekledim ama url yi veremedim bir türlü,etiketlere tıklayınca senin siten açılıyor kendine torpil mi yaptın:))
21 Nisan 2009 22:30
evet siz her etiketi kendinşze göre değiştireceksiniz...:))) ben zaten onu örnek olarak vermiştim
eğer örneği uyguladıysanız:
http://tambirblog.blogspot.com/search/label/blogger%20templates bunu değiştireceksiniz...
kendi etiketinizi ve adresinizi ekleyeceksniz...
21 Nisan 2009 22:38
çok güzel bir paylaşım..işe yarıyor..sağol
23 Nisan 2009 16:50
öncelikle tekrar teşekkürler.bloğunuz harika.
ben ekledim fakat etiketlerim çok bitişik.aralarını nasıl açabilirim?
15 Mayıs 2009 09:44
öcelikle etiket bulutunuz çok güzel olmuş:))
İlk önerim örneğin bedava etiketi yapmışsınız ya bedava yazdığınız yerin önüne ve sonuna iki boşluk bırakın yani:
> bedava <
işe yaramazsa ben buralardayım...
15 Mayıs 2009 11:41
resimdede gözükdüğü gibi nasıl yapacaz peki yani bi yerde etiket hemen yanında son konular vb. bu sitede şuanda olan şey
23 Mayıs 2009 13:40
hayır sadece etiket bulutunu anlattım burada tab menü yapmayı değil...
23 Mayıs 2009 14:27
Usta ya senin sitedeki su allta olan son yazılar son yorumlar onu eklemeyide gostersen bize ?
31 Mayıs 2009 10:22
Bu yorum bir blog yöneticisi tarafından silindi.
6 Temmuz 2009 04:17
Yorum Gönder