Straight Ahead–Premium Kalitede Blogger Teması

Wordpress’ten Blogger’a çevrilmiş, çok güzel bir temaya rastladım ve sizlerle paylaşmak istedim.Temanın yapımcısı temayı başlıkta yadığım gibi tanımlıyor.Premium kalitede…

 

Temanın özelliklerinden kısaca bahsetnek gerekirse…

1. Temiz Tasarım : Blog ana sayfası temz ve net bir tasarıma sahip.Güzel ve birbiriyle uyumlu renkler seçilmiş.Gözü hiç yormuyor.

2. Jquery Slider : Blogunuzla ilgili duyurular yapabileceğiniz, daha çok okunmasını istediğini yazılarınızı veya resimlerinizi koyabileceğiniz bir manşet uyguluması hazır bulunuyor.

3. Footer : Footer 4 sütuna bölümünmüş.Bu sayede zengin görünümlü ve kullanışlı bir footer bölümüne sahip olabilirsiniz.

4. Diğer Özellikler : Temanın dikkat çeken diğer özelliklerinden bahsedecek olursam; Header’da yatay açılır menü, sidebar’da tab menü, her yazıya ait yorum sayısını gösteren yorum balonu, resimli otomatik devamını oku özelliği.

- Bu temayı blogunuza nasıl yükleyeceğinizi bilmiyorsanız okuyun: Blogger Şablon Yükleme

- Daha önce paylaştığım tüm temaları görmek için bakın: Blogger Şablonları

Blogunuz İçin 2 Farklı Stilde Arama Kutusu

Yeni bir Blogger teması üzerinde çalışıyorum.Bu temada şık ve farklı bir stilde arama kutusu kullanmak istedim ve internette ufak bir araştırma yaptım.Arama kutusu stilleri araştırırken Design3Edge sitesinde bir psd paketine rastladım.Bunlardan iksi hoşuma gitti ve burada da paylaşmak istedim.

Resimde gördüğünüz stillerdeki arama kutularına ait kodlar aşağıda mevcut.Hangi stildeki arama kutusu kullanmak istiyorsanız o kodu HTML/JavaScript gadget’ı olarak blogunuza eklemeniz yeterli.

1.Stildeki arama kutusunun kodları:

<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipC94UQr9BIUZ1SPxbgh6dSxpnRFJQ0wEUanNsC5kFGHausTOQMgZnFR570YfyoXE9hXnTpY2llnSTRQoq__7mVaQFoVY5O09-KtH8pIjGFEwAWNLSlSM4nlLz4UGDhE_KQ2u8meHtYOZm/s307/arama-kutusu-psd1.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 10px 12px;margin:0;}
form#w2b-searchform #s{padding: 6px;margin:0;width: 235px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>   
<div id="w2b-searchbox">
    <form id="w2b-searchform" action="/search" method="get">
        <input type="text" id="s" name="q" value="Ara..." onfocus='if (this.value == "Ara...") {this.value = ""}' onblur='if (this.value == "") {this.value = "Ara...";}'/>
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
    </form>
</div>

2.Stildeki arama kutusunun kodları:

<style type="text/css">
#w2b-searchbox{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtKGvAE6Y62wokVVCnYLxgELBtg9pIJvPFfQsJt0lUwUXfJsZTxbgqLK56EQQmByEQ883iolNbFREdXgZJa2sQ7i8E95yvKtHoGJF9kUdrpClgsbTFH9xnUqpaRjtoDDdekmMQHTXj-iLW/s307/arama-kutusu-psd2.png) no-repeat scroll center center transparent;width:307px;height:50px;disaply:block;}
form#w2b-searchform{display: block;padding: 12px;margin:0;}
form#w2b-searchform #s{padding: 6px 6px 6px 26px;margin:0;width: 215px;font-size:14px;vertical-align: top;border:none;background:transparent;}
form#w2b-searchform #sbutton{margin:0;padding:0;height:30px;width:30px;vertical-align: top;border:none;background:transparent;}
</style>   
<div id="w2b-searchbox">
    <form id="w2b-searchform" action="/search" method="get">
        <input type="text" id="s" name="q" value=""/>
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton" />
    </form>
</div>

Sitene Facebook Abone Ol Kodu / Butonu Ekle

Sosyal paylaşım sitesi Facebook'un 3 ay önce Twitter'aın "Takip Et"benzer bir özelliğe sahip olan "Abone Ol" butonuyla kullanıcılarına bir sürpriz yapmıştı.Daha çok ünlüler, blog sahipleri, web site sahiplerinin ilgisini çeken bu uygulama kısa sürede yayıldı.

Facebook şimdi 135 milyon kişinin kullandığı Abone Ol uygulamasını, Facebook dışındaki blog ve web sitelerine taşıyan eklentiyi devreye soktu. Bu eklenti ile artık gazetecilerin, köşe yazarlarının, sanatçıların veya daha fazla takipçi sayısına ulaşmak isteyen herkesin 'Abone Ol' butonunu kendi blog veya web sitesine yerleştirmesine olanak tanıyor.

Buraya tıklayarak sizde kendinize özel kodunuzu üretebilirsiniz. Ürettiğiniz kodu web sitenize ekleyerek daha çok aboneye ulaşabilirsiniz.

Kendi kodumu nasıl oluşturabilirim?
Kendi kodunuza yaratabilmek için ilk önce Buraya tıklayınız.
Açılacak olan sayfada "Profile URL" yazan yere kendi profilinizin linkini yazıyorsunuz. Width kısmından da sitenize ekleyeceğiniz kodun boyutlarını ayarlamıza yardımcı olur.

Gerekli ayarlamaları yaptıktan sonra ise "Get Code"ye tıklıyorsunuz. Karşınıza gelecek olan kod çeşitlerinden sitenize uygun olanı alıp sitenizin istediğiniz bir yerine ekleyebiliyorsunuz.

Ayrıca bahsetmediğim diğer kısımlar ise, sadece teferruatlardır. Onları siz kendi kafanıza göre değiştirebiliyorsunuz. Örneğin; font kısmından yazı tipini değiştirebilirsiniz.

Kodu Nasıl Alabilirim? Siteme Nasıl Ekleyebilirim?

"GET CODE" yazan kısma tıkladıktan sonra karşınıza aşağıdaki gibi bir ekran gelecek.  Buradan sonra geriye 2 adım kalıyor. Onları da resimli olarak ekledim. Bakınız :

Resimleri büyütmek için üzelerine tıklamanız yeterli.

Arkadaşlar yorumlarda ençok bu soru sorulduğu için bunu da konuya eklemek istedim.. İlk önce şunu belirtmek isterim ki bu yöntem; TR.GG ve Blogger dahil birçok websitesinde de çalışmaktadır. Kodu alana kadarki herşeyi ben açıklarım. Gerisini yapmak size kalmış bişey. Çünkü her sitenin yönetim paneli farklıdır. Kodu nereye ve nasıl ekleyeceğiniz size kalmış..

Ama Blogger için söylemem gerekirse, Tasarım --> GADGET ---> HTML / Javascript ekle kısmına kodu eklemeniz gerekiyor..

Konuyla ilgili aklınıza takılan sorular var ise yorum olarak belirtebilirsiniz..

Abone sayımı nasıl arttırırım diyorsanız, bir diğer yazımı okumanızda fayda var.

Abone sayınızı arttırmak için buraya tıklayınız!

Fotoğraf Ve Portfolyo Blogları İçin Blogger Teması

Bu aralar tema hazırlamak ve düzenlemek için pek vakit bulamıyorum.Ben de haır bir tema paylaşayım dedim ve PremiumBlogTemplates tarafından hazırlanan Myfolio temasını seçtim.
Tema oldukça sade ve gözü hiç yormayan bir tasarıma sahip.Özellikle fotoğraf ve portfolyo bloglar için bire bir.Başlığın altındaki menüye sayfa linklerinizi ekleyebilirsiniz.3 sütunlu footer bölümüne ise sosyal hesaplarınıza ait butonlar, etiket bulutu, arşiv gibi öğeler ekleyebilirsiniz.

         
Blogumun temasını nasıl değiştirebilirim? diyorsan oku => Blogger Şablon Yükleme

Blogunuzun Hızını Test Edebileceğiniz Araçlar

Bu aralar blogların hızı ve performansı ile çok ilgileniyorum.Blogunuzu hızlandırmanıza yarayacak ipuçlarını daha önce yazmıştım.O yazıya yapılan yorumlardan birinde bir ouyucum blogu hızlandırmak için yapılan işlemlerin blogun görünümünü çok asdeleştireceğini yazmıştı.Haksız da sayılmaz.Ben de ona cevaben bu dengeyi sağlamak gerektiğini yazmıştım.

 

Burada paylaşacağım online araçlar ile blogunuzun yüklenmesini hangi öğelerin yavaşlattığını görebilecek, blogunuzun açılış hızını diğer bloglarla karşılaştırabileceksiniz.Bu sayede performans – görünüm dengesini en iyi şekilde kurabileceksiniz.

 

1. PAGE SPEED ONLINE

Bir Google servisi olan Page Speed Online, blogunuzu test ettikten sonra size 100 üzerinden bir puan verir.Bu puanı belirleyen bazı kriterler vardır.Puanınızı düşüren kriterleri önem derecesine göre ayırarak size raporlar.Bu rapor ile blogunuzun performansını nelerin düşürdüğünü öğrenebilirsiniz.

Link: https://developers.google.com/pagespeed/

 

2. PINGDOM TOOLS

Pingdom Tools benim favori araçlarımdan.Bu araç blogunuzu detaylı bir şekilde analiz ettikten sonra 100 üzerinden bir performans puanı, yüklenme süresi ve ana sayfanızın toplam boyutunu verir.Ayrıca blogunuzu diğer sitelerle kıyaslayarak diğer sitelerinden %kaçından daha hızlı olduğunuzu yazar.Bunun dşında blogunuzdaki grafikllerden tutunda javascriptlere kadar her bir öğebnin kaç saniyede yüüklendiğini detaylı bir şekilde görebilirsiniz.

Link: http://fpt.pingdom.com/

 

3. Free Website Performans Test

BrowserMob şirketinin bu ücretsiz aracı ile blogunuzun ortalama yüklenme süresi, ana sayfanızın bboyutu, blogunuzdaki öğelerin sayısını ve bu öğelerin tek tek yüklenme sürelerini görebilirsiniz.Ayrıca bu araç blogunuza 4 ayrı merkezden ping atarak değişik lokasyonlardaki prformansı da gösterir.

Link: https://browsermob.com/free-website-performance-test

 

4. Which Loads Faster?

Bu ilginç araç ile iki sitenin performansını kıyaslayabiliyorsunuz.Kıyaslamak istediğiniz sitelerin adresini yazdıktan sonra ekran ikiye bölünüyor ve siteler yüklenmeye başlıyor.Her iki siteninde yüklenme süresi hesaplandıktan sonra hangisinin ne kadar daha hızlı olduğu ekranda yazıyor.

Link: http://whichloadsfaster.com/

 

5. WebPagestest

 

Blogunuzu detaylı bir şekilde analiz eden baka bir araç daha.Bu aracın en iyi özeliği ise blogunuzun açılış hızını farkl tarayıcılar ve dünya üzerindeki farklı merkezler için test edebilmesi.

Link: http://www.webpagetest.org/

Kod Yazmak İsteyen Bir Blogger İçin Kendini Geliştirme Yöntemleri

Bu yazı firatyalcin.com’dan Fırat Yalçın tarafından Blog Hocam için yazılmıştır.

Blogunuzda kendi temanızı kullanmak veya özgün HTML kodlar oluşturabilmek için belli başlı program dillerini bilmeniz gerekmektedir. Bu program dilleri hakkında kendinizi geliştirmeniz de şarttır. Peki nasıl geliştirebilirsiniz ne yapabilirsiniz?

 

1-Halk Eğitim veya Halk Evi Kursları

 

Sertifikada alabileceğiniz bu kurslar öğreticisinin niteliğiniğine göre size birçok deneyim, önbilgi kazandıracaktır. Halk eğitimden halk eğitime değişen kurslar vardır fakat web programcılığı, web tasarımcılığı, grafik ve animasyon tabanlı web sitesi hazırlama gibi kurslar birçok halk eğitim merkezinde mevcuttur.

 

2- İnternetteki Öğretici Videolar

 

İnternetteki öğretici videolarla herhangi bir kursa gitmeden kendinizi bir nebze geliştirmeniz mümkün. Öğrenmeniz gereken Action Script 3- PHP -HTML gibi temel konuları google da araştırarak birçok eğitmen videosuna ulaşmanız mümkündür. Yine öğrenmeniz gereken programlardan birisi olan FLASH PLAYER  için size milli eğitim tabanlı ŞU siteyi öneriyorum. O sitedeki videoları upload edip kendi blogumdaki ŞU yazıda bahsetmiştim. Oradan indirebilirsiniz.

 

3- Gerekli Adobe Programlarını Bulundurun ve Kullanın

 

İnternetten videolarla öğrenme yolunu seçtiğinizde eğitmenlerin genelde adobe programı kullandığını gözlemlersiniz. Gözlemlediğiniz adobe programını bulundurup, eğitmeni taklit ederek kullanmanız sizi geliştirecektir. HTML kod yazma programlarından Adobe dreamweaver, Flash programlarından Adobe Flash CS5 benim önerdiklerimdendir.

 

4- Aşama Aşama İlerleyin

 

Acele etmeyin ve birden öğrenmeliyim psikolojisine kapılmayın. Her şeyi parça parça planlı planlı öğrenin. Kolaydan zora gitmeniz sizin için daha faydalı olacaktır.

 

5- Benzer Sitelerden ve Webmasterlardan Yararlanın

 

Sadece bir videoya veya kursa, öğreticiye bağlı kalmaksızın öğrendiğiniz kodlama dilini içeren websitelerden de yararlanın. Ne kadar farklı kaynak o kadar farklı bilgi demektir.Anlamadığınız veya takıldığınız yerleri ilgili sitelere veya webmasterlarla iletişime geçerek sorun. Bu maddelere daha birçok madde eklenebilir fakat kod bakımından söylüyorum, başkasına muhtaç olup forum forum kod aramaktansa kendi kodunuzu kendiniz üretin.

Sitcom'unu Çek, Muhteşem Ödülleri Kazanma Şansını Yakala!

Hürriyet Kampüs’ten bol ödüllü online sitcom yarışması: “2Faces Kısa Sitcom Yarışması” başladı!

Hürriyet Kampüs, üniversitelileri yılın en eğlenceli, bol ödüllü ve en yaratıcı yarışmasına davet ediyor. “Şu kampüs hayatı tam bi’film… Ve bunu sadece ‘çok çekenler’ bilir” sloganıyla yola çıkan 2Faces Kısa Sitcom Yarışması, bugüne kadar gerçekleşen kısa film yarışmalarından farklı olarak kampüs hayatının unutulmaz anlarının online anlatılacağı bir yarışma olarak hayata geçecek.

Dört bölümlük “2Faces Kısa Sitcom Yarışması”nın birinci bölüm konusu: “Kampüste 5 kuruşsuz olmana rağmen-5.000 kuruşluk yaşayabilmenin yolları”… Yarışmaya katılmak isteyen üniversite öğrencileri kendilerinin oynayıp yönetecekleri 120 saniyeyi geçmeyen “sitcom-durum komedilerini” gerçek kimlik bilgileri ile hurriyetkampus.com sitesine yükleyecekler. Yarışma dört bölümden oluşacak ve her bölümde jüri tarafından belirlenecek ilk 30 eser, hurriyetkampus.com’da yayınlanacak. En çok oyu alarak ilk 3 sıraya girenler çeşitli ödüller kazanacaklar ve dört bölüm sonunda yapılacak finallere katılarak muhteşem ödüller kazanma şansını da elde edecekler. Üniversite öğrencileri, 2Faces Kısa Sitcom Yarışması’nın ilk bölümüne 28 Kasım-18 Aralık tarihleri arasında başvurabilecekler. Yarışmacıların birden fazla eserle katılabilecekleri birinci bölümde ilk 30′a giremeyen yarışmacılar diğer bölümlere de katılabilecekler. Yarışmanın birinci etabının sonucu 3 Ocak 2012′de açıklanacak. Öğrenciler, yarışma ile ilgili tüm detaylara hurriyetkampus.com, facebook.com/hurriyetkampus sayfalarından ulaşabilirler.

Her etap için ödüller;  hepsiburada.com’dan birinciye 500 TL, ikinciye 300 TL ve üçüncüye de 150 TL’lik hediye çeki. Etap ödülleri yetmiyormuş gibi, bir de büyük finallerde ilk 3 yarışmacıya verilecek ‘dudak uçuğuna sebep’ hediyeleri var...

Yarışmaya katılmak ve muhteşem hediyelere sahip olmak için:
www.hurriyetkampus.com  
http://hurriyetkampus.com/kampusten-2faces-kisa-sitcom-yarismasi
http://hurriyetkampus.com/2faces

Bir bumads advertorial içeriğidir.