29 Mart 2013 Cuma

En İyi 10 Kişisel Blog Teması

Kişisel blog sahibi bloggerlar, bloglarına uygun bir tema bulmakta zorlanabilirler. Kişisel bloglar insanların kendi düşüncelerini paylaştığı, samimi bloglardır. Dolayısıyla kişisel bir blogun tasarımı da sıcak samimi ve kişisel blogun ruhuna uygun olmalıdır. Aşağıda Blogger platformuna ait en beğendiğim kişisel blog temalarından bir derleme yaptım. Umarım beğenirsiniz.

 

1. Sunrise Blogger Template

 

sunrise blogger template

DEMO & DOWNLOAD

 

Özellikler: Açılır menü, manşet slayt, resimli otomatik devamını oku, özelleştirilmiş yorum bölümü, yukarı çık butonu, sosyal takip butonları.

 

 

2. WebDesign Blogger Template

 

Webdesign blogger template

DEMO & DOWNLOAD 

 

Özellikler: Yatay menü, manşet slider, resimli otomatik devamını oku, 4 sütunlu footer alanı, sayfa numaralandırma, yazar kutusu.

 

 

3. Timeline Blogger Template

 

Timeline Blogger Template

DEMO & DOWNLOAD 

 

Özellikler: Tek sütunlu, yatay menü, özel post footer, 3 sütunlu footer alanı, zaman tüneli tarzında tasarım.

 

 

4.  Espada Blogger Template

 

espada blogger template

DEMO & DOWNLOAD 

 

Özellikler: Yatay üst menü, özel post footer tasarımı.

 

 

5. Leatherbound Blogger Template

 

Leatherbound blogger template

DEMO & DOWNLOAD

 

Özellikler: Şık tasarım.

 

 

6. My Wall Blogger Template

 

My Wall Blogger Template

DEMO & DOWNLOAD 

 

Özellikler:  Resim tabanlı tasarım, sol sidebar sabit, özel sosyal paylaşım butonları.

 

 

7. Lummoxie Blogger Template

 

lummoxie blogger template

DEMO & DOWNLOAD

 

Özellikler: Üst menü, özel yorum bölümü, şık tasarım.

 

 

8.  My Personal Diary Blogger Template

 

my personal diary blogger template

DEMO & DOWNLOAD 

 

Özellikler: Resim tabanlı tasarım,

 

 

9. CherryTruffle Blogger Template

 

CherryTruffle blogger template

DEMO & DOWNLOAD 

 

Özellikler: Üst menü, yatay açılır menü, sosyal takip butonları, resimli otomatki devamını oku, sayfa numaralandırma, 3 sütunlu footer alanı, özelleştirilmiş yorum bölümü.

 

 

10. Compartidisimos Blogger Template

 

compartidisimo blogger template

DEMO & DOWNLOAD

Özellikler: Üst menü, sabit manşet, resimli otomatik devamını oku, 3 sütunlu footer, özelleştirilmiş yorum bölümü.

 

 

Araştır, toparla, düzenle… derken epey uğraştım bu yazıyı hazırlamak için. Alttaki butonları kullanarak sosyal ağlarda paylaşırsanız sevinirim.

27 Mart 2013 Çarşamba

BH Okuyucuları Blogunuzu Listeye Ekleyin!

Son günlerde sıkça karşılaştığım Listly adında bir araç var. Bu araç ayesinde sosyal listeler oluşturabiliyorsunuz. Sosyal listeler derken; sizinle birlikte diğer arkadaşlarınızın da listeye yeni öğe ekleyebildiği, oylama ve yorum yapabildiği listeleri kastediyorum.

 

Ben de Listly aracını kullanarak “Blog Hocam Okuyucalarının Blogları” isimli bir liste oluşturdum ve bu blogu takip eden blog yazarlarının bloglarını listelemek istedim. Bu sayede hem bloglarınızın tanıtımını yapmış olacaksınız hem de birbirimizin bloguna misafir olmak için bir blog havuzumuz olacak. Tabi bu listeyi sizin yardımlarınızla oluşturacağız.

 

 

Blogumu Listeye Nasıl Ekleyebilirim?

 

1. Buradan listemizin bulunduğu sayfaya giderek pembe renkli Add to List butonuna basın.

2. Listly ile kullandığınız sosyal ağlardan birini bağlamadıysanız size bunlardan birini bağlamanızı isteyecek. Kullandığınız bir sosyal ağ ile Listly’ye bağlanın.

3. Listly’ye bağlandıktan sonra tekrar Add to List butonuna tıklayın ve açılan pencereden mavi renkli Item With Link seçeneğini seçin.

4. Kutuya blog adresinizi yazın ve etiket, başlık, açıklama, logo gibi detayları tamamladıktan sonra blogunuz listeye eklenecektir.

 

Blogunuzu listye ekledikten sonra listedeki diğer blogları değerlendirebilirsiniz. Örneğin beğendiğiniz vetakip ettiğiniz bloglara + oy kullanabilir, ya da tam tersi içeriği hoşunuza gitmeyen bloglara oy kullanabilirsiniz. Dilerseniz bloglar hakkındaki görüşlerinizi yorum olarak da belirtebilirsiniz.

 

listly

 

Hepinizi listeye davet ediyorum. Umarım davetime icabet edersiniz :)

25 Mart 2013 Pazartesi

Blog Hocam DMOZ’da! Ama Nasıl?

Blog Hocam’ı açtığımdan beri DMOZ’a kayııt olmak ve DMOZ ile ilgili bir yazı yazmak aklıma gelmemişti. Geçtiğimiz ay konuyla ilgili bir tartışmayı okuyunca henüz DMOZ başvurusu yapmadığımı hatırladım ve Blog Hocam’ı DMOZ’a eklemek için kolları sıvadım. Kolları sıvadım derken aşağıdaki adımlar dışında hiç ekstra hiç bir şey yapmadım. Kişisel blog katgorisine giderek yönergelere uygun başvurumu yaptım ve yaklaşık 1 ay sonra DMOZ’da arama yaptığımda dizine eklendiğini gördüm. Sonra da bu yazı çıktı ortya :)

 

dmoz

 

DMOZ Nedir?

 

DMOZ, web sitelerinin gönüllü editörler tarafından konularına göre ayrılarak yayınlandığı açık dizin projesidir. DMOZ, web'in en büyük ve en popüler arama motorlarının ve portallarının dizin hizmetlerini güçlendirmektedir. .Bu arama motorlarından biri de Google’dır.

 

DMOZ’a kayıt olmanın önemi buradan gelir. Google, Yahoo gibi yüzlerce arama motoru dizin servisi olarak DMOZ verilirini kullanır ve DMOZ’a eklenen sitelere daha çok önem verir.

 

Sitemi DMOZ’a Nasıl Ekleyebilirim?

 

DMOZ’a site eklemek tamamen ücretsizdir ancak amaç kaliteli bir dizin oluşturmak olduğu için her başvuru kabul edilmez. Şimdi gelin sitenizi DMOZ’a adım adım nasıl ekleyeceğinizden bashsedelim.

 

1. Siteniz Uygun mu?

 

Sitenizin DMOZ’a eklenmesi için bazı kurallara uygun olması gerekir. Bunların başında sitenizin çocuk pornografisi, hakaret ve iftira, fikir ve sanat eseri haklarını çiğneyen materyaller, ve yasa dışı etkinliklerin (sahtecilik ve şiddet gibi) savunuculuğunu yapan materyaller gibi yasa dışı içerik barınıdırmaması gerekir. Ayrıca yeterli içeriğe sahip olmayan ve henüz tamamlanmamış sitelerin başvuruları da kabul  edilmez.

 

2. Doğru Kategoriyi Seçin

 

DMOZ’da dtaylı ir kategori yapısı vardır. Başvurunuzun kabul edilmesi için sitenize en uygun kategoriyi bulmanız gerekir. Başvurunuzu sadece tek bir kategoriye yapmalısınız. Uygun olmayan veya alakasız kategorilere gönderilen siteler reddedilebilir veya silinebilir. Sitenizin konusuna en uygun kategoriye girdikten sonra üstteki adres öner linkine tıklayarak başvuru aşamasına geçebilirsiniz.

 

3. Formu Doğru Bir Şekilde Doldurun

 

Başvuru formundaki her öğenin altında o öğeyle ilgili gerekli bilgi yer alır. Formu doldururken objektif ve gerçekçi bir şekilde doldurmalısınız. Reklam amaçlı anahtar kelimlerle dolu bir başvurunun kabul edilmesi söz konusu olmaz.

 

4. Onay Süreci

 

Başvurunuzu yaptıktan sonra o kategorinin editörü sitenizi dizine ekleyip eklememeye karar verir. Başvurunun değerlendirilme süresi o kategoriye yapılan başvuru yoğunluğuna ve editörün bu işe yeterince zaman ayırıp ayırmamasına bağlı olarak birkaç hafta hatta birkaç ayı bulablir.

 

Hepinize bu başvuru sürecinde bol şans dilerim. Çünkü bu iş biraz da şans işi :)

23 Mart 2013 Cumartesi

Twitter’da Tweet Geçmişini İndirme

Twitter, geçtiğimiz yıl Aralık ayında Tweet geçmişini indirme özelliğini bazı ülkelere açmıştı ancak Türkiye bu ülkeler arasında yoktu. 22 Mart itibriyle Türkçe’nin de arlarında bulunduğu 12 dil için Tweet geçmişini indirebilme özelliği duyuruldu.

 

Tweet Arşivini Nasıl İndirebilirim?

 

Tweet Geçmişini İndirme

 

Tweet arşivinizi indirmek için sağ üst taraftaki çark ikonuna tıladıktan sonra açılan menüden Ayarlar’a tıklayın. Sayfanın alt tarafında Arşivini iste butonu göreceksiniz. Bu butona tıkladıktan sonra arşivinizin oluşturulduğu ve en kısa sürede e-posta adresinize gönderileceğini bildiren bir uyarı mesajı alacaksınız. 1-2 dakika içerisinde Tweet arşivinizi indirmeniz için gerekli olan link e-posta adresinize gönderilir.

 

Twitter Geçmişi

 

E-posta adresinize gelen postayı açtığınızda indirme linkini göreceksiniz. Bu linke tıklayarak indirme sayfasına ulaşabilirsiniz. Bilgisayarınıza indirdiğiniz tweets.zip dosyasını ayıkladığınızda index.html şeklinde bir dosya göreceksiniz. O dosyayı web tarayıcınızda açarak tüm Tweet geçmişinize ulaşabilirsiniz.

 

Tweet Geçmişi

 

Bu yeni haberi verdikten sonra sizleri Blog Hocam Twitter hesabını takibe davet ediyorum. Blog Hocam Twiiter sayfasına sadece yeni yazılarımı paylaşmıyorum. Sosyal medya, blog dünyası, SEO ve dijital pazarlamaya dair haberleri beğendiğim yazıları, tavsiye ettiğim blogları da tweetliyorum. Ayrıca blogcuları ilgilendireceğini dşündüğünüz yazılarınızı mentionlamanız halinde retweet ediyorum.

 

http://twitter.com/BlogHocam

22 Mart 2013 Cuma

Yeni Jquery Otomatik Galeri Slider

Daha önce bir kaç farklı slider eklentisi paylaşmıştım. Blogunuzun başlığı ile yazı bölümü arasına ekleyeblieceğiniz bu sliderlar sayesinde öne çıkarmak istediğiniz yazıları otomatik slayt gösterisi olarak gösterebiliyorsunuz. Daha önce paylaştığım benzer sliderlar şunlardı:

 

- Minimal Yatay Slayt Eklentisi

- Slayt Manşet Eklentisi

- Slayt Manşet [ JavaScript Versiyonu ]

 

Bu yazıda paylaşacağım eklenti de Jquery script kullanılarak yapılmış çok şık bir slider. Üstelik blogunuza çok kolay bir şekilde ekleyebilirsiniz. Silder’ın örnek resmini verdikten sonra lafı fazla uzatmadan slider’ın eklenmesine geçmek istiyorum.

 

Yeni Jquery Otomatik Galeri Slider

Bu slider’ı blogunuza eklemek için Blogger kumanda paneline giriş yaptıktan sonra yerleşim sekmesini açın. Burada üst bilgi gadgetının hemen altındaki gadget ekle linkine tıklyarak listenen HTML/JavaScript gadgetı seçin ve aşağıdaki kodları ekleyin.

 

Gadget ekle

 

<style type="text/css">

.container1 {
width: 660px;padding: 0;margin: 0 auto;
}
.folio_block {
position: absolute;left: 50%; top: 50%;margin: -140px 0 0 -395px;}
.main_view {float: left;position: relative;}
.window {-moz-box-shadow: 0px 0px 5px #303030;
-webkit-box-shadow: 0px 0px 5px #303030;
box-shadow: 0px 0px 5px #303030;border:1px solid #000000;height:240px; width: 660px;
margin-top:15px;overflow: hidden; position: relative;
}
.image_reel {
position: absolute;top: 0; left: 0;
}
.image_reel img {float: left;}
.paging_btrix {
position: absolute;bottom: 10px; right: -7px;width: 178px; height:47px;z-index: 100; text-align: center;
line-height: 40px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhm35NW0qBp2yIYXKrgmmVGsHdfwPQJHhiu5Ewdlis01eyLLoznzg4jkf60daPbWJfpdCNg-k4Vt7w-ks46YBriX_n6YjkMnK2EYjh0OLOU2Za_KrZWY6t7vsTk7KQEId-WxL2VrrSGejis/s179/serit.png) no-repeat;
display: none;
}
.paging_btrix a {
padding: 5px;text-decoration: none;color: #fff;
}
.paging_btrix a.active {
font-weight: bold; background: #920000; border: 1px solid #610000;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
}
.paging_btrix a:hover {font-weight: bold;}
</style>

<div class="container1">
<div class="main_view">
    <div class="window">
        <div class="image_reel">
            <a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8oSWytHxEnnfSNQnsbrbiqXo7zk4h5Vu5QgReRwdgdKpncckE7l-GJsqIQDGWlUWewepDxs__7g431tG5xThwzEdbTaYRf3m_-MiCcZIRVxGnfuZIP5LxZS0ug59z-lfn_AVLffcrIkn0/s660/resim1.jpg" alt="" /></a>
            <a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhe_BAi158uonmU-TSsKSZA9NWV9vQqDQzjqv4hodLe5mBFgQgGy-NfBzNIDtTcHM_U5Fi-9YfqG4-BvU2JyFSO75cCdceS0GPZAmzpRdx6jdmmjo_l820Bi7fO0rnh2gg9n5E7GgOK2u75/s660/resim2.jpg" alt="" /></a>
            <a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9aY3bYgY2Ofv8kkiCbb2d8FRbeUip2nH6A39LYpNeuwR98T_eIJ5Puhms7uTFsekIDs0c9LrkQgGoMWS-Fat9w7hiblDHuL7GfCq2Tj4qdfHFLOjhyphenhyphenKH8sXQSPPOwPVEiZU5LbZAWcdiK/s660/resim3.png" alt="" /></a>
            <a href="#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhf3jvzWCVmprR5icUVqalTCx5zABLrXCKr8AXRD9K8f0r5hic8RNupdcT_CN4PL1B090xWqnEQwT0gZWf-A-44dy5yM9WBlpeJdbS4UA1j0DC9xYVudXXyarS5SIQeAHtft511_CQZUH2l/s660/resim4.jpg" alt="" /></a>
        </div>
    </div>
    <div class="paging_btrix">
        <a href="#" rel="1">1</a>
        <a href="#" rel="2">2</a>
        <a href="#" rel="3">3</a>
        <a href="#" rel="4">4</a>
    </div>
</div>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">

$(document).ready(function() {

//Set Default State of each portfolio piece
$(".paging_btrix").show();
$(".paging_btrix a:first").addClass("active");
 
//Get size of images, how many there are, then determin the size of the image reel.
var imageWidth = $(".window").width();
var imageSum = $(".image_reel img").size();
var imageReelWidth = imageWidth * imageSum;
 
//Adjust the image reel to its new size
$(".image_reel").css({'width' : imageReelWidth});
 
//paging_btrix + Slider Function
rotate = function(){
  var triggerID = $active.attr("rel") - 1; //Get number of times to slide
  var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide

  $(".paging_btrix a").removeClass('active'); //Remove all active class
  $active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)
 
  //Slider Animation
  $(".image_reel").animate({
   left: -image_reelPosition
  }, 500 );
 
};
 
//Rotation + Timing Event
rotateSwitch = function(){ 
  play = setInterval(function(){ //Set timer - this will repeat itself every 3 seconds
   $active = $('.paging_btrix a.active').next();
   if ( $active.length === 0) { //If paging_btrix reaches the end...
    $active = $('.paging_btrix a:first'); //go back to first
   }
   rotate(); //Trigger the paging_btrix and slider function
  }, 5000); //Timer speed in milliseconds (3 seconds)
};
 
rotateSwitch(); //Run function on launch
 
//On Hover
$(".image_reel a").hover(function() {
  clearInterval(play); //Stop the rotation
}, function() {
  rotateSwitch(); //Resume rotation
});
 
//On Click
$(".paging_btrix a").click(function() {
  $active = $(this); //Activate the clicked paging_btrix
  //Reset Timer
  clearInterval(play); //Stop the rotation
  rotate(); //Trigger rotation immediately
  rotateSwitch(); // Resume rotation
  return false; //Prevent browser jump to link anchor
});
 
});
</script>

 

Değiştirmeniz gereken yerler şunlar:

 

- https://…./resim1.jpg, https://…/resim2.jpg, https://…/resim3.png, https://…/resim4.jpg şeklindeki urllerin yerine kendi resimlerinze ait urlleri yazın.

 

- Her resme ait urlden önce # işareti olan yere, o resme tıklayın açılmasını istediğiniz sayfanın adresini yazın.