onderArslan: Mayıs 2016

Archive for Mayıs 2016

Yıldızlı Popüler Yazılar Eklentisi

Blogger’ın gadgetlar listesinde bulunan “Popüler Yayınlar” eklentisini çoğu blogger kullanıyor. Bu eklenti; son 1 ay, son 1 hafta veya tüm zamanların en çok okunan yazılarını gösteren faydalı bir eklenti.

Blogger’ın çoğu gadgetı gibi popüler yayınlar gadgetını da özelleştirme şansımız var. Bu yazıda paylaşacağım kodlar ile popüler yazılar eklentisine ziyaretçilerin ilgisini çekecek ve blogunuzu daha orijinal gösterecek yıldızlı oylama sistemini ekleyeceğiz.

Bu özellik en popüler yazınızı 5 yıldızlı olarak gösterirken , sırasıyla 4,5 – 4 – 3,5 – 3… yıldız diye gidiyor. Uygulamak için sırasıyla şu adımları izleyin:

1. İlk olarak şablonda <head> kodunu bulun ve bunun altına font awesome kodunu ekleyin. Eğer daha önce font awesome kodunu eklediyseniz tekrar eklemenize gerek yok.

<link href='//netdna.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>

2. Şablonda ]]></b:skin> kodunu bulun ve üzerine şu stil kodlarını ekleyin.

.PopularPosts ul{background:#fff;list-style:none;margin:0;padding:5px 5px 0;overflow:hidden;border-top:none} .PopularPosts li,.PopularPosts li img,.PopularPosts li a,.PopularPosts li a img{margin:0;padding:0;list-style:none;border:none;background:none;outline:none} .PopularPosts ul{margin:0;list-style:none;color:#64707a} .PopularPosts ul li img{background:#fafafa;display:block;margin:0 10px 0 0;width:60px;height:60px;overflow:hidden;float:left;} .PopularPosts ul li{position:relative;background-color:#fff;margin:0;padding:.7em 0!important;border:0;position:relative;border-bottom:1px solid #F1F1F1} .PopularPosts ul li:before{font-family:fontawesome;content:'\f005\f005\f005\f005\f005';display:inline-block;position:absolute;color:#F29B10;text-align:center;bottom:0;right:0;margin:9px 0;font-size:11px;padding:0;font-weight:normal;line-height:normal;transition:all .3s} .PopularPosts ul li:nth-child(1):before{font-family:fontawesome;content:'\f005\f005\f005\f005\f005';} .PopularPosts ul li:nth-child(2):before{font-family:fontawesome;content:'\f005\f005\f005\f005\f123';opacity:.9} .PopularPosts ul li:nth-child(3):before{font-family:fontawesome;content:'\f005\f005\f005\f005\f006';opacity:.85} .PopularPosts ul li:nth-child(4):before{font-family:fontawesome;content:'\f005\f005\f005\f123\f006';opacity:.8} .PopularPosts ul li:nth-child(5):before{font-family:fontawesome;content:'\f005\f005\f005\f006\f006';opacity:.75} .PopularPosts ul li:nth-child(6):before{font-family:fontawesome;content:'\f005\f005\f123\f006\f006';opacity:.7} .PopularPosts ul li:nth-child(7):before{font-family:fontawesome;content:'\f005\f005\f006\f006\f006';opacity:.75} .PopularPosts ul li:nth-child(8):before{font-family:fontawesome;content:'\f005\f123\f006\f006\f006';opacity:.7} .PopularPosts ul li:nth-child(9):before{font-family:fontawesome;content:'\f005\f006\f006\f006\f006';opacity:.75} .PopularPosts ul li:nth-child(10):before{font-family:fontawesome;content:'\f123\f006\f006\f006\f006';opacity:.7} .PopularPosts ul li:hover:before{opacity:1} .PopularPosts ul li:first-child{border-top:none} .PopularPosts ul li:last-child{border-bottom:none} .PopularPosts ul li .item-title a,.PopularPosts ul li a{color:#333;font-size:13px;} .PopularPosts ul li a:hover{color:#2476e0;} .PopularPosts .item-thumbnail{margin:0;} .PopularPosts .item-snippet{display:none} .PopularPosts .item-title{font-weight:700;padding-bottom:.2em;padding:0 5px}

3. 3. Son olarak Yerleşim > Gadget Ekle > Popüler Yayınlar diyerek gadgetı ekleyin ve ayarları resimde görüldüğü gibi yapın.

Tıklanabilir Rastgele Banner Eklentisi

Önder Arslan 01:34 Add Comment

Bu yazıda paylaşacağım eklentiyi düzenleyerek blogunuza eklediğinizde kenar çubuğunda 300x250px boyutlarında (ya da istediğiniz başka bir boyut) bir banner gözükecek. Fakat bu eklentinin şöyle bir özelliği var; sayfayı yenilediğinizde veya bir yazıdan başka bir yazıya geçiş yapığınızda bannerın yerinde sizin belirlediğiniz başka bir banner gözükecek.

Eklentide 5 adet banner tanımladığınızı düşünelim. Her ziyarette bu 5 banner rastgele gözükecek. Peki bu eklenti ne işinize yarayacak?

1. Öncelikle tabi ki aynı reklam alanında birden fazla reklam gösterebileceksiniz. Fiyatı düşük tutsanız bile reklam verenler bunu kabul etmeyebilir ama dost sitelerinizin veya önerdiğiniz sitelerin reklamlarını bu şekilde dönüşümlü olarak gösterebilirsiniz.

2. Blogunuzda öne çıkan yazılan eklentisi olarak da kullanabilirsiniz. Ziyaretçilerinizin mutlaka okuması gerektiğini düşündüğünüz yazılar için banner oluşturarak rastgele gözükmesini sağlayabilirsiniz.

Gelelim eklentiyi blogunuza nasıl ekleyeceğinize. Blogger kumanda panelinize giriş yaparak Yerleşim > Gadget Ekle > HTML/JavaScript Gadget diyerek aşağıdaki kodları yapıştırmanız yeterli.

<script type='text/javascript'>
var quotes=new Array()
quotes[0]='<a href=https://bloghocam.blogspot.com><img alt="Blog Hocam" height="auto" width="100%" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIhyjLbype2OgckZGkqQLPbwFDEj1yYqi_6yqv470eN9MUafyzrlN5gXPKDLc5slvKx-nngNtffuuO3UddL10b86_VHj40EQSQv_V-hQk6Sw3iyfqErfhQ_pgSW6BFjwtW91jmKbqihcsW/s300/1.png"/></a>'
quotes[1]='<a href=https://bloghocam.blogspot.com><img alt="Blog Hocam" height="auto" width="100%" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNjfxY7adqv22HeSsZh5PDkX1sIx32LR4EMyQWs8FOM6yXij4knCB53JCSfJxpGbKDAWLqcld4m1OlZOcGR9fBVug61FxhaBmXcaXmlpZwSKs9EGMMCFBeJk66gmd9Nd2fxamD_yz2UsFK/s300/2.png"/></a>'
quotes[2]='<a href=https://bloghocam.blogspot.com><img alt="Blog Hocam" height="auto" width="100%" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPH7vTkhRnKeC7v16TCUIM1KpHK7DHH6sLzrb4Y7DCa-AWhUb8SlhzEjRIT_w0slTT8UfsW18R7l5roLQ8hlmMRxqrESG2EQTzIEsI38DKJ35LFTSTgah4OUel093jYHoyJNI1bacmQlGf/s300/3.png"/></a>'
var whichquote=Math.floor(Math.random()*(quotes.length));
document.write(quotes[whichquote]);
</script>

Mavi yerlere resme tıklanınca açılacak sayfanın urlsini yazın.
Kırmızı yerlere banner urlsini yazın.
Yeşil yerlere bannerın alt etiketini yazın.
4. banner için eklemeniz gereken kod:

quotes[4]='<a href="#"><img alt="#" height="auto" width="100%" src="#"/></a>'

Herkese iyi bloglar…

George Orwell: Boğulmamak İçin

Önder Arslan 01:47 Add Comment

İnsanlık savaşlarla, yıkımlarla, kibirle, hırsla yarattığı anafora çekiliyor her geçen gün. Nefes alamıyoruz. Boğuluyoruz. Bir parça huzurlu gökyüzü, bir parça kirletilmemiş toprak için kaçmaya, başka coğrafyalara, hatta başka hayatlara sığınmaya hazırız.

Hayatın sıkıcı rutininden kaçıp kendini ait hissettiği topraklara dönmeye karar veren George Bowling’in hikayesi yıllar öncesinden gelen bir Orwell romanında karşımıza çıkıyor. Yazarın çoğu kitabında olduğu gibi zamansız ve her dem taze. Üstelik – yazarın kahramanına bilge sözler söyletmeye çalıştığı yerler dışında- sıkıcı olabilecek bu konu, tam bir İngiliz mizahıyla kaleme alınmış.

Daha ilk satırından itibaren dudağınıza yerleşen bir tebessümle okuyacağınız Boğulmamak İçin belki Orwell’in en iyi romanı değil. Ama yaza hazırlanmaya başladığımız ve ‘büyük şehirden kaçma’ hayalleri kurduğumuz yaz aylarında iyi bir yol arkadaşı.

Brecht, yeniden...

Önder Arslan 11:27 Add Comment

Berliner Ensemble'dan Robert Wilson yorumuyla Üç Kuruşluk Opera'yı izledik.

Daha önce hem Berliner Ensemble, hem de Robert Wilson ile ilgili yazdım. Bu yorumu da beğenenler oldu, beğenmeyenler oldu. Wilson rejisi böyle bir şey, tam ikiye bölüyor izleyiciyi, ara bölge yok. Kimileri "üslubunu bütün metinlere yayan bir modernist" olarak görüyor, kimileri "aynı numarayı tekrar eden bir post-modern" olarak.

Üretimler üstüne tartışılması iyidir. Açık sözlü olmak lazım. Wilson'ın kurduğu plastik dünyayı seviyorum. Ama kimi zaman bu üslupçuluğun içeriğin önüne geçtiğini ve anlamı sarstığını da düşünüyorum. Uzun konu... Tiyatro üstatları dururken çenemi tutayım. Ama bir fırsat buluğumda, bu konu üstüne yazmak isterim...

Üç Kuruşluk Opera'yı izlerken daha çok Brecht'i düşündüm. Ankara'da geçen çocukluk ve gençlik yıllarında kimi zaman Devlet Tiyatroları ama çoğu zaman Ankara Sanat Tiyatrosu sayesinde izlediğim-öğrenmeye çalıştığım Brecht. (Meral Niron'un Cesaret Ana'sı hemen aklım düşüyor o günleri düşününce. Daha ne isimler, ne oyunlar...)

Yine o yıllarda Brecht okumak da bir tutku olmuştu benim için. Açıkçası çoğunu gerçek anlamlarıyla değerlendiremediğim, sindiremediğim, hatta açıkçası yanlış anladığım okuma günlerinden söz ediyorum. Bilen bilir, oyun okumak zaten zorludur ve uzmanlık ister. Şimdi düşünüyorum da, ne tuhaf bir okuma yolculuğu yaşamışım. Gençlik öyle bir hayal işte.

Peki bugün Türkiye'nin tiyatrosu Brecht'e ve eserlerine yeterince bakıyor mu?

Üç Kuruşluk Opera gösterimi sonrasında, Berliner Ensemble Genel Sanat Yönetmeni Claus Peymann'a bir Onur Ödülü verildi. Peymann, konuşmasında şöyle dedi: "Milliyetçiliğin ve muhafazakar politikaların yeniden yükseldiği bir dönemde, Bertolt Brecht, bize yeniden özgür edebiyatı, özgür basını ve özgür kültürü hatırlatacaktır."

Önemli bir cümle. Brecht'i yeninden okumak için yeterli ve heyecan verici. Tiyatrocularımızın bize Brecht'i yeniden izletmesi için de... Evet, Robert Wilson yorumunu izledik ama iddia ediyorum ki, Türkiye'de de zihnimizi açacak yorumları izletecek nice isim var.

Hadi daha da iddialı konuşayım. Tam da milliyetçiliğin ve muhafazakar politikaların yükseldiği bir coğrafyanın Brecht yoruları bütün dünyanın ilgisini çekecektir.

"Dünyada tiyatro uçup giderken hala Brecht mi?" diyenler olacaktır.

Hala Brecht'e baktıkları için uçmayı başarıyorlar.

Son söz niyetine iki cümle:

Brecht'ten yola çıkıp Haldun Taner'e de uğramak gerekiyor.

İnsan neyle yaşar?

Blogger Sidebar Abonelik Eklentisi

Önder Arslan 03:14 Add Comment

Blogunuzun sidebarına mail abonelerinizi ve sosyal medya takipçilerinizi arttıracak bir eklenti eklemek istiyorsanız çok beğendiğim bu yeni eklentiyi sizlere tavsiye edeceğim.

Geliştirilmeye ve kişiselleştirilmeye çok müsait olan bu eklenti ziyaretçilerinizin dikkatini çekerek özellikle FeedBurner mail abone sayınızın artmasını katkı sağlayacaktır. Eklentinin özelliklerinden kısaca bahsetmem gerekirse:

Mobil cihazlara uyumludur ve sorunsuz görüntülenmektedir.
Sadece 3 adet kod değişikliğiyle eklentinin renklerini blogunuzun tasarımıyla uyumlu hale getirebilirsiniz.
Font Awesome kullanılarak şık ve hızlı sosyal butonlar eklenmiştir.
Blogger’da son zamanlarda HTTPS’e geçişle birlikte yaşanan sorunlardan etkilenmeyecek şekilde düzenlenmiştir.

Blogger Sidebar Abonelik Eklentisi Nasıl Eklenir?

Öncelikle şablonun HTML kodlarına yukarıda bahsettiğim Font Awesome’ı eklemeniz gerekiyor. Bunun için Blogger kumanda panelinizde Şablon > HTML’yi Düzenle yolunu takip edin ve <head> kodunun altına şu kodu ekleyin:

<link href='https://netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.css' rel='stylesheet'/>

Ekledikten sonra şablonu kaydedin ve ikinci adım için yine Blogger kumanda panelinde Yerleşim > Gadget Ekle > HTML/JavaScript Gadget yolunu takip ederek aşağıdaki kodları yapıştırın:

<style>
#sidebar-abonelik {
padding: 0;
padding-bottom: 5px;
font-family: inherit;
display: block;
margin: 0;
width: 100%;
border-radius: 10px;
border: 0;
background: #363636;
}
#sidebar-abonelik .main_tagline {
padding: 0px 0px;
line-height: 2.5em;
font-size: 24px;
margin: 0;
height: 95px !important;
overflow: hidden;
font-weight: bold;
color: #FFF;
text-align: center;
border-radius: 10px 10px 0 0;
background-color: #679EC9;
}
#sidebar-abonelik .email_icon {
display: table;
margin: -35px auto 0px;
font-size: 25px;
padding: 12px;
height: 25px;
width: 25px;
background-color: #363636;
color: #FFF;
border-radius: 50px;
border: 10px solid #FFFFFF;
line-height: 0;
}
#sidebar-abonelik p {
font-size: 14px;
color: #F9F9F9;
text-shadow: 0px -1px 0px #000;
line-height: 27px;
padding: 5px 10px 5px;
text-align: center;
width: 80%;
margin: 5px auto 20px;
border-bottom: 2px solid #6A6A6A;
border-radius: 20px;
}
#sidebar-abonelik .rssform {
padding: 0;
margin: 0 auto;
display: block;
}
#sidebar-abonelik .rssform input {
padding: 8px;
margin: 20px auto 15px;
font-size: 12px;
color: #000;
text-align: center;
display: block;
font-family: inherit;
font-weight: normal;
width: 90%;
height: 38px;
outline: none !important;
border: 1px solid #FFFFFF;
border-radius: 1px;
background-color: #FCFCFC;
box-sizing: border-box !important;
}
#sidebar-abonelik .rssform .button:hover {
background: #656E75;
}
#sidebar-abonelik .rssform .button {
background: #679EC9;
color: white!important;
border: 1px solid #FFFFFF;
margin-top: 15px;
outline: none !important;
transition: all .3s ease-in-out;
padding: 5px 2px !important;
float: none;
font-size: 16px;
font-weight: bold;
cursor: pointer;
}
#sidebar-abonelik .bottom_lock_policy {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfDXa3hWSkED7AxmZWbDdKSVoM3c6JXIGwKpmeeqb8Ca7dcVoT6V6deXdOnKxZH9qx8VfzaN30tTnVK0Aezgad2V9hdLqneRw_J1T4zJc65yQYJU8uvvEiczIcDt-dkUBrow-OHtI5qgsB/s24/Keys-icon.png) no-repeat 3% -2px;
color: #959595;
text-align: center;
font-size: 12px;
margin: 0;
padding: 1px;
line-height: 25px;
}
#sidebar-abonelik .bottom_lock_policy a {
color: #959595;
text-decoration: none !Important;
}
#sidebar-abonelik .social_profiles {
line-height: 1.2em;
display: table;
float: none;
margin: 0px auto;
text-align: center;
min-width: 157px;
padding: 5px 0px;
border: 0;
}
#sidebar-abonelik .social_profiles a:hover {
color: #FFF;
background-color: #679EC9;
border-color: #FFF;
}
#sidebar-abonelik .social_profiles a {
color: #000000;
margin: 0 5px;
text-align: center;
float: left;
display: table;
padding: 4px 5px;
background-color: #FFFFFF;
border-radius: 50px;
border: 2px solid #2D2D2D;
width: 15px;
height: 15px;
line-height: 0;
font-size: 16px;
transition: all 0.3s ease-in-out;
-webkit-transition: all 0.3s ease-in-out;
}
#sidebar-abonelik form {
margin-bottom: 10px !important;
}
</style>
<div id="sidebar-abonelik">
            <div class="main_tagline">E-Posta Aboneliği</div><div class="email_icon"><i class="fa fa-envelope"></i></div>
                 <p>Yeni yazıların ücretsiz olarak mail adresinize gelmesi için abone olun!</p>
   <div class="rssform">
            <form action="https://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('https://feedburner.google.com/fb/a/mailverify?uri=BlogHocam', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
            <input type="text" name="email" placeholder="E-Mail adresiniz..." />
            <input type="hidden" value="BlogHocam" name="uri" />
            <input type="hidden" name="loc" value="tr_TR" />
            <input value="Abone Ol" class="button" type="submit" />
            </form>
            </div>
      <div class="bottom_lock_policy">Gizliliğinize saygı duyuyoruz</div>
   <div class="social_profiles">
   <a href="https://www.facebook.com/BlogHocam" target='_blank' rel='nofollow' title="Facebook'ta Takip Et"><i class="fa fa-facebook"></i></a>
   <a href="https://www.twitter.com/BlogHocam" target='_blank' rel='nofollow' title="Twitter'da Takip Et"><i class="fa fa-twitter"></i></a>
   <a href="https://plus.google.com/+BloghocamBlogspot" target='_blank' rel='nofollow' title="Google+'da Takip Et"><i class="fa fa-google-plus"></i></a>
   <a href="https://instagram.com" target='_blank' rel='nofollow' title="Instagram'da Takip Et"><i class="fa fa-instagram"></i></a>
   </div>
            </div>

Kaydettikten sonra eklentinin eklendiğini görecekseniz. Kodlarda değiştirmeniz gereken yerler şöyle:

Kırmızı renkle gösterdiğim yerlere kendi sosyal medya hesaplarınızın URL’lerini yazın.
Lacivert renkle gösterdiğim yerlere kendi FeedBurner ID’nizi yazın.
Mavi vurguyla gösterdiğim yerlere ise istediğiniz bir renk kodunu girin. Bu şekilde E-Posta Aboneliği başlığının arka plan rengini, Abone Ol butonunun arka plan rengini ve sosyal butonların üzerine gelindiğindeki rengi değiştirebilirsiniz.

onderArslan