MetamorpheuS

Blogger yazı başlıklarına resim / icon yerleştirme / widget

Nasıl bir görsele sahip ?

Ne işe yarar ?

Her yazınızın başlığına icon veya resim yerleştirmenizi sağlar.

Nasıl yapılır ?

Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada bu kodu aratın.

bulduğunuz kodu aşağıdaki kod ile değiştirin.

İşlem bu kadar.

Bloggerin ilk Video Paylaşım Teması - BloggerTube

Bloggerda devrim niteliğinde bir tema ile karşınızdayım. Blogger ile video paylaşım blogu / sitesi oluşturmak artık çok basit. Blog dünyasına yeni adım atmışlar için bile kullanımı oldukça basit olan bu türünün ilk örneği olan temayı sizlere tanıtmaya çalışacağım.

BloggerTube Teması Oluşturma / Düzenleme Açıklamalı Anlatımı
1. Altta yer alan kodu kopyalayın ve Ayarlar > Biçimlendirme yolunu izleyerek, Kayıt Şablonu seçeneğinin yanında yer alan kutucuğa yapıştırın. "Video hakkında yazı yazabilir, resim yükleyebilir ya da açıklama yazabilirsiniz" kısmını değiştirebilirsiniz.

endofvid
[starttext]
Video hakkında yazı yazabilir, resim yükleyebilir ya da açıklama yazabilirsiniz. [endtext]

2. Youtube adresine gidin ve yüklemek istediğiniz videonun URL adresini kopyalayın.

3.Yeni bir kayıt oluşturmak için, Kumanda Paneli > Gönderme > Yeni Kayıt yolunu izleyin. Alttaki resimdekine benzer bir görüntü ile karşılacaksınız. Bu kısmda dikkat etmeniz gereken iki önemli yer var. Bunlar;

Yukarıdaki resimde de görebileceğiniz gibi endofvid ve [starttext] ile [endtext] kısımlarıdır. İkinci adımda kopyalana Youtube videosunun internet adresi endofvid'den hemen önce (Uyarı: boşluk bırakılmayacak) yapıştırılacak. Diğer dikkat edilmesi gereken kısım da [starttext] ile [endtext] arasında kalan alandır. Bu iki ibarenin arasıdır yazı alanınızdır. İki kodun dışına yazı, resim veya kod yazarsanız sayfanızda görüntülenmeyecektir. Video hakkında yazmak istediğiniz her türlü paylaşımı iki kodun arasında kalacak şekilde yazmalısınız.

Örnek: Yeni Kayıt Örnek Görüntüsü

En Son Eklenen Videolar Eklentisi Düzen ve Ayarlama

Bu kısımda kullanmanız gereken kod alttaki gibidir;

<script style="text/javascript" src="http://blogergadgets.googlecode.com/files/dante.js"></script>
<script style="text/javascript">
var numposts = 5;
var showpostthumbnails = true;
var displaymore = true;
var displayseparator = true;
var showcommentnum = true;
var showpostdate = true;
var showpostsummary = true;
var numchars = 50;
</script>
<script src="/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs"></script>
<div class="clear"/></div>

Yukarıdaki kodu, Yerleşim > Sayfa Ögeleri yolunu izleyin. En Son Eklenen Videolar (Recent Videos) widgetinı açın ve içerisine yapıştırın.

İlerideEn son eklenen videolar eklentisi ile ilgili bir sorun yaşarsanız ilk olarak kodda da görebileceğiniz .js uzantılı dosyayı indirin ve farklı bir yükleyici siteye yükleyerek yine adresini yukarıdaki koddaki yerine yazın ve tekrar deneyin. Bu konuda size yardımı olacağını düşündüğüm Blogger'da JavaScript Kullanımı için çözüm önerileri isimli yazı okumanızı tavsiye ederim.

Ayrıca kodda kırmızı ile renklendirilen true kısımlarını false yaparak ne işe yaradığını keşfedebilirsiniz. Keşfedilemeyen kısım olursa sorabilirsiniz, yorumlar kısmında açıklamaya çalışırım. Beş sayısı gösterilmesini istediğiniz son yazılarınızın sayısını, elli sayısı da video hakkında yazmış olduğunuz yazıdan gösterilmesini istediğiniz karakter sayısını belirlemenizi sağlar.

Ana Sayfada Otomatik Sıralanan Videolar ve Otomatik Slider
Slider alanı ve Magazin Stilinde yazıların sıralanması için herhangi bir müdahalede bulunmanıza gerek bırakmayan bu tema sayesinde her yüklediğiniz, paylaştığınız video otomatik olarak alttaki örnek resimde de görebileceğiniz şekilde Slider şeklindeki Featured Alanının hemen altına sıralanmaya başlayacak. (Türkçe özrüm baş gösterdi burada, kusura bakmayın. Uygun Türkçe kelimeleri bulamamamış olabilirim.) Ayrıca sıralanan videoların sol üst köşesinde sadece ana sayfada görüntülenmek üzere yer alan yıldız şeklindeki oylama tuşları ile yazıları değerlendirebilir, oylatabilirsiniz. Yıldızların kullanımında JS-kit sitesinin uygulamasından faydalanılmış.

Eğer bu temayı blogunuza uygulamak isterseniz, öncelikle sizler için hazırladığım DEMO blogu ziyaret etmenizi tavsiye ederim.

Eğer beğendiyseniz bu adresten temayı indirebilirsiniz.
Bu temayı hazırlayanlara öncelikle ben teşekkür etmek isterim. Gerçekten farklı ve türünün ilk örneği olması münasebeti ile, bu tema yeni bir boyutun kapılarını aralayabilir diye düşünüyorum. Sizinde bu tema hakkında görüşlerinizi bekliyorum.

Kolay gelsin.

Kaynaklar: LB, DA

Not: ie6 kullanıcıları bazı sorunlarla karşılaşabilir...

Not 2 : Bloggertube Slider Sorununa Çözüm Önerisi için Slider Sorununa Çözüm yazısını okuyunuz.

Blogger Blog Sahibini Bulma / Bir bloggerın kime ait olduğunu bulmak !

Blogger tamamen ücretsiz olarak biz kullanıcılara sunulmuş bir hazır platformdur. Her blogger hesabına sahip kullanıcının 100 tane ayrı blog oluşturma hakkı vardır. Tabi isterseniz farklı bir hesap kullanarakta bu sayıyı arttırabilirsiniz. Yani kısıtlama neredeyse yok. İstediğiniz kadar blog sahibi olabilirsiniz.

Kullanıcılarına böylesine serbet çalışma izni veren bloggerda bazı kullanıcılar kendilerini ifşa ederken bazıları da kendileri hakkında bilgi paylaşımını pek tercih etmezler. Erişime izin verilmeyen bloglar ve profiller ile karşılaşabilirsiniz. Sadece takma isim (nick) kullanan ya da gerçek ismiyle blogun sahibi olduğunu belirten kullanıcılar olabilir. Bu tamamen blogger blog sahibinin tercihindedir.

Blogger blog sahibi hakkımda yazısı içerisinde kendisinden üstün körü bahsetmiş ve herhangi bir iletişim bilgisi vermemiş olabilir. Blog sahibi ile iletişime geçmek için diğer kontrol edilmesi
gereken yer; tabi ki, kullanıcının blogger profil sayfasıdır. Eğer blogunda profil sayfasının linkini bulabiliyorsanız herhangi bir problem yok. Peki, profil sayfasını bulamıyorsanız, ne yapabilirsiniz?

Genellikle blogger profil sayfalarını yayınlamayan blogger blog sahibi kişilerin profil sayfasına ulaşmak mümkün. Bu yöntem, %100 kesin ve net bir çözüm olmamakla beraber çoğunlukla işe yaramaktadır. Neden bazı bloglarda işe yaramadığı konusunda fikri olan varsa, lütfen yorumlar kısmında fikirlerinizi özgürce belirtin.

Blogger profilini gizlemeyi tercih eden kişilerin, blogger profilleri gizlilik hakkı çerçevesinde görüntülenmesi mümkün değildir. Mümkün olmadığı gibi doğru da değildir. Kişinin bilgilere ulaşmaya çalışmak, kullanıcıyı izinsiz afişe etmek etik kuralların dışında kalır. Gizli kullanmak isteyenlerin profilleri, bırakın gizli kalsın. Kullanıcı ya da blogu hakkında büyük bir sorununuz varsa da blogger ile irtibata geçip şikayetlerinizi bildirebilirsiniz.

Şimdi, herhangi bir blogger blogunda, blogger blog profil sayfasının internet adresi belirtilmemişse nasıl blog sahibinin profil sayfasını bulabileceğinizi kısaca anlatayım.

Blogger blog sahibini bulmak istediğiniz adresi yazın. (Örnek; http://www.takipteyiz.blogspot.com)

Sayfa açıldığında, sayfa üzerinde fare ile sağ tuşa tıklayın ve Sayfa Kaynağını Görüntüle / Göster seçeneğine tıklayın.

Açılan pencerede, alttaki kodun benzerini bulun;

Bulmuş olduğunuz kodda kırmızı ile renklendirilmiş adres kısmını adres çubuğuna yapıştırın ve Blogger blog sahibini bulun. Blogger blog sahibini bulma için önerilen bu yöntem sadece blogun ana sayfasında kullanılabilirdir.

Bu yönteme, daha çok adresi alınmış ancak herhangi bir içerik eklenmemiş blogların blog sahibini bulma adına ihtiyaç duyulmuştur. Yoksa, blogger kullanıcılarının gizli bilgilerine ulaşmak gibi amaç söz konusu değil.

Yazıyı bitirmeden, şu hatırlatmayı da yapmak yerinde olacaktır; kendi blogger blogunuzun kullanıcı adınızı veya şifrenizi mi unuttunuz? İster elektronik posta adresiniz ister blog adresiniz ile bilgilerinize ulaşabilirsiniz. Bunun için tek yapmanız gereken Blogger: Şifrenizi mi Unuttunuz? adresini ziyaret etmektir.

Blogger Sayfa Aşağı inince Açılan Paylaş Eklentisi

Aşağıdaki kodumuzu bulalım..

</head>

Bu kodumuzun üstüne , aşağıdaki kodlarımızı ekleyelim.

var addthis_config = {

bar_show_below : 150

}

</script>

Şimdide bu kodumuzu bulalım..

</body>

Bu kodumuzun da üstüne , aşağıdaki kodlarımızı ekleyelim..

<label>Share This Page:</label>

</div>

Blogger navbar kaldırma / Ders

Blogger Yellow Black Template

Blogger son yazılar eklentisi / widget

A’dan Z’ye SEO Temelleri ve SEO Analizi

Blogger yorumlar gözükmüyor {ÇÖZÜLDÜ} | Ders

Bloggerda yorumlar gözükmüyor. Yorum olduğu halde yorum görünmüyor. Bunun sebebi ise Google+ yorum ve Blogger'in kendi yorum sisteminin kışması.

Blogger menüsünden Bu blog'da Google+ Yorumlarını kullan seçeneğini kapatırsanız sorununuzu çözmüş olacaksınız.

Eğer ben Google+ yorumlarını kullanacağım diyorsanız, özel temalarda Google+ yorumları gözükmüyor olacaktır ve bunu düzeltmek için ise;

Özel Temalarda Google+ Yorumlarını Gösterme

Ben bu özelliği test blogumda denediğim için Blogger’ın kendi şablonları dışındaki özel şablonlarda çalışmadığını fark edememiştim. Ta ki buraya yapılan yorumlara kadar. Böyle olunca özel şablonlara Google+ yorumları eklemek için yaılması gereken ufak değişikliği paylaşmak istedim.

Şablonnuzda şu kodu bulun:

<b:includable id='comment-form' var='post'>

</div>

Kodu bulduktan sonra sol taraftan ▶ ikonuna basarak kod bölümü genişletin ve hemen yanına şu kodları ekleyin:

</div>

Artık özel şablonunuzda Google+ yorumlarını kullanabilirsiniz.

Blogger Şablonlarındaki “Powered By Blogger” Yazısını Kaldırma / Widget

Nasıl bir görsele sahip ?

Ne işe yarar ?

Blog anasayfasında bulunan Powered By Blogger yazısını kaldırmanızı sağlar. (Önerilmez)

Nasıl yapılır ?

Blogger kontrol panelinizdeyken sırasıyla " Yerleşim >> Gadget ekle " tıklıyoruz. Açılan mini pencereden " HTML/JavaScript ekle " ye tıklıyoruz. Açılan pencereye aşağıdaki kodları ekliyoruz.

Eklenti Ayarları

Son yorumlar eklentisinin normal ayarları 5'tir. Daha fazla yorum gözükmesi için aşağıdaki kodları eklenti kodlarından arayıp bulun;

numComments = 5, Değerini değiştirin

amp;max-results= 5 Yorum sayısının değişmesi için değerlerin aynı olması gerekiyor.

Avatarın gözükmemesi için aşağıda ki true değerini false ile değiştirin.

showAvatar = true,

Avatar boyutu

avatarSize = 45,

Yorumlarda toplam kaç karekter gözümesini istiyorsanız aşağıdaki değeri değiştirin.

characters = 40

Blogger Resimli Son Yorumlar Eklentisi / Widget

Nasıl bir görsele sahip ?

Ne işe yarar ?

Blog anasayfanızda yazılarınıza son yorum yapan kişileri resimli olarak göstermenizi sağlar.

Nasıl yapılır ?

Blogger kontrol panelinizdeyken sırasıyla " Yerleşim >> Gadget ekle " tıklıyoruz. Açılan mini pencereden " HTML/JavaScript ekle " ye tıklıyoruz. Açılan pencereye aşağıdaki kodları ekliyoruz.

<style type="text/css">
ul.w2b_recent_comments {
list-style: none;
margin: 0;
padding: 0;
}

.w2b_recent_comments li {
background: none !important;
margin: 0 0 6px !important;
padding: 0 0 6px 0 !important;
display: block;
clear: both;
overflow: hidden;
list-style: none;
}

.w2b_recent_comments li .avatarImage {
padding: 3px;
background: #fefefe;
-webkit-box-shadow: 0 1px 1px #ccc;
-moz-box-shadow: 0 1px 1px #ccc;
box-shadow: 0 1px 1px #ccc;
float: left;
margin: 0 6px 0 0;
position: relative;
overflow: hidden;
}

.avatarRound {
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
}

.w2b_recent_comments li img {
padding: 0px;
position: relative;
overflow: hidden;
display: block;
}

.w2b_recent_comments li span {
margin-top: 4px;
color: #666;
display: block;
font-size: 12px;
font-style: italic;
line-height: 1.4;
}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 10,
showAvatar = true,
avatarSize = 40,
roundAvatar = true,
characters = 40,
showMorelink = false,
moreLinktext = "Git »",
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://yourjavascript.com/41216241963/bloghocam-resimli-son-yorumlar.js"></script>
<script type="text/javascript" src="http://bloghocam.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=10"></script>

Düzenlemeniz gereken yerler şu şekilde:

numComments = 10 : gösterilecek yorum adedi

characters = 40 : gösterilecek karakter sayısı

bloghocam.blogspot.com : blogunuzun adresi

Blogger Resimli Son Yazılar Eklentisi

Nasıl bir görsele sahip ?

Ne işe yarar ?

Her blog yazarında olması gereken bir eklenti olduğunu düşündüğümüz bu eklenti blog anasayfanızda son yazılan başlıkları resimli olarak göstermenizi sağlar.

Nasıl yapılır ?

Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada " ]]></b:skin> " aratın ve bu kodun üstüne aşağıda verilen kodu ekleyin.

Blogger yazı görünümü değiştirme / Widget

Blogger yazı görünümü değiştirme / Widget

Koddan önceki görünüm:

Kod sonrası görünüm:

Ne işe yarar ?

Blogunuzun anasayfasındaki yazı görünümünü değiştirir.

Nasıl yapılır ?

Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTML Düzenle " tıklıyoruz. Bu kodu buluyoruz: </b:skin> aşağıdaki kodun altına ekliyoruz.

Blogger Etiketli Son Konular Eklentisi / widget

Blogger Etiketli Son Konular Eklentisi / Widget:
Blogunuzun anasayfasında son yazıları liste halinde gösterir.

Blogger kontrol panelinizdeyken sırasıyla " Yerleşim >> Gadget Ekle " tıklıyoruz. HTML/Javascript ekleyi seçip aşağıdaki kodu ekliyoruz.

<div style="background: none repeat scroll 0% 0%; border: 0px; height: 300px; overflow: auto; padding: 10px;">
<span id="pbl_labels"></span>
<div id="pbl_posts">
Son yazılar </div>

<script type="text/javascript">
var jumlah_maksimum_post = 10;
var dengan_ringkasan = false;
var jumlah_karakter_ringkasan = 100;
</script>

<script type="text/javascript">
//<![CDATA[

var num = jumlah_maksimum_post;
var wsumm = dengan_ringkasan;
var summlen = jumlah_karakter_ringkasan;

var json; var labels;

function entryHasLabel(entry, label){
if(label == "*"){return true;} // always true if label is "*"
var labels = getPostLabels(entry);
return isExists(labels, label);
}
function getAllLabels(json){
var labels = [];
var entries = json.feed.entry;
for(var i=0; i<entries.length; i++){
var entry = entries[i];
var categories = entry.category;
if(!categories){continue;}
for(var j=0; j<categories.length; j++){
var category = categories[j];
var label = category.term;
if(!isExists(labels, label)){labels.push(label);}
}
}
labels.sort();
return labels;
}
function getContent(entry){
if(!wsumm){return "";}
var content = entry.content ? entry.content.$t : entry.summary.$t;
content = stripHTML(content);
if(content.length <= summlen){return content;}
content = content.substr(0, summlen);
if(content.charAt(content.length-1) != " "){content = content.substr(0, content.lastIndexOf(" ")+1);}
content += "...";
return content;
}
function getPermalink(entry){
var links = entry.link;
if(!links){return null;}
for(var i=0; i<links.length; i++){
var link = links[i];
if(link.rel == "alternate"){return link.href;}
}
return null;
}
function getPostLabels(entry){
var labels = [];
var categories = entry.category;
if(!categories){return labels;}
for(var i=0; i<categories.length; i++){
labels.push(categories[i].term);
}
return labels;
}
function getRecentPosts(json, label){
// this widget is made by copycat91 in his blog
var posts = [];
var entries = json.feed.entry;
var i = 0;
while(posts.length < num){
if(i == entries.length){break;}
var entry = entries[i];
if(entryHasLabel(entry, label)){
var title = entry.title.$t;
var href = getPermalink(entry);
var content = getContent(entry);
var post = {"title" : title, "href" : href, "content" : content};
posts.push(post);
}
i++;
}
return posts;
}
function isExists(array, val){
for(var i=0; i<array.length; i++){
if(array[i] == val){return true;}
}
return false;
}
function onLoadFeed(json_arg){
json = json_arg;
labels = getAllLabels(json);
showLabels(labels);
showLabeledPosts("*");
}
function showLabeledPosts(label){
// set label == "*" if you want to show all posts
posts = getRecentPosts(json, label);
showPosts(posts);
}
function showLabels(labels){
var s = "";
s += "<select onchange='showLabeledPosts(this.value)'>";
s += "<option value='*'/>Hangi kategorinin Son Yazısını İstemiştin ?";
for(var i=0; i<labels.length; i++){
var label = labels[i];
s += "<option value='"+label+"'/>" + label;
}
s += "</select>";
document.getElementById("pbl_labels").innerHTML = s;
}
function showPosts(posts){
var s = "";
if(!wsumm){s += "<ul>";}
for(var i=0; i<posts.length; i++){
var post = posts[i];
if(wsumm){
s += "<p>
";
s += "<b><a href='"+post.href+"' title='"+post.title+"'>" + post.title + "</a></b>
";
s += post.content;
s += "</p>
";
} else {
s += "
<li><a href='"+post.href+"' title='"+post.title+"'>" + post.title + "</a></li>
";
}
}
if(!wsumm){s += "</ul>
";}
document.getElementById("pbl_posts").innerHTML = s;
}
function stripHTML(s) {
var c;
var intag = false; var newstr = "";
for(var i=0; i<s.length; i++){
c = s.charAt(i);
if(c=="<"){intag = false;}
else if(c==">"){intag = false;}
if(c == ">"){newstr += " ";}
else if(!intag){newstr += c;}
}
return newstr;
}
//]]>
</script>

<script src="http://metamorpheuss.blogspot.com/feeds/posts/default?alt=json-in-script&callback=onLoadFeed">
</script></div>

Nasıl bir görsele sahip ?

Ne işe yarar ?

Nasıl yapılır ? Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada bu kodu aratın.

En Son Eklenen Videolar Eklentisi Düzen ve Ayarlama

Nasıl bir görsele sahip ?

Ne işe yarar ?

Nasıl yapılır ?

Blogger kontrol panelinizdeyken sırasıyla " Yerleşim >> Gadget ekle " tıklıyoruz. Açılan mini pencereden " HTML/JavaScript ekle " ye tıklıyoruz. Açılan pencereye aşağıdaki kodları ekliyoruz.

Blogger Resimli Son Yorumlar Eklentisi / Widget

Nasıl bir görsele sahip ?

Ne işe yarar ?

Nasıl yapılır ?

Blogger kontrol panelinizdeyken sırasıyla " Yerleşim >> Gadget ekle " tıklıyoruz. Açılan mini pencereden " HTML/JavaScript ekle " ye tıklıyoruz. Açılan pencereye aşağıdaki kodları ekliyoruz.

Düzenlemeniz gereken yerler şu şekilde:

numComments = 10 : gösterilecek yorum adedi characters = 40 : gösterilecek karakter sayısı bloghocam.blogspot.com : blogunuzun adresi

Nasıl bir görsele sahip ?

Ne işe yarar ?

Nasıl yapılır ? Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada " ]]></b:skin> " aratın ve bu kodun üstüne aşağıda verilen kodu ekleyin.

Koddan önceki görünüm:

Kod sonrası görünüm:

Ne işe yarar ?

Nasıl yapılır ? Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTML Düzenle " tıklıyoruz. Bu kodu buluyoruz: </b:skin> aşağıdaki kodun altına ekliyoruz.

Blogger kontrol panelinizdeyken sırasıyla " Yerleşim >> Gadget Ekle " tıklıyoruz. HTML/Javascript ekleyi seçip aşağıdaki kodu ekliyoruz.

Ara

Diğer İçerikler

Popüler

Etiketler

Bahsetmeler

Arşiv

Pages

Kategoriler

En Yeniler

Nasıl yapılır ?

Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada bu kodu aratın.

numComments = 10 : gösterilecek yorum adedi

characters = 40 : gösterilecek karakter sayısı

bloghocam.blogspot.com : blogunuzun adresi

Nasıl yapılır ?

Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTMLyi düzenle " tıklayın. CTRL ve F kombinasyonu'nu kullanarak sayfada " ]]></b:skin> " aratın ve bu kodun üstüne aşağıda verilen kodu ekleyin.

Nasıl yapılır ?

Blogger kontrol panelinizdeyken sırasıyla " Şablon >> HTML Düzenle " tıklıyoruz. Bu kodu buluyoruz: </b:skin> aşağıdaki kodun altına ekliyoruz.