15 Mart 2012 Perşembe

Blogger:Google translate




Merhaba arkadaşlar bu dersimizde sitenize Google çeviri eklemeyi öğrenicez.Gelelim dersimize

Blogunuza Google translate widget eklemek artık çok kolay, sadece "Blogger paneli >> Yerleşim " gidin ve sayfa öğeleri sayfasında, Gadget Ekle seçeneğini tıklatın ve HTML / JavaScript seçin
Başlığını boş bırakın ya da widget için herhangi bir başlık yazın ve içerik alanında aşağıdaki kodu yapıştırın.

BLOGGER YORUM KISMINA RESİM EKLEMEK



Merhaba arkadaşlar.
Sizlere bugün blogger eklentileri içerisinde, blog sitenizin tasarımı için büyük önem arz ettiğini düşündüğüm bir eklenti sunacağım. Eklenti gayet hoş ve güzel. Bu eklenti sayesinde blog siteniz de yer alan yorum gönder kısmına güzel bir resim ekleyebilecekseniz. Belki aramızda "ya bu ne işe yarayacak" diyenler olabilir. Ama blog sitemizin tasarım olarak güzel görünmesi için bence oldukça güzel.

İlk olarak temamızın HTML'yi düzenle kısmına geliyoruz widget şablonlarını genişlet dedikten sonra yedeğimizi alıyoruz :) Daha sonra aşağıdaki kodları uygulamaya geçiyoruz.

]]></b:skin>

Yukarıdaki kod ile temamızın css kodlarına müdahale etmiş oluyoruz. Ve bu kodun hemen üzerine şu kodu yapıştırıyoruz.

#comment-post-message {
background:url("RESMİM URL KISMINI BURAYA YAZIYORUZ") no-repeat scroll left top transparent;
height:50px;
margin-bottom:12px;
text-indent:-9999px;
width:470px;


kaydet diyip bloggera yorum kısmına resim eklemiş oluyoruz.Hayırlı olsun

14 Mart 2012 Çarşamba

Css Nedir Ne amacla kullanilir



Merhaba arkadaslar bu dersimizde Css Nedir Ne amacla kullanilir onları öğrenicez.
CSS (Cascading Style Sheets)
Css internet sayfalarının görünümünü değiştiren bir tanım dosyasıdır. CSS kendine has kuralları olan bir tanım dilidir denilebilir. CSS Sayfa içersindeki her bir elemana ait farklı özellik atamayı sağlar
Css Özellikleri:
  • Html sayfasındaki nesnelerin görüntüsünü belirler
  • Html 4.0 sürümü ile stil dosyaları geliştirilmiştir
  • CSS ayrı bir dosyada *.css uzantısı ile saklanabilir. Bu işlem sayfanın daha hızlı açılmasını sağlar
  • Elemanlar üzerinde style="" parametresi ile özel kısa tanımlar yapılabilir
HTML ilk üretildiğinde yazı rengi ve boyu gibi özellikleri tag´lar ile tanımlayacağı düşünülmedi. ilk Html sürümünde aşağıdaki gibi temel taglar kullanıldı.

Başlık yazısı



Paragraf yazısı


Daha sonra html 3.2 sürümüyle gibi taglar sunulduğundarenk ve yazı boyu gibi alt özellikler gelişmeye başladı. Fakat çok büyük web sayfalarında bu durum tasarımcı için sıkıntılı olmaya başladı. çünkü sonradan doğru tagı bulmak ve değiştirmek zorlaşıyordu.
Bu sorunu çözmek için Dünya internet topluluğu (W3C) html 4.0 sürümü ile CSS yapısını geliştirdi. Böylece boyut ve şekil bilgileri sayfada olmak yerine CSS uzantılı tek bir dosyada toplandı. Bu sayede web tasarımcı sayfanın görünümünü değiştirmek istediğinde tek yapması gereken CSS dosyasını açmaktı. böylece web sayfasında bir anda birçok sayfa değişmiş oluyordu.

WordPress.com veya WordPress.org Farkları


Herkes wordpress.com ile wordpress .org arasında ne fark olduğunu fazlaca bilmezler.Ama önemli bir ayrıntıdır aralarındaki farklar.Şimdi gelelim bu farkların neler olduğuna ?

WordPress.org farkları


WordPress.org ücretsiz bir blog yazılımıdır. WordPress.org ile, temalar ve eklentiler kurabilir, reklamlar yönetebilir, veritabanı düzenleyebilir ve hatta PHP kaynak kodunu değiştirebilirsiniz. Tüm bu işlemler için adresiniz WordPress.org yazılımıdır. Herkes bu yazılımı ücretsiz olarak indirebilir ancak çalıştırmak için bir web sunucusuna yüklemeniz gerekmektedir. Web sunucuları genellikle ücretsiz değildir. Kendi WordPress yazılımınızı barındırmak eğlenceli ve ödüllendirici olabilir; ancak aynı zamanda bir blogger olarak size tam sorumluluk doğurur. Eğer web sunucunuzu idare edemezseniz, tüm blogunuzu kaybedebilirsiniz.WordPress.org' un en önemli farkı ise sınırsız tema ve eklenti desteği vardır.WordPress.com'da bu sınırlıdır ve sınırsız yapmak için premium üyelik satın almanız gerekmektedir.


Ayrıca wordpress.org ücretsiz olarak ektiler,temalar,türkçe destek sistemini vs. çoğu şeyi ücretsiz olarak alabilirsiniz.


Gelelim WordPress.com farklarına


WordPress.com ücretsiz olarak web barındırması sağlayan ve kullanıcılara wpkitabi.wordpress.com şeklinde blog
hizmeti sunan web sitesidir.Yani host ve domain hazır olarak WordPress.com üzerinden blog kurmuş oluyoruz.WordPress.com 'un WordPress.org'dan farkı hazır bir site içerisine hiç uğraşmadan blog yazılarınızı direk olarak paylaşmanızı sağlıyan sitedir.Ayrıca ekstra ziyaretci kazanma özelliğide vardır.Paylaştığınız yazılar
WordPress.com 'da paylaşılarak hit kazanmanızıda arttırmış olur.

Google iPhone Blog Template

Merhaba güzel bir iphone blog teması sizlerle.Keyifle kullanın



Google blog Say You Do Template

Merhaba arkadaşlar size güzel bir tema olan Say You Do Template görsel açıdan çok iyi tema güle güle kullanın


Google blog Where to Learn Template

Merhaba arkadaşlar size güzel bir tema olan Where to Learn Template güle güle kullanın

Where to Learn teması

Css ile download butonu yapımı


Css kodlarına iyice merak saldığım şu sıra kodları elimden geldiği kadar blog tasarımımı iyileştirmede kullanıyorum. Bugün de paylaştığım temalar için demo-download butonu yapımını araştırırken Uğur Dalkıran'ın çok güzel bir anlatımına denk geldim ve kendi blogumda kaynak belirterek kullanmak istedim. Umarım işinize yarar...

Öncelikle temanızda

]]></b:skin>
kodunu bulun ve bu kodun hemen üstüne

#buton-one{
background-image:url(http://1.bp.blogspot.com/-s7wIrwDy3fM/Ty2HKkNfoMI/AAAAAAAACZ0/dy9sthmuxh4/s1600/buton.png);
background-position:0px 0px;
width:250px;
height:37px;
padding-top:14px;
}
#buton-one:hover{
background-position:-250px 0px;
}
#buton-one a{
font-size:17px;
font-family:Myriad Pro;
text-decoration:none;
color:#fff;
}
kodunu yapıştırın ve temanızı kaydedin.

Daha sonra butonları kullanmak istediğiniz yeni kayıt bölümünün Html'yi Düzenle kısmına
<div id="buton-one"><a href="#"><center>Demodownloadbutton</center></a></div>
kodunu ekleyin, işlem tamamdır :)Konu için "hitadama" teşekkürler

Sitenizi 3 buyuk Arama motorlarina ekleme



Bu adrese girip örnekteki gibi site urlmizi girip create giyoruz.

gitmek için tıkla

Şekildeki gibi create diyince otomatik oluşturuyor.Daha sonra Karşımıza bu ekran geliyor burdan bing ve yahoo için verdiği linklere tıklayarak tamamlıyoruz.
Gooogle için ise
Google>Site yönetimi>blogunuz>Site yapılandırma>Harita Ekle girip test et yada tekrar yükleye verdiği urldeki adresi yazıyoruz tekrar yükle diyoruz ve tamamdır.





FTP Programi nedir-Nasil Kullanilir

FTP(yani Filezilla) Programı web sayfasında olmazsa olmaz programlardan biridir. Bu program sayesinde dosyalarımı çok rahat bir şekilde sitemize atabiliriz(Yani hostumuza)


ilk önce programımızı indirelim?
tıkla


Şimdi geldi nasıl kullanıldığına Filezilla'nın?
  1. Programın genel görüntüsü





























2.Nasıl bağlanırız

Sunucu:Hosting'imizin ftp adımız


Kullanıcı adı:Hostingin verdiği Ftp kullanıcı adımız


Parola:Hostingin verdiği Ftp sifremizdir.


Port:Buna değer girmemize gerek yoktur.Varsayılan değeri port 21'dir.


3.Tüm bu değerleri girdikten sonra hızlı bağlan diyince sağ altta servera bağlanmış oluruz ve dosyalarımızı ister sol taraftan seçerek aktarırız
İstersekde server dosyalarımızı mouse ile sürükleme yöntemi ile atabiliriz.

Blogger Lazy Load Eklentisi


Merhaba arkadaşlar bugünkü yazımda hoşunuza gideceğini tahmin ettiğim bir eklentiyi paylaşacağım. Eklentimizin adı ''LazyLoad''. Özelliği ise blogger sayfanızdaki resimlerin sayfa başından aşağıya doğru indikçe açılması. Bildiğiniz gibi normalde sayfaya giriş yaptığınız anda tüm resimler pat diye yükleniverir bunda öyle değil.
Eklentiyi bende kullanıyordum ama önce lightbox şimdide highslide derken kulanma şansım yok malesef...

Kurulumunu fazla uzatmadan hemen anlatacağım zaten birçoğumuz html bölümüne aşina olduk.

Kurulum;

Temanızın Html kodları arasında kodunu bulun ve hemen üzerine aşağıda verdiğim kodları yerleştirin.


<script charset='utf-8' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js' type='text/javascript'/><script src='http://yourjavascript.com/10571191201/lazyload.txt.js' type='text/javascript'/><script type='text/javascript'>$(function() {          $(&quot;img&quot;).lazyload({              placeholder : &quot;http://1.bp.blogspot.com/-zaQ_Mbj7SQE/Tqd54ZZ-J6I/AAAAAAAABkw/fYm0PXpus7k/s1600/grey.gif&quot;,              effect      : &quot;fadeIn&quot;           });       });</script><script type='text/javascript'>if (window.jstiming) window.jstiming.load.tick(&#39;headEnd&#39;);</script>
Hepsi bu kadar arkadaşlar eklentiniz hayırlı olsun :)
Yapamadığınız bir yer olursa yorum formunu kullanarak mutlaka bildiriniz..

Blogger: Kod penceresi eklentisi

Blogger kullanıcıları olarak zorluk çektiğimiz konulardan biride yazılarımızda paylaştığımız kodları şık bir şekilde sunamamaktır.
Yakın zamanda SyntaxHighlighter kullanmış biri olarak kod gösterimi için bu gibi eklentileri kesinlikle tavsiye etmiyorum. Ne düzenli bir görüntü var ne de kullanım kolaylığı üstelik eklentilerdeki css ve javascript kodları blogunuzun açılışını oldukça yavaşlatıyor.
Burada vereceğim bir kod parçası ile yazılarınızda istediğiniz kodları kolayca öne çıkarabilirsiniz..

Öncelikle temanızda


]]></b:skin>
kodunu bulun ve hemen üzerine
.post code{font-family:"Courier
New",monospace;line-height:1.3em;border:4px dotted
#DDD;background:#F4F4F4
url(http://1.bp.blogspot.com/-78vDCOHBreM/T0DC8f-sQ7I/AAAAAAAACgQ/T3R8ZxSVGXk/s1600/Code.png)
top right no-repeat;margin:10px 0;padding:10px
10px;font-size:13px;display:block}
kodunu ekleyin ve temanızı kaydedin.

2. Yöntem

Linke tıklayın ve açılan sayfada 'Paste your text here.' yazısı yerine istediğiniz kodu yazın ve 'Format Text' yazısına tıklayın çıkan koyu renkle seçili kodu yazınızda Html'yi Düzenle kısmına yapıştırın.

Artık Kod pencereniz olmuştur.Güle güle kullanın

Facebook otamatik begendirme eklentisi

Facebookta sayfası olmayanı dövüyorlar biliyor musunuz ? Bir sayfa açarsınız ,o kadar video paylaşırsınız,bilgi paylaşırısnız ama hayran sayısı bir türlü artmaz.Aslında şimdiye kadar yaptığınız paylaşımlar önemliydi ancak artık hitli bir sitede vereceğim kodların bulunması bile yeterli :) Peki bu kadar fake hesap ve sayfa neden var ? Milletin işi gücü yok,sırf millet gülsün diye mi paylaşır ? HAYIR !

Türk insanı nerelerden para kazanacağını çok iyi biliyor.Saatlerce başından kalkmadığınız o sitelerden, ev geçindirenler var ?! "Atma Ziya !" seslerini çok iyi duyuyorum.Sizin bu tabiri kullandığınız her sektörde ,çok iyi para kazananlar var.Bu adamlar buna inanıp ,işine bakıyor.Baştan olmadı diyip işi bırakmıyorlar.Sizinle onların arasında ki tek fark bu :) Halada inanmayan arkadaşlar varsa webmaster sitelerine bir göz gezdirsinler :)

Blogger Bu Yaziyi Paylas Eklentisi


Blogger eklentileri üzerine bir daha yazı yazmam diyordum,ancak gelen emailler ve webmaster forumlarından gelen özel istekler üzerine tekrardan blogger konusunda destek vermeye devam ediyorum.Add Sexy Auto Hide Social Bookmarking Widget (V3) For Blogger / Blogspot eklentisini sorunsuz bir şekilde kurmayı öğreneceğiz.

Blogumuzun temasında </head> tagını buluyoruz ve hemen öncesine şu kodları ekliyoruz.


Sitenizin Anahtar Kelime Yogunlugunuzu Olcun

SEO nun önemli etkenlerinden biri de anahtar kelime yoğunluğudur.Google spamı engellemek için en iyi anahtar kelime yoğunluğunu %5 - 7 olarak belirlemiştir.
Anahtar kelime yogunlugu anlık günlük olarak sitenizi Bomb cezasına sokabilir bu ceza ile sitenize girişler çok düşer ama hiç bir zaman endişelenecek bir durum yok ta ki aynı durumu sürdürene kadar..
Yani anahtar kelimeniz mesala 'izle' olarak çok dolu ise asla izle olarak başlık açmayın ve açıkta olan başlıklarınızıda düzeltme yoluna gidiniz..

Buyrun anahtar kelime yoğunluğu ölçme aracı:


Google Blog Sosyal Medya Eklentisi

Merhaba arkadaşlar bu yazımda sizlere sosyal medya eklentisi paylaşıcam.


Sitenize sosyal agları eklemek için öncelikle

Tasarım > Sayfa öğeleri >Widget ekle diyoruz.

Widget çıkması istediğiniz yere> "html-javascript olustur" diyip şu kodu yapıstırıyoruz.

Ucretsiz CSS Kitabı (Turkce)

Akıllarda olan en çok sorulardan biri css nedir?Nasıl yapılır işte Fatih Hayrioğlu'nun sunduğu ücretsiz kitapdan sizde öğrenebilirsiniz artık.Kitapda Css ile ilgili detaylı olarak bilgiler mevcuttur.Tavsiye ederim


Kitabı buradan indirebilirsiniz.

128 tane ucretsiz ikon



Wefunction tarafından sunulmuş olan özellikle web uygulamalarınızda kullanabileceğiniz 128 adet ücretsiz ikon. Aşağıda birkaç örneğini görebileceğiniz bu seti buradan indirebilirsiniz.