25 Haziran 2012 Pazartesi

“Yazı Kaç Kez Okundu?” Eklentisi

Blogunuzda yayınladığınız bir yazının kaç kez okunduğunu Analytics veya benzeri araçlarla detaylı bir şekilde görebilirsiniz ancak bunu her yazının başında veya sonunda okuucularına göstermek isteyen blogcular da olabilir.O yüzden bu eklentinin işe yaraycağını düşündüm ve paylaşmaya karar verdim.

 

Öncelikle birkaç uyarıda bulunmak istiyorum.Bu eklenti ile yazıyı kaç kişinin okuduğunu değil, kaç kez okunduğunu görebiliyorsunuz.Yani o yazıya her girildiğinde sayıda artış olacaktır.Bu yüzden çok doğru sonuçlar vermeyebilir ve kolayca manüpile edilebilir.

 

“Yazı Kaç Kez Okundu?” Eklentisi

 

Resimde gördüğünüz örnekte ben eklentiyi yazının hemen altına ekledim.Anlatımı da bu şekilde yapacağım.İsterseniz farklı bir yere de ekleyebilirsiniz.

 

Eklentiyi blogunuza eklemek için şablonunuzdan ]]></b:skin> kodunu bulun ve hemen üstüne aşağıdaki kodları ekleyin.

 

.ziyaretci-sayac{
background-image:
url(http://icons.iconarchive.com/icons/deleket/soft-scraps/16/Document-Copy-icon.png)
; background-position: 1em 1em; background-repeat:
no-repeat; background-color: #Fff; width: 50%; border:1px
#333 solid; padding: 1em; padding-left: 70px;
color: #ff2a00;-moz-border-radius:5px;-khtml-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;margin:5px;
}

 

İkinci olarak şablonunuzdan <div class='post-footer'> kodunu bulun ve hemen üstüne aşağıdaki kodları ekleyin.

 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
function setC(visitors, value){
var expireDate=new Date (2099, 12, 31);
document.cookie = visitors + "=" + escape(value) + ((expireDate == null) ? "" : ("; expires=" +
expireDate.toGMTString())) }
function readC(visitors){
var search = visitors + "=";
var i, j;
if (document.cookie.length > 0) {
i = document.cookie.indexOf(search);
if (i != -1) {
i += search.length;
j = document.cookie.indexOf(";", i);
if (j == -1) j = document.cookie.length;
return unescape(document.cookie.substring(i,j));
} } }
var num;
num=readC("visitors");
if (!num) num=0;
num++;
setC("visitors", num);
document.write("<div class='ziyaretci-sayac'>");
document.write("<b>Bu yazı daha önce "+num+" kez okundu.<\/b>");
document.write("<\/div>");
//]]>
</script>
</b:if>

 

Eklentiyi sadece kayıtları okumak için içine girdiğinizde gözükecektir.Blogunuzun ana sayfasında gözükmez.

22 Haziran 2012 Cuma

Yemek Siparişinde Tek Bir Restorana Bağlı Kalma Devri Kapandı!

Öyle bir yemek sipariş sitesi düşünün ki ister evde, ister yolda, isterseniz işte olun binlerce yemek çeşidinden biri en hızlı şekillde ayağınıza gelsin.Üstelik farklı ödeme seçenekleri sayesinde hiç bir güvenlik sorunu yaşamadan. Ben bu şekilde kusursuz hizmet veren bir site tanıyorum: www.istelezzet.com

Yemek Siparişi Sepet ile Taşınmaz...:) from Istelezzet on Vimeo.


Istelezzet.com’un kullanışlı internet sitesi ve mobil aplikasyonu sayesinde kolayca siparişinizi verebiliyorsunuz.Üstelik verdiğiniz her siparişte biriken puanlarınızla ücretsiz yemek siparişi verebiliyorsunuz.

Istelezzet.com’un en beğendiğim özelliği ise bize tek seferde farklı firmalardan sipariş verebilme imkanı sunması. Ayrıca www.istelezzet.com’da ne yiyeceğine karar veremeyenler de düşünülmüş ve Karasızım isimli bir servis oluşturulmuş. Bu servis bulunduğunuz yere en yakın ve size en uygun seçenekler önererek seçim yapmanıza yardımcı oluyor.

Zengin restoran seçenekleri, ihtiyaca göre menü belirleme ve menü fiyatlarını sürekli güncel tutma gibi özellikleriyle sizi fazlasıyla tatmin edecek bir site olan istelezzet.com, bünyesindeki işletmeleri sürekli kontrol ederek kullanıcılarına kaliteli ve sağlıklı servis sunmayı da ihmal etmemiş.

Bir bumads advertorial içeriğidir.

20 Haziran 2012 Çarşamba

Click Box Eklentimi Paylaşıyorum

Blogumun sidebarında en üstte gördüğünüz Facebbok beğen, Twitter takip et ve Google +1 butonlarından oluşan bçölüme Click Box adını vermiştim.Bu bölbutonları ilk eklediğimde sizden güzel tepkiler almıştım.O günden beri yorumlarda ve mesajlarda bu Click Box’ın nasıl yapıldığını soran çok kişi oldu.Sanırım artık paylaşma zamanı geldi.

 

Kodların gadget olarak kolayca eleyebilmeniz olabildiğince sadeleştirdim.Bazı okuyucular butonlardan sadece 1 veya 2 tanesini kullanmak istediği için kodları ayrı ayrı paylaşıyorum.Yapmanız gereken sayfa adreslerini kendi adreslerinizle değiştirmek ve kodları HTML/JavaScript olarak kenar çubuğunuza eklemek.

 

Facebook Beğen Butonu

 

Click Box Facebook

 

İlk olarak Facebook beğen butonu ile başlayalım.Burada değiştrmeniz gereken tek yer http://bloghocam.blogspot.com/ yazan yer.Buraya beğen butonua basıldığında hangi sayfanın beğenilmesini istiyorsanız onun adresini yazın.Blogunuz veya Facebook sayfanız olabilir.

 

<style>
#clickface {width:256px; height:23px; margin-top:5px; padding-top:11px; padding-bottom:10px; border:1px solid #d8d7d7;  padding-left:10px; margin-bottom:10px;margin-left:5px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia6SEl89dlV_ZCkeutIUeJodm7JgaDZXwH7XKfwyXL41WtjUjgNAE22PvzfuuQN_gb3MtjgB9rmOrGOcGZEc65CMttl0OhorEVZb5ypmvPKK-wwbDnqu-Na1n67qnJq33KQryUng9hZy_s/s265/face.jpg);
-webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px}
</style>
<div id="clickface">
<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/tr_TR/all.js#xfbml=1";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="http://bloghocam.blogspot.com/" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div></div>

 

Twitter Takip Et Butonu

 

Click Box Twitter

 

İkinci  paylaşacaım kodlar click box’ın Twitter takip et butonuna ait kodlar.Burada da değiştirmeniz gereken tek yer var. http://twitter.com/bloghocam yerine kendi Twitter adresinizi yazın.

 

<style>
#clickfollow {width:256px; height:23px; margin-top:5px; padding-top:11px; padding-bottom:10px; border:1px solid #d8d7d7;  padding-left:10px; margin-bottom:10px;margin-left:5px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoVy-gPaKpPpyoL2rxBDWdmH66yOFjAaROG2oMtkIbZVWNffnOCoMGGfRXy-V1_Z44G9erj8_P_nAIERGErAJ7nHouMF34qe_Y9xYWIjir-uXi3V3OzjEwLJKaJNIRUJHJsJi86gCcmYNq/s280/twitter.gif);
-webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px}
</style>
<div id="clickfollow">
<a href="http://twitter.com/bloghocam" class="twitter-follow-button" data-lang="tr">Follow @bloghocam</a>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>
</div>

 

Google +1 Butonu

 

Click Box +1

 

Son olarak Google +1 butonun kodlarını paylaşacağım.Burada da değiştirmeniz gereken sadece bir yer var. http://bloghocam.blogspot.com yerine kendi blogunuzun adresini yazın.

 

<style>
#clickplus {width:256px; height:23px; margin-top:5px; padding-top:11px; padding-bottom:10px; border:1px solid #d8d7d7;  padding-left:10px; margin-bottom:10px;margin-left:5px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKyM396uflBlWPYRL-_hyphenhyphenA3p0qm5JmH5NylrTnZkAw14RH_F7hehbVUIcvUwhGjd8AoaFFi1Zr48WTzVzLCkANUvLwM46vTyqkWaa8Avez2gAO9wYWZbMDx1ViackqVAI3RuQOkLpeWnFP/s265/plus.jpg);
-webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px}
</style>
<div id="clickplus">
    <g:plusone size="medium" href="http://bloghocam.blogspot.com"></g:plusone>


<script type="text/javascript">
  window.___gcfg = {lang: 'tr'};

  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script></div>

 

Eğer bu eklentiyi beğendiyseniz aşağıdaki paylaşım butonlrını kullanarak yazıyı arkadaşlarınızla paylaşın.Ayrıca Click Box’taki beğen, takip et ve +1 butonlarna henüz tıklamadıysanız hemen şimdi tıklayabilirsiniz.

18 Haziran 2012 Pazartesi

SONY, XPERIA U'yla Yine Yapmış Yapacağını!

PrintXperia ailesinin en renkli, en eğlenceli çocuğu XPERIA U’da fizy müzik uygulaması telefonun her yerinde. İstediğiniz şarkıyı aratıp, anında dinleyebilir, Xloud ve 3D surround ses teknolojisiyle HD kalitesinde müzik keyfini yaşayabilirsiniz. Xperia U’ya entegre olarak gelen fizy sayesinde, müzik çalarda dinlediğiniz herhangi bir şarkının farklı versiyonlarını ya da şarkıcının diğer tüm şarkılarını fizy üzerinden aratıp ve dinleyebilirsiniz. Bununla birlikte Haziran sonunda gerçekleşecek TrackID güncellemesiyle, TrackID uygulaması üzerinden radyoda veya sokakta duyduğunuz bir müziğin ne olduğunu bulup, fizy’de aratma ve dinleme imkanına da sahip olacaksınız.



Xperia U gençler ve kendini genç hissedenler için özel olarak tasarlandı. Altındaki şeffaf bant, albüm kapağının veya resimlerin renklerine göre renk değiştiriyor. Üstelik Xperia U’yu değiştirilebilir alt kapaklarla da istediğiniz gibi kişiselleştirebilirsiniz.

Diyelim ki, tam fotoğraflık bir kare var. O anda çektiniz çektiniz. XPERIA U’nun bir saniyede çekim moduna geçme özelliğiyle, bu kareyi kaçırmanız imkansız. 5 Megapiksel kamerasıyla mükemmel fotoğraflar çekebilirsiniz. Üstelik 720p HD video çekim özelliğiyle gelsin bombastik videolar!

Xperia U, akıllı telefon dünyasına renk katacağa benziyor. Akıllı, eğlenceli, renkli, karizmatik… Tek kelimeyle stil sahibi bir telefon.

Daha fazla bilgi için tıklayın.

Bir bumads advertorial içeriğidir.

Yazıları Çerçeve İçine Almak

Bugüne kadar kullandığım ve tasarladığım temalarda yazı alanını hep bir çerçeve içine almayı tercih etmişimdir.Yazılarım genelde uzun, görselerle destekli ve kod içeren yazılar olduğu için Resimli Devamını Oku eklentisi kullanarak ana sayfada yazının küçük bir bölümünü gösteriyorum ve bu bölümleri çerçeve içine alarak birbirinden ayırıyorum.

 

İletişim formundan bunun nasıl yapıldığını soran çok mesaj aldım.Bu yazıda yazılarınızı nasıl çerçeve içerisine alacağınızı ve bu çerçevelere nasıl stil vereceğinizi anlatacağım.

 

1. Klasik ve basit bir çerçeve ile başlayalım

 

Blogger Yazıları Çerçeve İçine Alma

İlk örnek en basit çerçeve örneği olsun.Resimde gördüğünüz gibi yazılarınızı 1 pixel kalınlığında siyah bir çerçeve içine almak için ]]></b:skin> kodundan önce şu kodu ekleyin:

 

.post { border:1px solid #000; padding:8px }

 

2. Çerçevenin kalınlığını ve rengini değiştirelim

 

Blogger Yazıları Çerçeve İçine Alma

İkinci örnekte çerçevinin kalınlığını 3 pixele çıkaralım ve rengini kırmızı yapalım.Bunun için kodları şu şekilde değiştiriyoruz:

 

.post { border:3px solid #ef1010; padding:8px }

 

3. Çerçeve şeklini noktalı yapalım

 

Blogger Yazıları Çerçeve İçine Alma

Üçüncü ve dördüncü örnekte çerçevenin şeklinde yapabileceğiniz değişiklikleri göstermek istiyorum.Öncelikle noktalı çerçeve yapalım.Örneğin çerçevemiz 2 pixel kalınlığında, siyah renkte ve noktalı olsun.Bunun için eklememiz gereken kod şu:

 

.post { border:2px dotted #000; padding:8px }

 

4. Çerçeve şeklini çizgili yapalım

 

Blogger Yazı Alanına Çerçeve Ekleme

Çerçevemizin şeklini noktalı yapmanın dışında bir başka sık kullanılan yöntem de çizgili yapmaktır.Bunun için de kırmızı renkli, 1 pixel kalınlığında ve çizgili bir çerçreve örneği verelim.Eklememiz gereken kod şu:

 

.post { border:1px dashed #ef1010; padding:8px }

 

5. Oval köşeli çerçeve yapalım

 

Blogger Yazıları Çerçeve İçine Alma

Bu ve bundan sonra göstereceğim örnekte kullanacağımız yöntem CSS3 olduğu için Internet Explorer gibi çağ dışı tarayıcılarda çalışmaz.Bu örnekte yazımızı 1 pixel kalınlığında, siyah renkli ve 10 pixel yarıçapında oval köşeli bir çerçeve içine alacağız.Eklememiz gereken kod şu:

 

.post { border:1px solid #000; padding:8px;-moz-border-radius: 10px;-webkit-border-radius: 10px;border-radius: 10px; }

 

6. Oval köşeli noktalı çerçeve yapalım

 

Blogger Yazıları Çerçeve İçine Almak

Son olarak oval köşeli çerçevinin şeklini noktalı , kalınlığını 2 pixel ve yarıçapını 20 pixel yapıp bir çerçeve oluşturarak yazıyı bitirelim.Ekleyeceğimiz kod şu:

 

.post { border:2px dotted #000; padding:8px;-moz-border-radius: 20px;-webkit-border-radius: 20px;border-radius: 20px; }

 

Son Söz

Olayın mantığını anlamanız için bu kadar örneğin yeterli olduğunu sanıyorum.Bundan sonra kendiniz de çeşitli kombinasyonlar oluşturarak farklı çerçeveler kodlayabilirsiniz.Sormak istediğiniz bir şey olursa yorum yazarak sorabilirsiniz.Bu arada yazıyı oluşturmak için epey zaman harcadım.Faydalı bir yazı olduğunu düşünüyorsanız aşağıdaki paylaşım butonlrını kullanarak yazıyı paylaşın lütfen.