Yeni, yine, yeniden...
Sanırım bu sloganı Blogger için yazdığım tüm ipuçlarında kullanacağım. Honda beni mazur görsün :-))
Yazımın başında bu Blogger ipucunun Blogger Hacked yazarı Deepak Bangalore tarafından oluşturulduğunu açıklamak istiyorum. Benim yaptığım şey ise bunu Türk Blogger kullanıcılarının kullanımına sunmak için Türkçeleştirmek ve anlatmak. Şimdi kod yazarımızı andıktan sonra bu ipucu ne işe yarar öğrenelim.
Blogger'da yazılarımız için kategori oluşturamadığımız dolayı bazı yazarlar etiketleri kullanarak bu dar boğazı aşmaya çalışıyor, bunlardan biri de benim. Normal şartlarda her hengi bir etikete tıkladığımızda "{etiket adı} etiketine sahip yazılar gösteriliyor." uyarısını alırız. Ancak yazılar blogda normalde nasıl görünüyorlarsa öyle görünürler. Blogger'ın tek yaptığı yazıları etiket süzgecinden geçirmektir. Peki etiket araması sonucunda aradığımız etikete sahip yazıların özetler halinde bir sonuç tablosu içinde görüntülenmesine ne dersiniz? Hem de AJAX kullanarak sayfanın sadece o kısmını yenileyerek yapmak. Kulağa çok hoş geliyor değil mi? Özellikle Damacana yazarı Erdal'ın çok hoşuna gideceği aşikar :-) "Ben nedediğini anlamadım" diyorsanız "Kategoriler" altındaki veya yazıların altındaki her hangi bir etikete tıklamanız yeterli.
Şimdi giriş kısmını bitirelim ve gelişme bölümünde bu işi nasıl yapacağımıza bakalım.
Bu bölümü okumadan işleme geçebilirsiniz, burada nasıl çalıştığını anlattım.
Bu işin çalışma mantığına öncelikle değinmek istiyorum. Arama sonuçlarımız bir pencere içinde sadece sayfanın o kısmı yenilenerek çıkacağından, AJAX kullanmamız gerektiği aşikar. Bunu yapabilmek için JavaScript kütüphanesinden yararlanacağız. Kullanacağımız kütüphane piyasadaki en ünlü kütüphanelerden biri olan Prototype kütüphanesi.
Daha sonra bir çok ipucunda kullandığımız JSON devreye girecek. Kullanacağımız bir script ile RSS kaynağımıza başvurup ilgili etikete sahip yazıyı çekip AJAX kullanarak istediğimiz bir yerde sonuçları göstereceğiz.
Uyarı: Bu uygulama XML şablonlar içindir.
Düzeltme/Güncelleme: Yaklaşık 2 saat önce yayınladığım yöntemde bazı eksikler vardı. Bu yüzden önceki yazımı geri çekip bu son halini yayınladım. (Erdal yorumun silindi, artık tekrar yazarsın :-) )
Hadi işe girişelim...
İlk öncelikle şablonuzu açın ve HTML'yi Düzenle moduna geçin. Şimdi şablon kodlarımız arasına aşağıdaki kodu koyalım.
Bu kodu <head> ve </head> etiketleri arasına koymayı unutmayın. En iyisi ya <head> etiketinin hemen sonrası ya da </head> etiketinin hemen öncesidir. Böylece bir düzen olur. Bu kod yardımı ile Prototype kütüphanesine bağlanmış olacağız. Dikkat ederseniz ben sunucu adresini direkt GooglePages hesabınız varmış gibi verdim. Siz her türlü şekilde siyah renk ile yazdığım adres kısmını kendi dosyanızın olduğu adres ile değiştirebilirsiniz. Dosyayı indirmek ve kendi sunucunuzda barındırmak için tıklayın.
Şimdi 1.basamaktaki koddan hemen sonra alttaki kodu koyalım.
Buradaki siyah renkte yazdığım adrese ajaxlabels.js dosyasının sizin sunucunuzda bulunduğu adresi yazacaksınız. ajaxlabels.js dosyasını indirmek ve kendi sunucunuza yüklemek için tıklayın.
2. adımdaki CSS'te bulunan tanımlı ögeler şöyle:
#indicator: Etiket araması sonuçlarını beklerken çıkan yükleme ekranı. (Yükleniyor... yazısının bulunduğu pencere)
#search-result: Sonuçların gösterildiği kısım.
.search-result-meta: Sonuç ekranında "Bu etikete kaydol : {etiket adı}" çıktısının bulunduğu kısım.
.search-title: Arama sonucunda çıkan yazıların başlıkları.
.search-close: Kapat yazısının bulunduğu kısım.
Şablonuzda arama yaparak aşağıda verdiğim kod kümesini bulmalısınız. Bunu tüm kodları seçerek CTRL+F arama penceresi yardımı ile yapın. Çabucak bulabilmek için arama penceresine "data:post.labels" yazın.
Bulacağınız kod kümesi:
Bu kod kümesini aşağıdaki ile değiştirin.
Eğer şablonunuzda Etiket GADGET'i kullanıyorsanız bu adımı uygulayın. Eğer kullanmıyorsanız bu adımı geçebilirsiniz. Bu seferde yine CTRL+F ile arama yaparak aşağıdaki kod kümesini bulun. Arama penceresine "data:label.url" yazmanız işinizi kolaylaştıracaktır.
Bu kod kümesini aşağıdaki ile değiştirin.
Böylece blogumuzdaki herhangi bir etikete tıkladığımız zaman scripti tetikleyeceğiz.
Son basamağımızda arama sonuçlarının nerede görüntüleneceğine karar vereceğiz. Bunu için Şablon kısmında "HTML/JavaScript Ögesini" kullanarak aşağıdaki kodları girin.
Burada siyah renk ile belirttiğim adres yükleme ekranında çıkan .gif formatındaki resmin adresi. Siz bu resmi yine kendi sunucunuza kaydederek adres kısmını değiştirmelisiniz. Resmi indirmek için tıklayın.
Bu ögeyi kaydettikten sonra şablonda uygun olan bir yere sürükleyip bırakın. En iyi yer "Blog Yazıları Ögesi"nin hemen üstüdür. Böylece arama sonuçlarınız blog yazılarının bulunduğu alanın hemen üstünde görüntülenecektir.
Bundan sonra tek yapmanız gereken şablonunuzu kaydedip, işe yarayıp yaramadığına bakmak. ;-)
Sanırım bu sloganı Blogger için yazdığım tüm ipuçlarında kullanacağım. Honda beni mazur görsün :-))
Yazımın başında bu Blogger ipucunun Blogger Hacked yazarı Deepak Bangalore tarafından oluşturulduğunu açıklamak istiyorum. Benim yaptığım şey ise bunu Türk Blogger kullanıcılarının kullanımına sunmak için Türkçeleştirmek ve anlatmak. Şimdi kod yazarımızı andıktan sonra bu ipucu ne işe yarar öğrenelim.
Güncelleme 2: 24 Eylül 2008 tarihinde Blogger besleme yayınında yapılan bir değişiklik nedeniyle ajaxlabels.js dosyası güncellenmiştir. Güncellenmiş dosyayı indirmek için tıklayın.
Güncelleme: Bu yöntemi adım adım anlatan videoyu indirmek ve hakkında detaylı bilgi sahibi olmak için tıklayın.
Güncelleme: Bu yöntemi adım adım anlatan videoyu indirmek ve hakkında detaylı bilgi sahibi olmak için tıklayın.
Blogger'da yazılarımız için kategori oluşturamadığımız dolayı bazı yazarlar etiketleri kullanarak bu dar boğazı aşmaya çalışıyor, bunlardan biri de benim. Normal şartlarda her hengi bir etikete tıkladığımızda "{etiket adı} etiketine sahip yazılar gösteriliyor." uyarısını alırız. Ancak yazılar blogda normalde nasıl görünüyorlarsa öyle görünürler. Blogger'ın tek yaptığı yazıları etiket süzgecinden geçirmektir. Peki etiket araması sonucunda aradığımız etikete sahip yazıların özetler halinde bir sonuç tablosu içinde görüntülenmesine ne dersiniz? Hem de AJAX kullanarak sayfanın sadece o kısmını yenileyerek yapmak. Kulağa çok hoş geliyor değil mi? Özellikle Damacana yazarı Erdal'ın çok hoşuna gideceği aşikar :-) "Ben nedediğini anlamadım" diyorsanız "Kategoriler" altındaki veya yazıların altındaki her hangi bir etikete tıklamanız yeterli.
Şimdi giriş kısmını bitirelim ve gelişme bölümünde bu işi nasıl yapacağımıza bakalım.
İşin Mantığı
Bu bölümü okumadan işleme geçebilirsiniz, burada nasıl çalıştığını anlattım.
Bu işin çalışma mantığına öncelikle değinmek istiyorum. Arama sonuçlarımız bir pencere içinde sadece sayfanın o kısmı yenilenerek çıkacağından, AJAX kullanmamız gerektiği aşikar. Bunu yapabilmek için JavaScript kütüphanesinden yararlanacağız. Kullanacağımız kütüphane piyasadaki en ünlü kütüphanelerden biri olan Prototype kütüphanesi.
Daha sonra bir çok ipucunda kullandığımız JSON devreye girecek. Kullanacağımız bir script ile RSS kaynağımıza başvurup ilgili etikete sahip yazıyı çekip AJAX kullanarak istediğimiz bir yerde sonuçları göstereceğiz.
Not: HTML Düzenle kısmında çalışırken "Widget Şablonlarını Genişlet" kutucuğunu işaretlemeyi unutmayın.
Uyarı: Bu uygulama XML şablonlar içindir.
Düzeltme/Güncelleme: Yaklaşık 2 saat önce yayınladığım yöntemde bazı eksikler vardı. Bu yüzden önceki yazımı geri çekip bu son halini yayınladım. (Erdal yorumun silindi, artık tekrar yazarsın :-) )
- Bunlardan biri Türkçe karaktere sahip etiketlerin arama sırasında IE tarayıcısında çalışmaması.
- Arama sonuçlarında çıkan yazılar bizim belirlediğimiz sayı kadarı gözüküyordu. Burada 5 olarak belirledik. Ancak durum böyle olunca sadece son 5 yazı görüntüleniyordu. Şimdi ise aradığımız etikete sahip ne kadar yazı varsa hepsi görüntülenebiliyor. Örnek vermek gerekirse, Blogger İpuçları kategorisinde 5 tane yazıdan fazla yazı var. Artık her 5 yazıda bir sayfa oluşturuluyor. Zaten açılan pencerede sayfa numaralarını göreceksinizdir. Sanırım güncellemenin en iyi yanı bu oldu.
Hadi işe girişelim...
Çalışmanın Başlangıcı
1. Adım
İlk öncelikle şablonuzu açın ve HTML'yi Düzenle moduna geçin. Şimdi şablon kodlarımız arasına aşağıdaki kodu koyalım.
<script src='http://kullanıcıadı.googlepages.com/prototype.js' type='text/javascript'/>
Bu kodu <head> ve </head> etiketleri arasına koymayı unutmayın. En iyisi ya <head> etiketinin hemen sonrası ya da </head> etiketinin hemen öncesidir. Böylece bir düzen olur. Bu kod yardımı ile Prototype kütüphanesine bağlanmış olacağız. Dikkat ederseniz ben sunucu adresini direkt GooglePages hesabınız varmış gibi verdim. Siz her türlü şekilde siyah renk ile yazdığım adres kısmını kendi dosyanızın olduğu adres ile değiştirebilirsiniz. Dosyayı indirmek ve kendi sunucunuzda barındırmak için tıklayın.
2. Adım
Şimdi 1.basamaktaki koddan hemen sonra alttaki kodu koyalım.
<style type='text/css'>
#indicator {position:fixed;z-index:1000;padding:15px 0;top:40%;background-color:#FFFFFF;border:1px solid #AAAAAA;width:176px;left:50%;margin-left:-88px;text-align:center;}
#search-result {border:1px solid #AAAAAA;padding:10px;padding-bottom:30px;font-size:85%;}
.search-result-meta {background:#EFEFEF;padding:2px;}
.search-result-meta img {border-width:0;vertical-align:text-bottom;}
.search-title {font-size:1em;padding-bottom:3px;font-weight:bold;text-align:left;text-decoration:underline;}
.search-cat {display:block;padding:3px;font-size:1em;margin-top:5px;margin-bottom:5px;border-bottom:1px solid #C0C0C0;font-weight:bold;}
.search-close {color:silver;float:right;border:1px solid #F5F5F5;margin-top:10px;cursor:pointer;}
.search-result-nav {font-size:1.4em;font-weight:bold;padding:5px 0pt;text-align:center;}
</style>
<script type='text/javascript'>
//<![CDATA[
// User customisable parameters
// ----------------------------
// maxresults - Her sayfada görüntülenecek sonuç sayısı
// navFlag - Sayfa navigasyonunu kapayıp açmak. Açmak için 1, kapamak için 0 değerini verin.
// feedLabel - Yazı etiketinin besleme linki.
// catLabel - Görüntülenen etiketler.
// closeLabel - Arama sonuç penceresini kapatmak için düğme.
var maxresults = 5;
var navFlag = 1; //Başlangıçta açıktır. Siz değiştirebilirsiniz.
var feedLabel = "Bu etikete kaydol:";
var catLabel = "Yazının etiketleri:";
var closeLabel = "Kapat [X]";
//]]>
</script>
<script type='text/javascript' src='http://kullanıcıadı.googlepages.com/ajaxlabels.js' />
Buradaki siyah renkte yazdığım adrese ajaxlabels.js dosyasının sizin sunucunuzda bulunduğu adresi yazacaksınız. ajaxlabels.js dosyasını indirmek ve kendi sunucunuza yüklemek için tıklayın.
2. adımdaki CSS'te bulunan tanımlı ögeler şöyle:
#indicator: Etiket araması sonuçlarını beklerken çıkan yükleme ekranı. (Yükleniyor... yazısının bulunduğu pencere)
#search-result: Sonuçların gösterildiği kısım.
.search-result-meta: Sonuç ekranında "Bu etikete kaydol : {etiket adı}" çıktısının bulunduğu kısım.
.search-title: Arama sonucunda çıkan yazıların başlıkları.
.search-close: Kapat yazısının bulunduğu kısım.
3. Adım
Şablonuzda arama yaparak aşağıda verdiğim kod kümesini bulmalısınız. Bunu tüm kodları seçerek CTRL+F arama penceresi yardımı ile yapın. Çabucak bulabilmek için arama penceresine "data:post.labels" yazın.
Bulacağınız kod kümesi:
<b:loop values='data:post.labels' var='label'><a expr:href='data:label.url' rel='tag'><data:label.name/></a>
Bu kod kümesini aşağıdaki ile değiştirin.
<b:loop values='data:post.labels' var='label'><a expr:onclick='"javascript:getCat(\"" + data:label.name + "\",null),scroll(0,0)"' href='#sres' rel='tag'><data:label.name/></a>
4. Adım
Eğer şablonunuzda Etiket GADGET'i kullanıyorsanız bu adımı uygulayın. Eğer kullanmıyorsanız bu adımı geçebilirsiniz. Bu seferde yine CTRL+F ile arama yaparak aşağıdaki kod kümesini bulun. Arama penceresine "data:label.url" yazmanız işinizi kolaylaştıracaktır.
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
Bu kod kümesini aşağıdaki ile değiştirin.
<b:if cond='data:blog.url == data:label.url'><data:label.name/><b:else/><a href='#sres' expr:onclick='"javascript:getCat(\"" + data:label.name + "\",null),scroll(0,0)"' ><data:label.name/></a>
Böylece blogumuzdaki herhangi bir etikete tıkladığımız zaman scripti tetikleyeceğiz.
5. Adım
Son basamağımızda arama sonuçlarının nerede görüntüleneceğine karar vereceğiz. Bunu için Şablon kısmında "HTML/JavaScript Ögesini" kullanarak aşağıdaki kodları girin.
<div id="indicator" style="display:none"><img alt="Yükleniyor..." src="http://kullanıcıadı.googlepages.com/indicator.gif"/> Yükleniyor...</div><div id="search-result" style="display:none"><a name="sres"></a><div class="search-close" onclick="javascript:Element.hide('search-result')"><script type="text/javascript">document.write(closeLabel);</script></div><div id="show-result"></div><div class="search-close" onclick="javascript:Element.hide('search-result')"><script type="text/javascript">document.write(closeLabel);</script></div></div>
Burada siyah renk ile belirttiğim adres yükleme ekranında çıkan .gif formatındaki resmin adresi. Siz bu resmi yine kendi sunucunuza kaydederek adres kısmını değiştirmelisiniz. Resmi indirmek için tıklayın.
Bu ögeyi kaydettikten sonra şablonda uygun olan bir yere sürükleyip bırakın. En iyi yer "Blog Yazıları Ögesi"nin hemen üstüdür. Böylece arama sonuçlarınız blog yazılarının bulunduğu alanın hemen üstünde görüntülenecektir.
Bundan sonra tek yapmanız gereken şablonunuzu kaydedip, işe yarayıp yaramadığına bakmak. ;-)
güzel uygulama tebrikler
YanıtlaSilSağolsın Berke. Bu arada MaFiAMaX Blog!'da da bu uygulamaya geçtiğimi belirtmek isterim. Ben FF ve IE tarayıcılarında bir sorun ile karşılaşmadım. Opera tarayıcı kullanan arkadaşlar bir sorun olup olmadığını belirtirlerse sevinirim. Operayı bir daha yüklemeyeyim :-))
YanıtlaSilBir şey daha açıklamak istiyorum. Çalışmanın 2. adımındaki CSS kodlarını şablonun ana CSS kodları arasına koyabilirsiniz. Tabi bunu yapınca <-style type='text/css'->CSS kodları...<-/style-> şekilinde değilde, sadece CSS kodlarını koyarak yapın. Kodların başına da
/*AJAX Kategorileri
-----------------*/
şeklimde başlık atarsanız süper olur.
süper anlatım saol..
YanıtlaSilOpera'da çalışıyor.
YanıtlaSilSadece kendi seçtiğimiz etiketler için kullanabiliyor muyuz?
@gokhans teşekkür ederim.
YanıtlaSil@avare Opera'da çalıştığını öğrendiğim iyi oldu, sağol. Soruna gelirsek, bu mümkün değil. Gerek ajaxlabels.js dosyasının çalışma mantığı gerekse 3. ve 4. adımda yaptığımız değişiklikler dolayısıyla.
3. adımda her yazının altında bulunan etiketi (her ne olursa olsun) ajaxlabels.js dosyasına bağlıyoruz.
4. adımda ise eğer sidebar'da etiket widgeti varsa buradaki etiketlere (yine her ne olursa olsun) ajaxlabels.js dosyasına bağlıyoruz.
Tabii ki web dünyasında herşeyi yapmak mümkün ama bu çalışma ile yapılamaz.
ben bunu siteme uyguladım her adımı eksiksiz yaptım ama tık bile yok yardımcı olursan sevinirim
YanıtlaSilDostum, bu güzel uygulama klasik temaya ne yazıkki uymuyormuş :) Beta Hackmiş. 3. adımda kaldım. Biraz zorlayayım ama olmuyor, uyduramadım klasik temaya.
YanıtlaSil@pckolog, sorunun bana 5. adımda bir hata yapmış olabileceğini düşündürüyor. Çünkü sonuçları bu adım sayesinde gösteriyoruz. Hiç birşey olmadığına göre, burada bir sorun var.
YanıtlaSil@Damacana, bak bu işe sinirlenip klasik bir şablon kullanmak için bir blog açtım :-) Yav bu klasik şablonda etiketler tanımlanmamış, direkt <$BlogItemBody$> içine gömülmüş. Bu yüzden etiketlere müdehale edilemiyor. Zaten 3. ve 4. adım en önemli noktalar. Bu adımlar sayesinde etiketeleri JavaScript'e yönlendiriyoruz. Blogger destek sayfasında etiketler için bir tanımla olup olmadığına baktım ama etiketler için bir tanımlama yok. Vallahi klasik şablonun bu kadar da kısıtlı olduğunu bilmiyordum. Bak bu kaçıncı engel, sen gel XML şablona dön. Bırak artık inatlaşmayı ;-)
Sayende klasik şablonlara olmadığının farkına vardım, yazıya uyarı olarak yazayım hemen.
ben de yapamadım.. herşeyi yaptım.. ama olmuyor..sadece hedef linkin ( etiketin üstüne geldiğim zaman ) #sres oalrak gösteriyor blogun urlsinin sonunda o kadar.. ben bunu uygulamak istiyorum.. eğer yardımcı olursanız minnettar kalırım
YanıtlaSilyarım saattir tekrar baştan yaptım hep.. şablonu bi daha değiştirdim.. widgetleri sıfırladım.. acaba biz başka bi şey daha mı ekliycez yoksa buraya.. hani başka bi yazıda anlatılmış bi şey mi var.. eğer öyleyse özür dilerim.. ama yapamadım gerçekten.. sizin kodlarınızada baktım.. ama öyle uykum var ki.. fazla kafamı yormak istemedim.. bi türlü yapamadım ben gerçekten..
YanıtlaSil5. adımda kodu nereye koyucaz anlamadım?
YanıtlaSilBu konu hakkında birden fazla kişi sorun yaşayınca deneme-blogumda herşeyi baştan aşağı yeniden uyguladım. Ve kodlarda bir sorun olmadığını gördüm. Kodları daha düzgün görmeniz için yeniden düzenledim.
YanıtlaSilEn önemli sorun 3. ve 4. basamaklar. 4. basamaktaki kodu bulabilmeniz için şablonunuzda "sayfa ögesi" olarak etiketleri aktif etmelisiniz. Ayrıca 3. ve 4. adımdaki kodları birebir kopyalayın, yani başlangıç yerleri ve bitiş yerleri aynı olsun.
5. adımdaki kodun ne işe yaradığına ve nereye konulacağıne gelirsek; arkadaşlar şimdi bir etikete tıkladığınız zaman sonuçları gösteriyoruz. İşte bu adımdaki kod bu işi yapıyor. Şablonunuzda sayfa ögesi ekle kısmından "HTML/Javascript" sayfa ögesini açın ve içine bu kodu koyun. Şimdi tek yapmanız gereken, sonuçları nerde görüntülemek istiyorsanız bu sayfa ögesini oraya sürüklemelisiniz. Mesela ben blog yazılarımın üstüne koydum.
Heeeeee tamam ben 5. maddedeki kodun nerey koyulcağını anlamamıştım sadece.. Teşekkürler....
YanıtlaSilişte bu sefer oldu.. gerçekten teşekkürler.. harikasınız.. teşekkür ederim.. gerçekten.. saolun.. :)
YanıtlaSilherhalde ben gece gece pek bi şey yapamadım.. ama oldu.. tam da istediğim gibi.. çok teşekkür ederim.. saolun.. benim bi hatamdı herhalde.. nerde yaptığımı anlayamadım ama olsun.. :) rahatsızlık verdiysem de özürdilerim.. çok harika bir yazı.. türkçeye çevirmeniz ve bunu açık bir şekilde anlatmanız çok iyi.. tekrar tekrar saolun..
merhabalar... yine ben... uamrım rahatsız etmiyorumdur.. anlattığınız şeyi başardım.. çok harika.. gerçekten teşekkür ederim.. çok hoşuma gitti.. fakat bir şey dikkatimi çekti.. etiketlerden bazılarını bu şekilde açamıyorum.. yani.. anlayamadım.. "test" adlı blogumdaki bazı etiketler tık demiyor.. bunlardan birisi adolfun kemirdikleri.. diğeri de edi'nin günlüğü.. bir türlü yapamadım.. yani.. sizce neden..
YanıtlaSilmerhaba seker tadında bir bayram gecirmen dilegiyle......birde bir sorum olacak sonraki ve önceki sayfa yerine rakamlarla nasıl belirlerim wp sayfa sayac eklentisindeki gibi yani bloggera uyarlamıs bir arkadas fakat sayfalara numara vermem gerek bu nasıl olacak acaba simdiden tesekkürler
YanıtlaSil@Adolf şimdi baktım gerçekten çok ilginç. Şu etapta aklıma herhangi birşey gelmiyor. Ama merak ettim, inceleyeceğim. Sonuç çıkarsa haber veririm.
YanıtlaSil@kurabİye evİ şablon kodlarında "önceki sayfa", "sonraki sayfa", "anasayfa" gibi linkler şablonda gömülü durumda, yani Blogger sunucularında herbiri için tanımlı ögeler (değişken) mevcut. Böylece şablonda yapılan her değişikliğe ayak uyduruyorlar. Blogger'ın şablonlarının XML olması da bundan zaten. Söz gelimi şablonun dilini değiştirmeye kalktığında onlarda o dile çevriliyor. Eğer şablon içinde sabit (elle değiştirilebilir) olsalardı o dediğin şeyi yapabilirdik. Tabi bunun için de JavaScript yapılabilir belki ama ben bilmiyorum. Gördüğün blogların linkini bana verirsen bir inceleme fırsatım olur. Görüşmek üzere...
çok teşekkür ederim.. harikasınız.. olmasada olur.. zaten o etiketler diğer etiketlere de bi şekidle bağlı.. işe yara bir etikette değil.. sadece ilginç yani :D tekrar teşekkürler
YanıtlaSilsevgili mafiamax.. @kurabiye evi'nin söylediği şey şuysa eğer.. bu adreste vermişler.. bunlar bloggera uyarlanabilir mi acaba.. bakmak ister misin..
YanıtlaSilhttp://www.styleignite.com/styles/view/34/digg-style-pagination
http://www.mis-algoritmos.com/2007/03/16/some-styles-for-your-pagination/#?page=2
@Adolf o verdiğin sitedeki eklentiler (plug-in) Wordpress için. Mesaj panosunda @worLd182 bahsedilen şekilde bir Blogger altyapısı kullanan blog linki vermiş. Ama ordaki örnekte de görülen sayılar sayfa numarsı değil, etiketler. Yani etiketlere ad verirken sayı vermiş ve onları şablonun altında kullanmış. ;-)
YanıtlaSilTurk bir arkadas onunlada konustum sayfaları numaralandırdım dedi ben linki vereyim bakarsın olursa tam olarak uyarlarsan süper birsey olur http://themesblogger.blogspot.com
YanıtlaSilgörüsmek üzere :)
Sonunda yaptım ama her sayfaya 1 yazı koyma zorunda kaldım hepsine yazıların linklerini ekledim fakat tek sorun her yazı ekledigimde tekrar duzenlemem gerek onu cozersen harika bir seye imza atmıs olucaz :)hemen ekibi kurdum bak bende ne yüzsüzüm :)
YanıtlaSilSanırım düşündüğüm gibi ele etiketleme yapmak yerine bir "navbar widget" ile bu işi halletmiş. O widget otomatik olarak etiketler oluşturarak her yazıya bir sayfa numarasını etiket olarak veriyor.
YanıtlaSilAncak tam olarak bir bilgim olmadığı için net birşey söyleyemem.
Sayende bunuda yapmanın mutluluğunu yaşıyorum ve şu anda bir yandan sana dua ederken bir yandan da Blogunda bulunan reklamlara tıklıyorum.
YanıtlaSilTeşekkürler.
@BOSS Allah dualarını kabul etsin :-) Yalnız Blogger profilini erişime açmadığın için blog adresini öğrenemedim. Adresini de mesaj panosunda yazarsan öğrenmiş olurum.
YanıtlaSilElinize, kolunuzu, gözünüze sağlık.Teşekkürler
YanıtlaSil((: teşekkür ederim.
YanıtlaSil4. adımdaki kod bende biraz farklı , senin verdiğin örnekteki kodla aynı deil ve olmuyo :S
YanıtlaSilFarklı olan ne? Kodun parantezleri olmadan farklı olan kısmını belirtirseniz belki yardımcı olabilrim.
YanıtlaSil(b : if cond= 'data : blog . url == data : label . url')
YanıtlaSil(span expr : dir='data : blog. languageDirection')
(data : label . name/)
(/span)
(b : else/)
(a expr : dir='data : blog .languageDirection' expr : href= 'data : label . url')
(data : label . name/)
(/a)
Bu verdiğiniz kod benim bahsettiğim kod değil. Benim 4.adım da bahsettiğim kodlar eğer sayfa ögesi olarak etiketleri eklediyseniz çıkar.
YanıtlaSilbilmiyorum deseymişin daha makbule geçerdi, bu kod o kod :) sadece (span) kodu fazlalığı var senin 4. adımdaki verdiğin kodun bir kısmını (span) etiketi içine almış, ve span etiketine bir takım özellikler vermiş.. aramaktan bütün kodları ezberledim nerdeyse, dediğin koda en benzer kısım burası.
YanıtlaSilUzaktan yardım dedikleri şey bu olsa gerek. Blogunuza girmek istyedim ama profiliniz kısıtlı olduğu için bakamadım, vahi de olmadığına göre sadece tahmin yürütebildim. Önüne gelen Blogger şablonu yapıp piyasaya sürüyor, ve farklı farklı şeyler ekliyor. Span etiketi hakkındaki aydınlatıcı dersiniz için teşekkür ederim, ama ben ne işe yaradığını daha önce öğrenmiştim. Benim size anlatmak istediğim şey ise çok açıktı. Eğer blogunuza Etiket sayfa ögesi eklediyseniz kodu bu olmaması gerek!
YanıtlaSilyeseka.blogspot.com
YanıtlaSiltemayı değiştirdim, kubrick xml kullanıyorum artık.. bundada olmadı, etiket öğeleri blogda mevcut.bu kod bi yerlerde hatalı, çalışıyordur ama, sayfa yüklendikten sonra sayfa yüklendi ama sayfada hatalar gibisinden mesaj geliyo sol alt köşede,mesela seninkide öle.. ayrıntıya önem veren birisiyim, sayfada hatalara sebebiyet veriyosa isterse dünyanın en güzel scripti olsun. ekklemem o zaman o scripti :)
Size zahmet kullandığınız temanın XML dosyasını mafiamax{at}mynet.com adresine yollar mısınız. Ben bir kaç yerde buldum ama sizinki ile aynı olup olmadığından emin olamadım. Çünkü temalar el değiştirdikçe içindeki kodlar da değişiyor. Cuma akşamı buna bakacağımdan şüpheniz olmasın.
YanıtlaSilHata verme olayına gelirsek, ben şimdi hem IE7 hem de FF 2.0 ile siteye girdiğimde hata bulundu mesajını almadım. Ara ara Google sunucu kaynaklı sorunlar yaşıyorum, yani yüklenmesi gereken dosyalar yüklenmeyebiliyor. Sorun bundan kaynaklanmış olacağı gibi bir takım XHTML hatalarından da kaynaklanıyor olabilir. Zaten kısa bir süre içinde tüm altyapıya el atacağım. Bunu iki hafta önce duyurmuştum.
İlginiz için teşekkürler.
gönderdim..
YanıtlaSil@digi, şimdi sorununa bakabilme fırsatı buldum. Aslında ortada sorun da yok. Senin olmuyor dediğin şeyi ben çok rahat bir şekilde yaptım. Senin dediğin gibi verdiğin kodlar etiket sayfa ögesinin kodları. Bu kodun tamamını benim verdiğim kod ile değiştirince sorun oluşmuyor. Hatta mailine de benim yaptığım temayı attım. Tabi temayı yeniden kaynağından indirdim, sen temanı bana yollarken sanırım kopyala-yapıştır yaptığın için sorun oluştu. (Daha temayı denerken, yani bu üzerinde konuştuğumuz olaydan bağımsız)
YanıtlaSilmükemmel hazırlanmış bir eklenti, elinize sağlık. Kendime göre ayarlayıp deneyeceğim :)
YanıtlaSilmerhabalar mafiamax.. hatırlarmısınız ben size bir ara bu eklenti için yorum yazmıştım... size hatta bazı kategorilerin çalışmadığını söylemiştim.. siz de şaşırmıştınız... ben ondan sonra kaldırdım o kelnetiyi çünkü başka türlü ulaşılamıyordu... sonra tekrar kurdum bugün... bu sefer anladım ki '!? gibi karakterleri görmüyor açmıyor sanırım eklenti çünkü hepsi çalışıyor şu anda.. :) ekneltilerin isimlerini değiştirdim gönderiler kısmından oldu... eğer böyle bir sorun varsa birisinde ya da size bununla ilgili gelirlerse söyleyeyim de dedim bilgielri olsun... eklentiyi türkçeye çevirip sunduğunuz için de teşekkürler
YanıtlaSil@Sedran güle güle kullan.
YanıtlaSil@adolf ilgin için teşekkür ederim.
Bunu yapmayı bende çok istiyorum ama yazını okudum ve anladığım kadarı ile bu işi yapabilmek için Google Pages'ten sayfa açmak lazım. Google pages'ten sayfa nasıl alınır bunu da bir başka yazında anlatman mümkün mü? Tabi bu kategori tablosunu alabilmek için Google pages'te ne gibi işlemler yapacağız? bunu da anlatırsan çok iyi olur.
YanıtlaSilHocam ben harfi harfine dediğin şekilde koydum ama etiket bulutu kullandığımdan mıdır bilmiyorum, hala eski şekilde açılıyor.
YanıtlaSilMafiamax Google pages'ten sayfa nasıl alınır bunu anlatan bir yazı yazmanı tekrar ısrarla istiyorum. Lütfen yaz da şu güzel olaydan yararlanalım.
YanıtlaSilOoo hocam bu hacki yapan adamın sitesindeki
YanıtlaSila.href = 'javascript:getCat("' + encodeURIComponent(t) + '",null)'
kodu ile etiket bulutuna entegre ettim :D
yazı içerisinde verdiğimiz veya temada etiket widgetinden ayrı olarak verdiğimiz linklere nasıl entergre edebiliriz?
YanıtlaSilmesela (kodları yazmıyorum)
a href=http://mafiamax.com/search/label/Blogger>Blogger /a> linkinde tabloda açılması için nereye eklememiz gerekiyor?
tekrar merhaba belirttiğim soruna bir çözüm varsa paylaşırsanız sevinirim. ben şöyle denedim ama yapamadım, olmadı:
YanıtlaSil<a expr:onclick='"javascript:getCat(\" " + http://mafiamax.com/search/label/blogger + "\",null),scroll(0,0)"' href='#sres' rel='tag'>BLOGGER</a>
linkin yerine sadece blogger, search/label/blogger vb. de denefim ama yine olmadı. yardımcı olabilirseniz sevinirim. şimdiden teşekkürler...
@hasan, geç cevap verdiğim için kusura bakma, bu aralar gerçekten yoğundum.
YanıtlaSilBu JavaScript'in görevi ve çalışma mantığı başka. Eklemeler ile senin istediğin türden birşey yapılır mı bilmiyorum.
Hocam hep bu ayarları googleye göre vermişsin ben blogcudayım bizim başımız kelmi bizede yol göstersen olmaz mı? :)
YanıtlaSil@respot_01, bak başlıkta Blogger için demişim. Ben blogcu.com'un kullandığı sistemi bilmiyorum.
YanıtlaSilMafiAMaX öncelikle teşekkürler sorunsuz şekilde çalıştı. Benim ekstradan bir sorum olacak belki blogumu ziyaret edersen görürsün ben blogumda ekstradan etikete link veren menüler de yapmıştım vakti zamanında, o verdiğim linkleri de bu sistemi kullanacak şekilde değiştirebilir miyim? örneğin verdiğim linklere ekstra kodlar vs. ekleyerek.
YanıtlaSil@Erhan,
YanıtlaSilRica ederim. Sanırım blogun en üstündeki etiketlerden bahsediyorsunuz. Oradaki etiketleri de JavaScript'i çağıracak şekilde düzenleyebilirsiniz. Bunun için 3. adımda eklemenizi istediğim kodu ordaki etiketlere de eklemelisiniz.
teşekrüederim ama kodlamadan hiç anlamayan birisi olarak bunu beceremedim. sana şöyle söylesem örneğin orada "Sinema" diye atanan linki bu scripti çağıracak şekilde nasıl yerleştirebilirim :) eğer varsa bunun bir yolu kısaca anlatırsan sevinirim.
YanıtlaSil@Erhan,
YanıtlaSil<a href="#sres" rel="tag" onclick="javascript:getCat('Sinema',null),scroll(0,0)">Sinema</a>
sagol canım ne güzel bişey
YanıtlaSilAllah razı olsun bir bloğumda denedim süper çalışıyor.
YanıtlaSilMerhaba eğitim sitemde denedim bir türlü olmadı mail adresinize bilgileri gönderdim ilgilenebilir misiniz?
YanıtlaSil@Enes,
YanıtlaSilSağolasın.
@Muhammed Bey,
Gerekli bilgilendirmeyi e-posta yolu ile yaptım.
4.adımda data:label url yerine data:blog.homepageUrl var data:label.name yerine ise data:title var ve com uzantılı sitem olduğu için mi bu böyle
YanıtlaSilve yukarıda anlattığım şekilde kodları değiştirip yolladım yine olmadı
YanıtlaSil@Muhammed,
YanıtlaSilBunun adresiniz ile alakası yok. Bahsettiğiniz kodlara göre yanlış bir yere müdehale etmişsiniz.
Merhaba mafiamax,
YanıtlaSilörneğin şu kodu bulamıyorum "data:post.labels"
temadan temaya fark olabilirmi.sayfa öğelerinden etiketi kullanıyorum.fakat bulamıyorum.işin aslı farklı bi temayada geçmek istemiyorum.farklı bir çözümü olabilirmi?
@Kadirland,
YanıtlaSilBu sorunun cevabını verebilmek mümkün değil. Sonuçta temayı düzenleyenler farklı çzöümlere gitmiş olabilirler. Ben bu ve benzeri yazılarımı Blogger'ın varsayılan temalrından hareketle yazıyorum. Sonuçta onlarca çeşit tema yapılıyor ;)
tşkler mafiamax.
YanıtlaSilMafiamaX bu olayı sayende uyguladım. Ancak bloğumda anasayfaya gelip, oradadnda sonraki kayıt linkine tıklayınca sonraki kaydınb sadece başlığı gözüküyor. Halbuki ben bu olayı yapmadan olduğu gibi sonraki kaydın başlığı ve içeriği ile gözükmesini istiyorum. Bir bloğuma bakarmısın? Bu sorunu nasıl düzeltebilirim?
YanıtlaSilBu uygulamayı yaptığında bahsettiğin şekilde bir sorun oluşmuyor. Zaten bunu en başta bir yıldır ben kullanıyorum ;)
YanıtlaSilBurada ya da videoda anlatıldığı gibi yaptığın takdirde şablonunda bir sorun yoksa her şeyin düzgün çalışması gerekir.
kardeş ben daha yeniyim ma denemeye calıstım ilk adımda coss!!:D google paages e bu prototype dosyasını yuklerken hata verdi .js yuklenmiyomus sanırım
YanıtlaSil@zekiuğrasız,
YanıtlaSilGooglePages üye alımını durdurdu ama eski üye iseniz hala kullanabilir ve her türlü dosyayı yükleyebilirsiniz. Bu konu hakkında yazdığım yazıyı okuyabilirsiniz:
Page Creator Üye Alımını Durdurdu
Mafiamax kardes tum herseyii yaptım ama olmuyor. sana msnden falan nasıl ulasabiliriz. benim blog a bakabilirmisin. istersen sana blog şifrelerini veririm. oradan da bakabilirsin adımı adımına yaptım herseyi ama olmuyo allah olmuyo:D bu arada zeki ben son mesajı yazan blog www.cine-dizi.blogspot.com guzel bi temalı site yapmak istiyom ama tum ugraslarım sonucsuz kaldı yardım edersen sevinirim.
YanıtlaSilİyi Akşamlar mafiamix kolay gelsin..Ya bende bu blogger eklentisini uygulayamadım..Bütün herşeyi yapıyorum ama 4.adımdaki kodlar benim templatemde yok o yüzden o adımı yapamadığım için eklentiyi kullanamıyorum..Yardım edersen çok sevinirim..
YanıtlaSil@Sinemalaralemi,
YanıtlaSilEğer Etiket GADGETini kullanmıyorsanız 4.adımdaki kodu bulamazsınız. Eğer etiket GADGET'i kullanmıyorsanız bu adımı atlayabilirsiniz.
Son derece kolay bir anlatım olmuş.elinize sağlık.hatırlatayım indicator.gif linki bir şekilde hata veriyor.kolay gelsin...
YanıtlaSil@My Best Choices,
YanıtlaSilRica ederim, yalnız bahsettiğiniz resim dosyasının indirme bağlantısı çalışıyor. Sorun nerde acaba?
Sağolasın eline sağlık.
YanıtlaSilMerhaba söylenenleri yaptım sanırım doğru da yaptım fakat herhangi bir yazının içine girince dipte etiketler sıralanıyor yavaş yavaş ve onlara tıklayınca o etiketle ilgili yazılar üst kısımda gösteriliyor sanırım amaç da bu fakat benim istediğim şey şu etiketleri felan göstermesine gerek yok göstermesin sadece kategorilerime tıklayınca onlarla ilgili olan yazıları göstersin istiyorum bir de bu sadece benim belirlediğim etiketlere göre oluyor mu ?
YanıtlaSilBen kategorilerimi oluşturduğum belirlediğim etiketlere göre istiyorum ki kategorilerden herhangi birine tıklayınca üst kısımda onunla ilgili olan konular açılsın burada olduğu gibi ?
Hocam bugüne kadar sorunsuz kullandığım uygulamayı default temaya uyarladığımda şöyle bir hata çıktı. "Özürdileriz. Oluşan bir hatadan dolayı isteğiniz yerine getirilemiyor. Tekrar deneyin."
YanıtlaSilBunun yanında "ETIKETLER:" yazısının yanında iki tane birden etiket çıkıyor.
Bunları nasıl düzeltiriz?
@cobija,
YanıtlaSilHata anlık olarak Blogger'dan da kaynaklanmış olabilir. Sorun hakkında bir bilgim yok malesef.
http://anshuldudeja.blogspot.com/2009/03/show-only-post-title-in-blogger-label.html
YanıtlaSilAnlatımda ilk kırmızı renkteki kodları alttaki ilk kutuda yazan kodlarla değiştirin.Diğer kodlar da anasayfada kayıtların liste halinde çıkmasına fayda sağlar.
Bu arada videoyu indirdim uygularken bi yerde takıldım çünkü bu kodu bulun dediğin kod temamda yoktu :) herneyse sonunda çözdüm sorunu.Teşekkürler
@Tarifci Usta,
YanıtlaSilPaylaştığınız yazı benim 2008 yılının Eylül ayında yazdığım yazının bir kısmı zaten ;)
Ben bu konutu 8 ay önce şu başlık altında yazmıştım:
Blogger'da Sadece Yazı Başlıklarını ListelemekVideoyu hazırlarken Blogger'ın en temel şablonlarını hedef aldım, piyasada değiştirilmiş çok şablon var. Sorunu çözebildiğinize sevindim. İyi çalışmalar.
walla eline sağlık mükemmel bir anladım olmuş...
YanıtlaSilçok tkler hem sözel hem videolu anlatım için..
YanıtlaSilbu etiketlendirmeyi yaptım ancak kaldırmak istediğimde sayfa öğlerinden kaldırdım..ancak tekrar oluşturmak istediğimde nasıl oluşturcam aynı işlemleri mi yapıyorum..html'de yaptığım işlemler gözüküyor dolayısıyla nasıl yapıcamki yeniden:) saçma soru olabilir cahillik işte..tşkler şimdiden
@butregenyo,
YanıtlaSilRica ederim. Sayfa ögesini kaldırdıysanız sadece 4. adımı tekrarlayın. Tabi önce etiket sayfa ögesini (GADGET) ekleyin. Daha sonra da 4. adımı tekrarlayın.
anlatım için teşekkürler ...
YanıtlaSilben başka birşey sormak istiyorum. Blogger' daki bi bloga ait 2000 etiket sayısını nasıl değiştirebiliriz ? bugün böyle bir problemle karşılaştım, yazımı yayınlayacağım her seferinde aynı hatayı veriyor.
"HATA
Bir blog en fazla 2000 etikete sahip olabilir." şeklinde...
üstad kasayı fırlatıp atmamak için kendimi zor tutuyorum adım adım tane tane anlatmışsın fakat biz bi yerde yanlış yaptık
YanıtlaSilsorun şu hepsini yapıyorum şablonu kaydet diyorum kaydedilemez b:if kodu kapalı değil diyor iki saat aradım buldum kapattım bu sefer kaydedilemez span kodu kapalı değil diyor.
@Dervis,
YanıtlaSilŞimdi paylaştığım kodlarda mı acaba bir sorun var diye baktım ama yok.
şunu eklemenizi isterim bu eklenti
YanıtlaSilfeatured content olan sitelerde featured' i bozuyor ...
@Dervis bende 2 saattir aynı şeyi yapıyorum fakat hep aynı hata b:if 3. veya 4. adamlarda bişeyi eksik mi yapyoruz hocam anlamadm gitti.normalde uyguladığım bişeyi dk.sında yapardım hatasız üstelik anlatımda gayet acık nerde hata cözemedm gözlerim agırdı ekrana dikatli bkmaktan :S
YanıtlaSil@kalender,
YanıtlaSilSizin yorumunuz üzerine, sanki ben de sizin gibi bir ziyaretçiymişim gibi aynen burada okuduklarımı uygulayarak ve buradaki dosyaları kullanarak işlem yaptım ve sonuç muhteşem! Üstelik 10 dakika bile sürmedi. Üstelik de Blogger'ın en son şablonunu kullandım.
Bakın burada 3. adımdaki kodlar yazılarınızın hemen altında veya üstünde bulunan etiketleri gösterir. Buradaki kodları değiştirirken mutlaka benim dediğim yere kadar olanını yenisi ile değiştirin.
4. adımdaki kodlarda sidebara eklenen etiket gadgeta aittir. Yani bu gadget ı kullanmıyorsanız o kodları göremezsiniz.
"Kapat X" Çalıştıramadım. Gadget' tan bir sorun yok gibi.
YanıtlaSilÖncelikle verdiğiniz bilgiler gerçekten süper ötesi. benim sorum ve sorunum şu : yazı başlığımın altındaki etiketler, tarih-saat vs. görünmesin istiyorum. etiketleme yapayım ama görünmesin. bunu nasıl yapabilirim acaba.
YanıtlaSilwww.mucizemutfak.com sayfasına bakabillirseniz derdimi daha iyi anlarsınız hocam.şimdiden çok teşekkür eder çalışmalarınızda kolaylıklar dilerim.
@Mucize Mutfak,
YanıtlaSilMerhaba. Blogger ayarlarınıza girdikten sonra, sol menüden "Yerleşim" linkine tıklayın. Açılan sayfada blog gadget'larınız yer alacaktır. Burada "Blog Kayıtları" gadgetının "Düzenle" linkine tıklayın. Açılan pencereden saat, yazar ismi vs. gibi seçeneklerin yanına tik atın. Kategoriler/etiketler seçeneğini ise seçmeyin. Sonra ayarlarınızı kaydedin.
Aleykum selam. Eskiden googlepages vardı. Oraya dosyayı yükleyip ücretsiz barınma (hosting) olarak kullanıyorduk. Şimdi başka ücretsiz bir yere yüklemelisiniz. Dropbox veya Google drive olabilir. Google drive a yüklerseniz dosyayı herkesin kullanımına açmalısınız ki dosya çalışsın. Dropbox ta kullanabilirsiniz. Dosyayı dropbox a yükledikten sonra dosya üzerine sağ tıklayıp Share seçeneği ile linkini alabilirsiniz.
YanıtlaSil