5 Şubat 2014

Sidebar Katagoriler bölümünü özelleştirme


katagori
Katagoriler kısmını özeleştirme eminim herkes sitesinde bir katagori oluşturmuştur.sade bir katagor ialanı kullanmak istemiyorsanız.
Bu bizim kullandığımız katagoriler alanını sizlerle paylaşıyoruz eklentimizi bir kaç kişi istedi bizde paylaşalım dedik :)
Eklenti zaten görünüm açısından da çok güzel bir görüntü sağlıyor.
katagori2
numaraların gözükmesi için ise yukardaki resimdede gördüğünüz gibi  her etiketteki  kayıt sayısını göster  demişim sizde aynı şekilde yapığınız zaman  etiket sayılarıda gözükücektir.


öncelikle css kodlarımızı ekliyices tabi bu verdiğimiz kodları siz kendi temanızdakilerle  yer değiştiriceksiniz. bunuda belirtelim.


#Label1 li:hover .label-counter {
background-color: #f5696c;
color: #fff;
}
#Label1 li .label-counter {
float: right;
background-color: #0b5394;
color: #fff;
line-height: 1;
margin: 2px 0 0;
padding: 3px 5px;
text-align: center;
font-size: 12px;
transition: all 0.7s;
border-bottom: 1px solid #fff;
border-radius: 3px;
}

#Label1 ul li:hover{background-color:#F0F5F7}
}
.sidebar .widget {
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
}

#Label1 ul li {
height: 26px;
line-height: 23px;
padding: 0 7px 0 8px;
font-size: 12px;
color: #555;
text-decoration: none;
text-shadow: 0 1px white;
background: #fafafa;
border-width: 1px 0 1px 1px;
border-style: solid;
border-color: #dadada #d2d2d2 #c5c5c5;
border-radius: 3px 0 0 3px;
background-image: -webkit-linear-gradient(top, #fcfcfc, #f0f0f0);
background-image: -moz-linear-gradient(top, #fcfcfc, #f0f0f0);
background-image: -o-linear-gradient(top, #fcfcfc, #f0f0f0);
background-image: linear-gradient(to bottom, #fcfcfc, #f0f0f0);
-webkit-box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 1px 2px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.7), 0 1px 2px rgba(0, 0, 0, 0.05);
margin-bottom: 0px;
overflow: hidden;
}
#isitabnya .Label li{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out}
isitabnya .widget-content.list-label-widget-content{margin:0}
#isitabnya .Label li{width:48%;display:inline-block;float:right;padding:0;background-color:whiteSmoke;border:1px solid #E9E9E9;margin:0 1% 2px}
#isitabnya .Label .isilblnxx{display:block;padding:4px 8px}
ltr{display:block;float:left;margin:0 5px 0 0;min-width:20px;font-size:9px;text-align:center;background-color:#850000;color:white;border-radius:2px}
ltr{background-color:#8A8A8A}
#isitabnya .Label li:hover{background-color:#F7DEDE}

bu aşağıdaki kodu bulup

<span dir='ltr'>(<data:label.count/>)</span>
 bununla değiştiriyoruz
<span class='label-counter'><data:label.count/></span>

Etiketler: ,

25 Yorum:

saat: 5 Şubat 2014 17:08 , Blogger TeknolojiBlog dedi ki...

Bu yorum yazar tarafından silindi.

 
saat: 5 Şubat 2014 17:27 , Blogger TeknolojiBlog dedi ki...

uzun html nereye ekleniyor

 
saat: 5 Şubat 2014 17:41 , Blogger Tolgagnl dedi ki...

kod yeniden düzenlendi css kodları /b:skin kodunu bulup hemen üstüne ekle

 
saat: 5 Şubat 2014 17:42 , Blogger Tolgagnl dedi ki...

kendi #label kodlarına değiştircen

 
saat: 5 Şubat 2014 18:28 , Blogger Akif dedi ki...

Bunu yabancı bi temada görmüştüm :d

 
saat: 5 Şubat 2014 20:25 , Blogger Tolgagnl dedi ki...

doğru bende o yabancı bi temadan kodları alıp bendekinle uyarladım :)

 
saat: 11 Şubat 2014 19:49 , Blogger Mehmet dedi ki...

Kodları ekledim çalıştı. Teşekkürler faydalı bir paylaşım olmuş.

 
saat: 11 Şubat 2014 21:52 , Blogger Tolgagnl dedi ki...

Rica ederim :)

 
saat: 26 Şubat 2014 11:00 , Blogger Unknown dedi ki...

bende verdiginiz iki eklentide olmadi napabiliriz nasil düzenlicez...

 
saat: 26 Şubat 2014 11:46 , Blogger Tolgagnl dedi ki...

Bu eklentimizde css kodlarını kendi kodlarınızla değiştirdiğiniz zaman çalışıyor eklentiyi eklemenizde yardımcı olabiliris.

 
saat: 26 Şubat 2014 15:55 , Blogger Unknown dedi ki...

ben yönetici panelden gelismis ayarlardan css ekleden ekledim diger kodlarida sablon düzenleden yaptim lakin olmuyorr benim temam özel bir tema tehemaforestten alindi ...http://www.hdfilmizle.me sag tarafda ama yan yana durmuyor ...

 
saat: 26 Şubat 2014 16:18 , Blogger Tolgagnl dedi ki...

Helin hanım bana sitenizde tolgagonul@outlook.com bu mail adresine yönetici olarak mail yollarsanız ben yardımcı olabilirim.

 
saat: 26 Şubat 2014 16:20 , Blogger Tolgagnl dedi ki...

mail göndermenize gerek kalmadı yan yana sıralamak için şu kodu ekleyiniz. #Label1 ul li{float: left;width: 45%;}

 
saat: 27 Şubat 2014 19:02 , Blogger Unknown dedi ki...

tamamdir kategori olaylarini yaptim...tesekkurler

 
saat: 27 Şubat 2014 19:14 , Blogger Tolgagnl dedi ki...

rica ederim olmuş evet :)

 
saat: 27 Şubat 2014 21:41 , Blogger Unknown dedi ki...

tolga bey birde su sitedeki resimli arsiv sayfasi yapma olayini yapsaniz bizlerde bloglarimizda kullansak...http://www.guidepedia.info/p/sitemap.html#0 su sitedeki resimli arsivleri yapalim...

 
saat: 28 Şubat 2014 12:23 , Blogger Tolgagnl dedi ki...

gösterdiğiniz sitedeki kod bende yok ama biraz araştırma yaparak ona benzer bi kod buldum
https://app.box.com/s/6e74k1cs1huae639ydwh burdaki adresten indirip sitenizde kullanabilirsiniz.

kullanmak için boş bir sayfa açıp kodları yerleştiriyorsunuz. bir deneyim bakalım olcakmı :)

 
saat: 28 Şubat 2014 22:26 , Blogger Unknown dedi ki...

o kod bende var ama resimleri kare icine alamiyorum....onu nasil yapcagiz ...kare icinde yanyana durmuyor alt alta ve düzensiz geliyor...


 
saat: 28 Şubat 2014 22:37 , Blogger Tolgagnl dedi ki...

burdakini indirip deneyin https://app.box.com/s/dlwbcwk792i1nvzijls1 ben css kodları ekliyerek düzenleme yaptım yanlız yan yana sıralayamadım :) o kodları bulduğunuz sitedeki arkadaşa mail attım sevide teması kullanmanız gerek dedi :) o yüzden başka napabiliris pek bilmiyorum

 
saat: 28 Şubat 2014 22:39 , Blogger Tolgagnl dedi ki...

ben örneğini denedim anca bu şekilde oluyor http://www.tolgagonul.net/p/sitemapp.html#0 burdan bakabilirsiniz. ben birazdaha düzenleme yapmaya çalışırım

 
saat: 1 Mart 2014 23:12 , Blogger Unknown dedi ki...

tamam böyle kullaniriz tesekkür ederim yardimlariniz icin

 
saat: 6 Nisan 2014 23:55 , Blogger Unknown dedi ki...

tolga bey bu menuden bir tane daha yapmak icin napmamiz gerekiyor....misal söyle olmasini istiyorum 1 tanesinde film kategorileri bir tanesinde dizi kategorileri göstermek istiyorum ama olmuyor...nasil yapabiliriz yardimci olurmusunuz

 
saat: 7 Nisan 2014 00:12 , Blogger Tolgagnl dedi ki...

Bunu sanırım şu şekilde yapılabilirsiniz yine yerleşim bölgesinden gadget ekle diyip sonra etiketleri seçip eklemek zaten onu eklediğinizde tüm etiketleri ayarladığınız için bunuda o şekilde ayarlıya bilirsiniz. Yanlız tüm etiketleri göstermessiniz. seçtiğiniz dizileri etiketlersiniz. sonuçta etiketleri menü oluşturmuş oluyorsunuz

 
saat: 10 Nisan 2014 14:05 , Blogger Unknown dedi ki...

yeni etiket olusturdum...ama yeni olusturudugm etiket yanyana olmuyor alt alta duruyor yan yana glmesi icin napmaliyizki...yoksa olmuyormu bu sekil

 
saat: 5 Aralık 2014 14:31 , Blogger TeknolojiBlog dedi ki...

Bu yorum yazar tarafından silindi.

 

Yorum Gönder

Kaydol: Kayıt Yorumları [Atom]

<< Ana Sayfa