Articles by "eklentileri"
eklentileri etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
En yeni konular, en gücel haberler. En son çıkan internet haberleri. Oyun haberleri. Hepsi webtegez.blogspot.com'da..
Google Chrome Eklentileri
WebteGez Yöneticileri Seçimiyle ve Bazılarını Bizimde Kullandığımız, İşinize Yarayacak En İyi Google Chrome Eklentileri.

 Google öyle bir web tarayıcı çıkardıki kısa sürede gerçekten ciddi anlamda tarayıcı kullanıcısı arttı. Ve şimdi ise milyarlar bu programı kullanmaktadır. Ama kullanmaktada en iyi program bu çünkü. Hem hızlı, hem kolay, hem sade bir arayüze sahip tarayıcı.
 Google Chrome çıktıktan sonra yüzlerce internet şirketi(arama motoru siteleri gibi.) kendilerinide büyütmek için Google Chrome ile bire bir tarayıcılar çıkarıp kendi logosunu yerleştirip herkese yayıyorlar.
 Nese arkadaşlar biz konumuza geçelim. Bu konumuzda size işte bu Google Chrome web tarayıcısı kullananlara yani sizin için kullanabileceğiniz en iyi eklentileri burada paylaşacağım. Webmaster'lar için birebir ama günlük normal hayatınızda da kullanabileceğiniz programlar mevcut.
 Böyle elime geçtikçe yayınlayacağım.

Photo Zoom for Facebook
Photo Zoom for Facebook (FaceBook Fotoğraf Yakınlaştırma)

 FaceBook fotoğraflarınız en iyi, en hızlı şekilde görüntülemek için en iyi yol.
 Bu eklenti ile fotoğraflara tıklayıp açılmasını beklemeden, fotoğrafların üzerine geldiğiniz zaman fotoğrafın tam ve net halini direkt karşınıza büyük olarak göstermektedir. Milyonların kullandığı bu programı kaçırmamanızı öneririm.

RSS Feed Reader (RSS Besleme Okuyucu)

 Basit bir genel RSS ve Atom beslemelerini okumak  için araç çubuğunda yer alır.
 Bu eklentiyi webmasterlar için gerçekten öneririm. Bu eklenti sayesinde takip etmek istediğiniz binlerce sitenin RSS'sini buraya ekleyebilir web site bir şey paylaştığı zaman anında sana bildirim olara bildirsin. Web sitelerde dolaşırken RSS'sini otomatik bulur siz isterseniz bir tık ile ekleyebilirsiniz. Çoğu webmaster'ların kullandıkları güzel bir eklenti..

Alexa Traffic Rank (Alexa Rating Sırası Öğrenme)

Resmi Alexa Rating Sıralama Uygulaması. Alexa trafik sıralaması ve siteyer her tıklandığında tıklandığında size bilgi sağlayan webmasterlar için olmazsa olmaz olan bir eklenti. Bu eklenti ile kendi sitenizide her dakika takip etmiş olabilirsiniz ve sitenizin Rank durumunu istediğiniz her an kolayca öğrenebilirsiniz.

İmgur (Kolay Resim Upload)

 Resimlerinizi sadece sürükle-bırak yaparak upload edip direk link almak istiyorsanız son derece kullanışlı bir eklenti.
 Başka uplod sitelerine gidip uğraşıp, upload etme derdine son.! Artık imgur ile fotoğraflarınızı ister sürükle-bırak yöntemi ister ise sağ tık yöntemi ile 1 dakikadan daha kısa sürede fotoğrafınızı internete upload edin hemen linkini alın.

Quick Note (Hızlı Not)

Chrome'da en hızlı not almanın yolu. En iyi masaüstü not alma uygulaması kadar hızlı ve etkin.
 Quick Note, özellikle küçük notlar almak için tasarlanmıştır. Herhangi bir not defteri, karalama tahtası, pano veya yapılacaklar listesi gibi kullanabilirsiniz.
 Sayfa esnasında sağ tık ile buna ulaşabilir veya web sitede almak istediğiniz sözcük veya sözcükleri mouse ile saçıp sağ tık ilede hemen anında ekleyebilirsiniz.
En yeni konular, en gücel haberler. En son çıkan internet haberleri. Oyun haberleri. Hepsi webtegez.blogspot.com'da..
Merhaba WebteGez Okuyucuları;

 Bu konumuzda Blogger vb. gibi web sitesi olan herkes bu özelliği kullanarak, sayfalarında istediği mesaj kutusunu koyarak ziyaretçilerinize güzel bir mesaj gönderebilir ve sayfalarınızda güzel bir görünüm yaratabilirsiniz.

Bu özelliği şu an WebteGez Blog sitesinde halen kullanmaktayız. Çünkü gerçekten ziyaretçileri bilgilendirmede işe yarıyor.

Kutuların İçerikleri Şu Şekildedir:

  • Uyarı Kutusu
  • Bilgi Kutusu
  • Hata Kutusu
  • Olumlu Kutusu
  • İndir Kutusu
Şimdi anlatıma geçelim. Yalnız ben bu anlatımı Blogger sitesi ile yönlendirerek yapacağım. Bunu yapmak o kadar zor değil ama. Aşağıdaki adımlarda gene herkesin anlayacağı şekilde yazmaya çalışacağım.

Kurulum:

1)Blogger Panel'inizin sol menüsünden "Şablon" yazan kategoriye tıklayınız. (Sol Tarafta Gösterilen Resimdeki Kategori)
2) Daha sonra karşınıza çıkan sayfadan "Şu Anda Blog'da" yazının altında bulunan "HTML'yi Düzenle" butonuna tıklayınız. (Sol Tarafta Gösterilen Resimdeki Buton)
3) Karşınıza POPUP Pencere tarzı bir pencere açılacaktır. Kodları yapıştırmaya başlamadan önce pencerenin sol üst tafından bulunan "Widget Şablonlarını Genişlet" yazısının başındaki boş CheckBox kutusunu işaretleyin.


 4) Sonrasında klavyenizin "Ctrl+F" tuşuna basarak sayfa içi kelime arama kutusunu açın. Arama kutusuna "]]></b:skin>" yazısını yazarak yazıyı sayfada aratın. Kelime bulucu sol tarafta gördüğünüz resimdeki gibi size karşınıza yazdığınız kodu gösterecek. O bulduğunuz kodun hemen üstüne;
.webtegezolumlu, .webtegezhata, .webtegezbilgi, .webtegezuyari, .webtegezindir {
padding-right: 10px;
padding-bottom: 10px;
font-size: 13px;
line-height: 20px;
margin-bottom: 20px;
padding-top: 10px;
background-repeat: no-repeat;
background-position: 7px center;
text-transform: uppercase;
padding-left: 50px;,
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px
}
 
.webtegezolumlu {
color: green;
background-color: #EBF8D6;
border: 1px dotted green;
color: #555555;
background-image: url(http://webtegez.3owl.com/Blogger/mesajkutusu/olumlu.png);
}
 
.webtegezhata {
background-color: #FFECE6;
border: 1px dotted red;
color: #555555;
background-image: url(http://webtegez.3owl.com/Blogger/mesajkutusu/hata.png);
}
 
.webtegezbilgi {
background-color: #D3EEF1;
border: 1px dotted blue;
color: #555555;
background-image: url(http://webtegez.3owl.com/Blogger/mesajkutusu/bilgi.png);
}
 
.webtegezuyari {
background-color: #FFFBCC;
border: 1px dotted orange;
color: #555555;
background-image: url(http://webtegez.3owl.com/Blogger/mesajkutusu/uyari.png);
}

.webtegezindir {
color: green;
background-color: #EBF8D6;
border: 1px dotted green;
color: #00cc00;
background-image: url(http://webtegez.3owl.com/Blogger/mesajkutusu/indir.png);
}
kodunu ekleyin.
 Kodu ekledikten sonra "Şablonu Kaydet" butonuna tıklayın ve şablonun kaydedilmesini bekleyin..
Evet arkadaşlar kodlarımız kullanılmaya hazırdır. Şimdi gelelim bu kodların kullanılışına:
Bu kodları aşağıdaki şekildeki gibi kullanabiliriz.
<div class="webtegezuyari">WebteGez Uyarı Kutusu</div>
<div class="webtegezbilgi">WebteGez Bilgi Kutusu</div>
<div class="webtegezhata">WebteGez Hata Kutusu</div>
<div class="webtegezolumlu">WebteGez Olumlu Kutusu</div>
<div class="webtegezindir">WebteGez İndir Kutusu</div>
Bu şekilde bu kodlarla kullanabilirsiniz arkadaşlar.
Örnek Demo Görünümleri Aşağıda Görüntülenmektedir Arkadaşlar..
WebteGez Uyarı Kutusu
WebteGez Bilgi Kutusu
WebteGez Hata Kutusu
WebteGez Olumlu Kutusu
WebteGez İndir Kutusu
İşte bu kadar kolay arkadaşlar.
Hepinize kolay gelsin.
Anlatım Tamamen Bize Aittir..!
En yeni konular, en gücel haberler. En son çıkan internet haberleri. Oyun haberleri. Hepsi webtegez.blogspot.com'da..

Yazılarınız ana sayfanızda otomatik olarak kısaltılıp yazıya eklediğiniz görsellerinde aynı ebatlarda gösterilmesini isterseniz, şablonunuza ekleyeceğiniz küçük bir javascrip kodu sayesinde bu işlemi zahmetsizce yerine getirebilirsiniz.

Kodu şablonunuza eklemek için aşağıdaki adımları takip etmeniz yeterli.  

Sırası ile  Kumanda Paneli ➜ Tasarım ➜ HTML’yi Düzenle➜Devam yolunu takip ederek blog’unuzun kodlarının açık halde bulunduğu modüle gidin.

Yapacağımız işlemlere başlamadan önce Yedekle/Geri yükle yazan butona basarak kullanmakta olduğunuz blog şablonunu yedeklemenizde fayda var. Daha sonra yapacağınız her hangi bir hata sonrası şablonunuzu geri yükleyerek yapmış olduğunuz tüm değişiklikleri kolayca geri alabilirsiniz.

“Widget şablonlarını genişlet” yazan kutucuğu işaretledikten sonra, bilgisayarınızın  klavyesinde bulunan ctrl + f tuşuna aynı anda basarak açılan arama formunda aşağıdaki kodu aratın


 </head>  

bulduğunuz </head> kodun hemen üstüne gelecek şekilde aşağıdaki kodları ekleyin.


<script type='text/javascript'>
var thumbnail_mode = "yes"; 
summary_noimg = 430; 
summary_img = 340; 
img_thumb_height = 200;
img_thumb_width = 200;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(strx,chop){ 
    if(strx.indexOf("<")!=-1)
    {
        var s = strx.split("<"); 
        for(var i=0;i<s.length;i++){ 
            if(s[i].indexOf(">")!=-1){ 
                s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length); 
            } 
        } 
        strx =  s.join(""); 
    }
    chop = (chop < strx.length-1) ? chop : strx.length-2; 
    while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++; 
    strx = strx.substring(0,chop-1); 
    return strx+'...'; 
}

function createSummaryAndThumb(pID){
    var div = document.getElementById(pID);
    var imgtag = "";
    var img = div.getElementsByTagName("img");
    var summ = summary_noimg;
        if(thumbnail_mode == "yes") {
    if(img.length>=1) {    
        imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
        summ = summary_img;
    }
    }
    var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
    div.innerHTML = summary;
}
//]]>
</script>

2.Adım: Aşağıdaki kodu bulun.

<data:post.body/> 

Bulduğunuz bu kodu silip yerine aşağıdaki kodları ekleyin (<data:post.body/> şablonlarda iki adet olabiliyor sonuçlarda çıkan ilk kodun yerine) ve kaydedin.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'> createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<a class='more' expr:href='data:post.url'>Devamını oku ...</a>
</b:if>
</b:if>

Tüm işlemleri doğru yaptıysanız eklentiniz sorunsuz çalışacaktır.


Eklentiyi özelleştirin.

Eklentiyi ekledikten sonra tasarımınıza uygun şeklide alıntı yapılacak yazının uzunluğu veya gösterilecek resmin ebatlarını belirleyebilirsiniz.
1. Görselelerin ebatını ve alınıtnın uzunluğunu belirleyin. 

Birinci adımda eklediğiniz aşağıdaki satırları bulun.
var thumbnail_mode = "yes"; //burada ki “yes” resim gösterileceğini belirtir, oraya “no” diye yazarsanız yapılacak alıntıda resim gösterilmez.
summary_noimg = 430; //alıntı yapılacak yazıda resim yoksa alıntının uzunluğunu belirler.
summary_img = 340; //alıntı yapılacak yazıda resim varsa alıntının uzunluğunu belirler.
img_thumb_height = 200; //gösterilecek resmin yüksekliği.
img_thumb_width = 200; //gösterilecek resmin uzunluğu.

2. Devamını oku yazısını özelleştirin.

Bildiğiniz gibi eklentiyi şablonunuza ekledikten sonra ana sayfada yazıları kısaltarak yazını tamamı için devamını oku şeklinde bir bağlantı oluşturacaktır, eğer siz isterseniz şablonunuza ekleyeceğiniz bir kaç parça CSS kodu sayesinde devamını oku yazan bölümü kendinize göre özelleştirebilirsiniz bunu yapabilmek içinde aşağıdaki adıları takip edebilirsiniz.

aşağıdaki kodları kopyaladıktan sonra ]]></b:skin> etiketini bulup hemen üstüne gelecek şekilde şablonunuza ekleyin.

.more{
float:right;
color:#000;
font-size:13px;
}


float:right; devamını oku yazan bağlantını sağda gösterilmesini sağlıyor siz burayı float:left; diye değiştirirseniz bağlantı solda görüntülenir.

color:#000; bağlantının renginin siyah olduğunu  belirtiyor, rengini değiştirmek isterseniz renk kodlarından istediğinizi bulup yazabilirsiniz.

font-size:13px; bağlantının font büyüklüğünü belirler siz buradaki 13px değeri ile oynayarak fontun büyüklüğünü kendinize göre ayarlayabilirsiniz.