Blogger Resimli Son Yorumlar Eklentisi

 

Birbirinden güzel temalar ve faydalı eklentiler yapan Harish, yine çok şık bir eklenti yapmış.Harish’in yaptığı bu eklenti ile blogunuzda yapılan son yorumları, yorumu yazanın avatarı gözükecek şekilde, blogunuzun kenar çubuğunda gösterebiliyorsunuz.

 

 

Resimli son yorumlar eklentisini blogunuza eklemek için aşağıdaki kodları HTML/JavaScript olarak eklemeniz yeterli.

 

<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

Blogunuza Not Kağıtları Ekleyin

Çoğumuzun eviminde veya ofisinde mantar pano vardır.Küçük raptiyeler kullanarak aldığımız kısa notları mantar panolara tuttururuz.Buna benzer benzer br uygulamayı bloglarınızda nasıl kullanacağınızı anlatamak istiyorum bu yazıda.

 

 

Blogunuzda resimde gördüğünüz not kağıtlarını 2 şekilde kullanabilirsiniz.Birincisi yazınızın içerisinde yazı ile ilgili önemli bir hatırlatma vs yapmak istediğinizde, ikincisi ise kenar çubuğunda ziyaretilerinize yine bir hatırlatma, duyuru vs yapmak istediğinizde.

 

Bu not kağıtlarını blogunuzda kullanmak için önce şablonunuzdan ]]></b:skin> kodunu bulun ve üstüne aşağıdaki stil kodlarını ekleyin.

 

.not {
padding: 0 20px 20px 20px;
border: 1px solid #DDD;
border-top: none;
border-left: none;
width: 160px;
min-height:150px;
float: right;
margin: 15px 0 15px 15px;
background-color: yellow;
font-size:14px;
font-style:italic;
line-height:1.5em;
color: #000;
}
.not div{
background: url(https://lh4.googleusercontent.com/-AEcWYy7Nx5k/T4VIYLgmChI/AAAAAAAACsk/3QDUFKoz6s8/s47/pin.png) no-repeat;
width: 47px;
height: 41px;
margin: -20px auto 10px auto;
}

 

Şimdi blogunuzda yeni bir kayıt oluşturmak için yazı editörünü açın ve HTML’yi Düzenle kısmına şu aşağıdaki kodları ekleyin.

 

<div class="not">
<div>
</div>
Bu not Serdar Kara tarafından Blog Hocam okuyucuları için yazılmıştır.
</div>

 

Kırmızı renkte olan yer not kağıdında gözükecek kısımdır.Not kağıdında gözükmesini istediğiniz yazıyı oraya yazın.

 

Denediğinizde sizin de farkedeceğiniz şey not kağıdınız sağ tarafa yaslanmış olması.Notları yazının kendisinden ayırmak için böyle bir stil kullanımış.Not kağıdını kenar çubuğuna eklemek isterseniz sağa yaslanması kötü duracağı için ilk verdiğim kodlardaki float: right; satırını silebilirsiniz.

TTNET Genç Yeteneklerin Yanında!

TTNET’in “Yeteneğe Destek, Yaratıcı Ekonomiye Destek Projesi”yle, gençlerimiz yeni kariyer firsatlarını keşfediyor.

 

Bilişim sektörüyle tanışan gençler, aldıkları eğitimlerle iş hayatına hazırlanıyor. TTNET, Türk ekonomisine destek oluyor. Siz de bu ücretsiz eğitimler hakkında bilgi almak için hemen tıklayın.

Bir bumads advertorial içeriğidir.

Yazı Altına Facebook Ve Twitter Paylaşım Kutusu Ekleyin

Hemen her blog yazarı ve blog okuyucusunun bir Facebook ve Twitter hesabı var.Bu yüzden yazılarınızın altında en azından bu sosyal ağlara ait butonların yer aldığı bir kutu göstermek yazılarınızın paylaşım sayısını ve takipçi sayınızı arttıracaktır.

 

Bu yazıda paylaştığım kodları blogunuza eklediğinizde yazılarınızın altında, resimde gördüğünüz gibi bir paylaşım kutusu çıkacak.Kutuda Facebook beğen ve gönder butonları ile Twitter tweetle ve takip et butonları var.

 

 

Bu Facebook ve Twitter paylaşım kutusunu blogunuza eklemek için şablonunuzda <div class='post-footer'> kodunu bulun ve bunun hemen altına aşağıdaki kodları ekleyin.

 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style=' height:80px; width:500px;  background:rgb(232, 240, 249); border: 1px solid rgb(171, 210, 233); padding: 10px; margin: 10px 0pt 10p 0px;'>
<p style='color: rgb(59, 89, 152); margin: 5px 0pt 5px; font: bold 1.3em helvetica,arial,verdana;'>Bu yazıyı beğendiğiniz mi? Paylaşın!</p>
<div id='fb-root'/><script src='http://connect.facebook.net/tr_TR/all.js#xfbml=1'/><fb:like send='true' show_faces='false' width='450'/>

<a class='twitter-share-button' data-count='horizontal' href='http://twitter.com/share'>Tweetle</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'/><a class='twitter-follow-button' data-lang='tr' data-show-count='false' href='https://twitter.com/bloghocam'>Takip Et</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=&quot;//platform.twitter.com/widgets.js&quot;;fjs.parentNode.insertBefore(js,fjs);}}(document,&quot;script&quot;,&quot;twitter-wjs&quot;);</script>
</div>
</b:if>

 

Kırmızı renkle yazdığım bloghocam yerine kendi Twitter ID’nizi yazmayı unutmayın.Bu eklentiye alternatif olarak şunları da deneyebilirsiniz:

• Yazı Sonuna E-Posta Abonelik Kutusu Ekleme
• Yazının Altına E-Posta Abonelik Formu Ekleme
• “Bu Yazıyı Beğendiniz Mi?” Eklentisi

Google+ Resmi Paylaş Butonu

Ziyaretçilerinizin, yazılarınızı Google+ hesaplarında paylaşmalarını sağlayacak olan resmi paylaş butonu kullanıma açıldı.Hemen blogunuza nasıl ekleyeceğinizi anlatayım.

 

 

1.Adım: Öncelikle Script kodlarını ekleyin.Şablonunuzda </head> kodunu bulun ve bunun hemen üzerine aşağıda ki kodları ekleyin.

 

<script type="text/javascript">
  window.___gcfg = {lang: 'tr', parsetags: 'onload'};

  (function() {
    var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
    po.src = 'https://apis.google.com/js/plusone.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
  })();
</script>

 

2.Adım: Şimdi butonu görüntüleyecek kodu ekleyin.Nerede görüntülenmesini istiyorsanız oraya ekleyeceksiniz.Örneğin yazının altında gözükmesini istiyorsanız <div class='post-footer'> kodunu bulun ve buınun hemen altına aşağıdaki kodu ekleyin.

 

 

<div class="g-plus" data-action="share" data-annotation="bubble"></div>

 

Paylaş butonunu farklı tarz ve boyutlarda da kullanabilirsiniz.Bunun için Google+ paylaş butonunun resmi sayfasına gidip istediğiniz tarzda ki butonu oluşturabilirsiniz.

Google Drive... Artık Kullanıma Hazır!

‘Loch Ness Canavarı’ efsanesi gibi Google Drive hakkında da birçok söylenti duymuş olabilirsiniz. Artık bu iki söylentiden biri gerçek oldu.

Google Drive artık sizlerin kullanımına hazır – burası, yaratabileceğiniz, paylaşabileceğiniz, birlikte çalışabileceğiniz ve her şeyinizi saklayabileceğiniz bir yer. İster arkadaşınızla ortak bir araştırma projesi üzerinde çalışıyor olun, ister nişanlınızla düğün planları yapın, isterseniz de iş arkadaşlarınızla birlikte bütçe takip edin; tüm bunların hepsini Drive üzerinde yapabilirsiniz. Videolarınızı, fotoğraflarınızı, belgelerinizi, PDF dosyalarınızı ve çok daha fazlasını Drive’a yükleyip istediğiniz yerden bilgilerinize ulaşabilirsiniz.

Google Drive ile:

Yaratın ve ortaklaşa çalışın: Belgeleriniz, sunumlarınız ve tablolarınız üzerinde ekip arkadaşlarınızla eş zamanlı olarak çalışabilmeniz için Google Docs’u Google Drive’a entegre ettik. İçeriğinizi paylaşmayı kabul ettiğiniz herkesle PDF, resim, video ve benzeri tüm dosyalar üzerinde birlikte çalışabilir, çalıştığınız içerikler üzerinde yorum yapabilir ve başkalarının paylaştığınız içerik üzerindeki yorumlarının size bildirim olarak gelmesini sağlayabilirsiniz.

Her şeyi güvenle saklayın ve istediğiniz yerden ulaşın (özellikle bilgisayarınızdan uzaktayken): Her şeyiniz artık 'orada'. Tüm dosyalarınıza artık her yerden ulaşabilirsiniz - İnternetten, evinizden, ofisinizden ya da isterseniz koşarken mobil cihazınızdan- Drive’ı Mac’inize, PC’nize yükleyebilir, Drive Uygulamasını Android telefonunuza veya tabletinize indirebilirsiniz. Drive Uygulaması’nın iOS cihazlarda da kullanılabilmesi için çalışmalarımıza devam ediyoruz. Ayrıca platform ayrımı olmadan; tüm görme engelli kullanıcılar Drive’a “ekran okuyucu” ile ulaşabilecekler.

Her şeyi arayın: Anahtar kelimenizle aramanızı gerçekleştirin, dosya tipine, dosya sahibine ve çok daha farklı alternatife göre sıralayın. Drive, “Optik Karakter Algılama” (OCR) teknolojisi ile görsel dosyaların içindeki yazılara ulaşarak, arama yapmanıza olanak sağlıyor. Aynı zamanda görsel algılama sistemi ile Büyük Kanyon gezinizin fotoğraflarını [büyük kanyon] yazarak arayabilir ve çektiğiniz vadi resimlerine aradığınız an ulaşabilirsiniz. Bu teknoloji henüz hala geliştirilme aşamasında olduğu için zaman içinde daha da iyileştirilmesini hedefliyoruz.

Google Drive’da size sunulmuş 5GB’lık alanı hemen ücretsiz kullanmaya başlayabilirsiniz. Bu alan, size yaz tatilinizde çektiğiniz yüksek çözünürlüklü fotoğrafları, dedenizin anneanneniz için kaleme aldığı aşk mektuplarının taranmış hallerini, kariyerinizin en büyük teklif sunumunu saklamaya yeteceği gibi, üzerinde çalıştığınız yeni kitabınızı taslağını da saklamanıza olanak sağlıyor. Aylık 2,49$ ödeyerek 25GB, 4,99$ ödeyerek 100 GB ve 49,99$ ödeyerek 1TB veri alanına sahip olabilirsiniz. Ücretli hesabı tercih ettiğinizde, Gmail hesabınız da 25GB’a yükselmiş olacak.

Drive, kullanıcılarımıza daha iyi bir Google tecrübesi yaşatmak ve diğer ürünlerimiz ile bir bütünlük içerisinde çalışmak üzere tasarlandı. Doğrudan Drive’dan Google+ hesabınıza içerik aktarabilirsiniz. Çok yakında Gmail’den göndereceğiniz e-postalarınıza Drive’dan istediğiniz dosyayı ekleme imkanına da sahip olacaksınız. Google Drive aynı zamanda açık bir platform; yani faks yollayabilmek, video düzenleyebilmek ve web sitesi şablonları tasarlayabilmek için Drive kullanımı konusunda birçok üçüncü parti ile de birlikte çalışıyoruz. Bu uygulamaları kullanabilmek için Chrome Web Mağazası’nı ziyaret edebilir, diğer uygulamalar hakkında bilgi alabilirsiniz.

Google Drive henüz başlangıç aşamasında ve yeni özelliklerin eklenmesi konusunda çalışmalara devam ediyoruz.

Drive’ı kullanmaya hemen bugün drive.google.com/start adresinden başlayabilirsiniz ve Loch Ness Canavarı ile ilgili hikayeleri aramaya devam edebilirsiniz...

Sundar Pichai, Chrome ve Uygulamalar, Kıdemli Başkan Yardımcısı

Blogger Dişli Yorumlara Stil Verelim

Blogger’ın bir süre önce dişli yorumlara geçtiğini ve yorumlara yanıtlama seçeneğinin geldiğini çok iyi biliyorsunuz.Birçok Blogger kullanıcısı bu dişli yorumların görünümünü beğenmediği için kullanmayı pek tercih etmiyor.O halde dişli yorumlara biraz stil katıp, daha güzel bir görünüme kavuşturalım.

 

 

Yapacağınız 2 küçük değişiklik ile bu resimde gördüğünüz gibi bir yorum bölümüne kavuşacaksınız.Ancak hemen belirteyim, bunu sadece Blogger’ın kendi şablonlarında denediğim için özel şablonlarda işe yarayıp yaramadığından emin değilim.

 

Öncelikle şablonunuzun ]]></b:skin> kodunun üstüne aşağıdaki stil kodları ekleyin.

 

.comments {
  clear: both;
  margin-top: 10px;
  margin-bottom: 0px;
  line-height: 1em;
}
.comments .comments-content {
  font-size: 12px;
  margin-bottom: 16px;
font-family: Verdana;
font-weight: normal;
text-align:left;
line-height: 1.4em;
}
.comments .continue a, .comments .comment .comment-actions a {
display:inline;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
padding: 2px 5px;
text-decoration: none;
text-shadow:0 1px 1px rgba(0,0,0,.3);
color:#FFF;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
margin-right: 10px;
border: 1px solid #3079ED;
background: #0066FF;
background: -webkit-gradient(linear, left top, left bottom, from(#0099FF), to(#009999));
background: -moz-linear-gradient(top, #0099FF, #009999);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=&#39;#0099FF&#39;, endColorstr=&#39;#009999&#39;);
}
.comments .continue a:hover, .comments .comment .comment-actions a:hover {
  text-decoration: none;
background:#0099FF;
background: -webkit-gradient(linear, left top, left bottom, from(#009999), to(#0099FF));
background: -moz-linear-gradient(top, #009999, #0099FF);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=&#39;#009999&#39;, endColorstr=&#39;#0099FF&#39;);
}
.comments .continue a:active, .comments .comment .comment-actions a:active {
position: relative;
top:1px;
background: -webkit-gradient(linear, left top, left bottom, from(#0066FF), to(#0099CC));
background: -moz-linear-gradient(top, #0066FF, #0099CC);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=&#39;#0066FF&#39;, endColorstr=&#39;#0099CC&#39;);
}
.comments .comments-content .comment-thread ol {
  list-style-type: none;
  padding: 0;
  text-align: none;
}
.comments .comments-content .inline-thread {
  padding: 0.5em 1em 0 1em;
}
.comments .comments-content .comment-thread {
  margin: 8px 0px 0px 0px;
}
.comments .comments-content .comment-thread:empty {
  display: none;
}
.comments .comments-content .comment-replies {
  margin-top: 1em;
  margin-left: 40px;   font-size:12px;
}
.comments .comments-content .comment {
  padding-bottom:8px;
  margin-bottom: 0px
}
.comments .comments-content .comment:first-child {
  padding-top:16px;
}
.comments .comments-content .comment:last-child {
  border-bottom:0;
  padding-bottom:0;
}
.comments .comments-content .comment-body {
  position:relative;
}
.comments .comments-content .user {
  font-style:normal;
  font-weight:bold;
}
.comments .comments-content .user a {
  color: #444;
}
.comments .comments-content .user a:hover {
  text-decoration: none;
color: #555;
}
.comments .comments-content .icon.blog-author {
  width: 18px;
  height: 18px;
  display: inline-block;
  margin: 0 0 -4px 6px;
}
.comments .comments-content .datetime {
  margin-left:6px;
color: #999;
font-style: italic;
font-size: 11px;
float: right;
}
.comments .comments-content .comment-content {
font-family: Arial, sans-serif;
font-size: 12.5px;
line-height: 19px;
}
.comments .comments-content .comment-content {
font-family: Arial, sans-serif;
font-size: 12.5px;
line-height: 19px;
  text-align:none;
margin: 15px 0 15px;
}
.comments .comments-content .owner-actions {
  position:absolute;
  right:0;
  top:0;
}
.comments .comments-replybox {
  border: none;
  height: 250px;
  width: 100%;
}
.comments .comment-replybox-single {
  margin-top: 5px;
  margin-left: 48px;
}
.comments .comment-replybox-thread {
  margin-top: 5px;
}
.comments .comments-content .loadmore a {
  display: block;
  padding: 10px 16px;
  text-align: center;
}
.comments .thread-toggle {
  cursor: pointer;
  display: inline-block;
}
.comments .comments-content .loadmore {
  cursor: pointer;
  max-height: 3em;
  margin-top: 3em;
}
.comments .comments-content .loadmore.loaded {
  max-height: 0px;
  opacity: 0;
  overflow: hidden;
}
.comments .thread-chrome.thread-collapsed {
  display: none;
}
.comments .thread-toggle {
  display: inline-block;
}
.comments .thread-toggle .thread-arrow {
  display: inline-block;
  height: 6px;
  width: 7px;
  overflow: visible;
  margin: 0.3em;
  padding-right: 4px;
}
.comments .thread-expanded .thread-arrow {
  background: url(&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC&quot;) no-repeat scroll 0 0 transparent;
}
.comments .thread-collapsed .thread-arrow {
  background: url(&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==&quot;) no-repeat scroll 0 0 transparent;
}
.comments .avatar-image-container {
  float: left;
  overflow: hidden;
}
.comments .avatar-image-container img {
  width: 36px;
}
.comments .comment-block {
  margin-left: 48px;
  position: relative;
padding: 15px 20px 15px 20px;
background: #F7F7F7;
border: 1px solid #E4E4E4;
overflow: hidden;
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-image: initial;
}

 

Ardından şablonunudza <b:include data='post' name='comments'/> kodunu aratın.Birden fazla sonuç çıkacaktır.Bunlardan ilkini yani en üsttekini aşağıdaki kodlar değiştirin.

 

<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>

 

Şablonunuzu kaydettikten sonra kayıt sayfalarını açtığınızda yorum bölümüneki değişikliği farkedeceksiniz.

Özel 404 Hata Sayfası Oluşturun

Geçtiğimiz günlerde yazdığım Yeni Arama Tercihleri İle Blogger’da SEO Daha Kolay başlıklı yazıda Blogger’ın sunduğu yeni ayarlardan bahsetmiştim.Bunlardan biri 404 hata sayfalarını özelleştirebilmemizdi.Bir kullanıcı blogunuzda sdaha önce slinmiş bir yazıya ulaşmak istediğinde veya hatalı bir URL yazarak sayfalarınızdan birine ulaşmak istediğinde sayfanın bulunamadığını belirten bir hata sayfası ile karşılaşır.İsterseniz Blogger’ın klasik hata sayfasını aşağıda resimde gördüğünüz şekilde özelleştirebilirsiniz.

 

 

1.Adım: Öncelikle şablonunuzun ]]></b:skin> kodundan önce aşağıdaki stil kodlarını ekleyin.

 

#error {
background-color: #F2F2F2;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEirmAxugVUFMFWY08udVWF5woj4EVRcGhxjBSTA_OiLTsHUza1Sfj5qcw0tSJ0SjnsVDGySFPyRng54L7TXT5yDCuPDE6Ip1ljdR88nzqx1SEYv5fVqNau7iGXBuS850BqOqBbSROdkpob6/s200/bg_ku.png');
background-repeat: repeat;
color: #555555;
height: 100%;
left: 0;
margin: 0;
padding: 0;
position: fixed;
text-align: center;
top: 0;
width: 100%;
z-index: 999;
line-height: 170%;
}
#error #halaman {
position: relative;
height: auto !important;
height: 100%;
min-height: 99%;
}
#error #halaman h2 {
margin: 1em 0;
}

#error #wadah {
margin-top: 120px;
}
#error .tengah {
margin: 0 auto;
width: 920px;
}
#error .box-atas, #error .box-bawah {
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHkJz1tqtPrTSqfQDCr6F6lG9hui09DRy1Sm2KSMdO5ikqp3V-XlVPs8P-0_LLxDNJuBA9w7W4xSuhseZ7RGyoA5OlFy1AmraOjWqRZkeYUHH17zLT8Xxt3iXHfoGn0Hhw9Ba9lKlk4tIh/s944/box-sprite.png');
background-repeat: repeat;
background-position: 0 0;
height: 43px;
margin: 0 -12px;
width: 944px;
}
#error .box-atas {
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhHkJz1tqtPrTSqfQDCr6F6lG9hui09DRy1Sm2KSMdO5ikqp3V-XlVPs8P-0_LLxDNJuBA9w7W4xSuhseZ7RGyoA5OlFy1AmraOjWqRZkeYUHH17zLT8Xxt3iXHfoGn0Hhw9Ba9lKlk4tIh/s944/box-sprite.png');
background-repeat: no-repeat;
background-position: 0 -43px;
}
#error .box {
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6Lu4mOlASrOMYqrMQ1ocq0aFXYGxy6_04C0Z9ESPBy9tbnK4Lr1hBXXj0MYbPTTrYZ8Lai_iYAi2ji3FsqQqUW9C1EyQhn4VsuWDk7d90gUDfnU4-Tj3jEchXTyRGEWNw7uEpkmDVe-EU/s920/box-horizontal.png');
background-repeat: repeat-y;
background-position: 0 0;
min-height: 200px;
padding: 10px 50px;
}

 

2.Adım: Şimdi Ayarlar > Arama tercihleri > Sayfa Bulunamadı Sayfası İçin Özel İçerik > Düzenle diyerek kutuya aşağıdaki kodları kendinize göre düzenleyerek ekleyin ve değişiklikleri kaydedin.

 

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>

<h1>SAYFA BULUNAMADI !</h1>
<div id="error">
<div id="wadah">
  <div class="tengah">
   <div class="box-atas"></div>
   <div class="box">
    <div id="halaman">
    <p><img style="background-image: none; border-bottom: 0px; border-left: 0px; padding-left: 0px; padding-right: 0px; border-top: 0px; border-right: 0px; padding-top: 0px" border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbiWMv_1n5HSENtG4pQiOpcrHDFxs82xaVYI_iSuMJdp4QZFFuhZqX2Ea2IMO6NCydHut2VemT54g6MWWDPCAhHhqspyVDzXJfLhte6ohY1QplixAXBIb5DLOw5eBwoc4H_ohyGBDhasbf/s350/4041.jpg" /></p>
     <p>Ulaşmaya çalıştığınız sayfa bulunamadı.Lütfen ulaşmak istediğiniz sayfanın adresini doğru yazdığınızı kontrol edin.Eğer adresi doğru yazdığınızdan eminseniz ulaşmak istediğiniz sayfa silinmiş olabilir.  </p>
     <p> <h2><a href="http://bloghocam.blogspot.com/" title="Blog Hocam" >Ana Sayfa</a></h2></p>
    </div>
   </div>
   <div class="box-bawah"></div>
  </div>
</div>
</div>

</b:if>

 

Şimdi blogunuzda var olmayan her hangi bir sayfaya gitmye çalışın.Örneğin:

 

http://blogunuz.blogspot.com/laylaylom.html

 

Eski hata mesajının yerine tam ekran bir hata mesajı sayfası karşınıa çıkacaktır.Bu yöntemle çok daha yaratıcı hata sayfaları oluşturabilirsiniz.

'Android için Chrome’dan Son Haberler

Android işletim sistemi için geliştirilen Chrome Beta sürümünü çıkardığımız Şubat ayından bu yana geri bildirimlerinizi dikkatle dinliyoruz. Yorumlarınızı bizimle paylaştığınız için teşekkürler. Çoğunuzun Chrome deneyimini Android 4.0 telefon ve tabletlerle yaşamaktan memnun olduğunu öğrenmek bizleri çok mutlu etti.

Yapılan güncelleme ile Android için Chrome Beta sürümü, 31 yeni dil desteği ile, Türkiye’de dahil Google Play’e erişilebilen tüm ülkelerden artık indirilebiliyor. Yeni Chrome’a birçok özellik ekledik, işte bunlardan birkaçı:

• Artık sitelerin mobil sürümünü görüntülemeyi tercih etmezseniz, Chrome ile siteyi standart haliyle görüntüleme şansına sahipsiniz.
• Artık yer imlerini ana ekranınıza doğrudan ekleyebilir böylece en sevdiğiniz sitelere daha hızlı ulaşabilirsiniz.
• Favori uygulamanızı belirleyerek Chrome üzerinden bağlantılarını yönetebilirsiniz.
• Kablosuz bağlantınız için proxy ayarlarınız mı var? Chrome’u artık Android ayarlarında yapılandırılan sistem proxy’sisi ile kullanabilirsiniz.

Eğer web sitesi yapıyorsanız Android için Chrome Kullanıcı Aracısı düzenlemelerindeki değişikliğe göz atmanızı öneririz.

Eğer hala yüklemediyseniz Android için Chrome’u, Android 4.0 (Ice Cream Sandwich) üzerinde Google Play’den telefon veya tabletinize indirebilirsiniz. Halen Beta halinde olduğu için geri bildirimlerinizle Android için Chrome’u geliştirmeye devam etmeyi sabırsızlıkla bekliyoruz.

Dan Alcantara ve Oli Lan, Chrome Android Yazılım Mühendisleri

Hello Bar: Bilgilendirme Çubuğu

Hello Bar isimli popüler servis bizlere bloglarımızda kullanmak üzere bilgilendirme çubuğu oluşturma imkanı sunuyor.Ücretli ve ücretsiz seçenekleri bulunan bu servis çoğu blogcu tarafından tercih ediliyor.Neden mi?

• Gradient ekleme özelliği sayesinde aynı renkte fakat farklı desenlerde çubuklar oluşturabiliyorsunuz.
• Diğer çubuklardan farklı olarak kapattıktan sonra tekrar açabiliyorsunuz.
• Kaç kez tıklandığına dair istatistikleri görebiliyorsunuz.

İşte bu özellikleri Hello Bar’ı diğerlerinden farklı ve üstün kılıyor.Şimdi size Hello Bar’ı ücretsiz olarak blogunuza nasıl ekleyeceğinizi anlatmak istiyorum.

 

 

 

1.Adım: Öncelikle ücretsiz üye olmak için Hello Bar ana sayfasına bulunan Free Sign Up butonuna bastığınızda açılan pencerede ki kutuya e-posta adresinizi yazdıktan sonra SIGN UP butonuna basın.

 

 

2.Adım: ilk adımı tamamladıktan bir kaç saniye sonra e-posta adresinize Welcome to Hello Bar balıklı bir posta gelecek.Bu postada kullanıcı adınız ve şifreniz yazıyor.Hello Bar Login sayfasına giderek bu bilgilerle hesabınıza giriş yapın.

 

 

3.Adım: Hesabınıza giriş yaptıktan sonra Hello Bar’ınızı oluşturmak için CREATE NEW butnuna basın.Settings bölümünden çubuğun ayarlarını yaptıktan sonra SAVE butonuna basın.

 

 

4.Adım: Çubuğunuzun ayarlarını yapıp SAVE butonuna bastıktan sonra açılan penceredeki kodu kopyalayın ve şablonunuzun </head> kodundan önce yapıştırın.

 

 

Bu paylaştığım üçüncü bilgilendirme çubuğu.Alternatifleri görmek isterseniz daha önce paylaştığım şeffaf kapatılabilir bilgilendirme çubuğuna ve Nedim Arabacı tarafından yapılan Noty bilgilendirme çubuğuna göz atabilirsiniz.

SEO Dostu Url Oluşturalım

Bizler özellikle Blogger sistemi üzerinde yoğunlaşmış ve bu sistemin blogculara önemli artılar kattığını düşünen blogcularız. Bu yazımızda Blogger SEO ile ilgili oldukça faydalı ve bilinmeyen ip uçlarını kavrayacak ve bunları kullanmamız sonucunda neler kazanacağız bunları öğreneceğiz.

URL nedir ? URL ile SEO etkileşimi ?

 Aslında her birimiz birer blogcu olduğumuz için URL'nin ne olduğunu zaten biliyoruzdur. Ama belkide aramızda terimsel olarak bilmeyenler vardır. Yinede açıklamak ile konumuza başlamanın faydalı olacağını düşünüyorum.

"URL insanların internet üzerindeki ulaştıkları" adreslerdir şeklinde açıklamamız mümkündür.
URL'nin SEO ile etkileşimi buradan sonra yazımızın ip ucunu vereceğimiz kısıma yaklaştığımızın habercisidir.

Blog Hocam üzerinde dahi bir çok URL'ye göz atabilirsiniz bu hatayı görmeniz muhakkak mümkün olacaktır.Örnek olarak bir yazımız var bu yazımızın başlığını Blogger sistemize girelim ;

Dünya üzerindeki en ünlü 5 Sosyal Ağ  (inceleme)

- Bunu bu şekilde Blogger'dan başlık olarak açarsak yazımızın Url'sinin yarısı görüntülenmeyecek çünkü Url'miz oldukça uzun

- Arayıcı kitlesi Arama motorları üzerinden arama ile gelme ihtimali çok düşecek çünkü; hem URL karekter olarak çok geniş

- Arama motorları uzun bir URL' ile sahip konumuz olduğu için yazmız her ne kadar bilgilendirici özelliğe sahip olursa olsun yinede bizi arka sırala atıcaktır.

Arama Dostu URL oluşturalım

 Şimdi bizler göstermiş olduğum ve çoğu kişinin bilmediği yada bilenlerin de paylaşmadığı benim kendi düşüncem ile bulmuş olduğum bir ip ucunu göstereceğiz.

Blogger sistemi bize Wordpress'de çok fazla kullanılan bir özelliği kullanım izni sağlıyor aslında tabi ki eğer biz bunu fark edebilirsek. Şimdi Blogger panelimizden yeni yayın oluşturmak için giriyoruz. Blogger panelimizin başlık kısmına URL'mizi kısaltacağız ve sonra kolay kullanım ekleyeceğiz bunu nasıl yapacağız ?

Başlık kısmına Url'mizi ;En unlu 5 Sosyal ag şeklinde yazıyoruz.Böylece Url'miz ;

1- Url'miz kısaldı +1
2- Url'miz Türkçe karekterlerden arındırıldı.
3-Url'miz SEO dostu oldu.
4- Url'miz artık daha üstlerde yer alabilir (kısa olduğundan dolayı)
5- İnsanlar bunu bu şekilde arama motoru üzerinden ararlarsa eğer ulaşma ihtimalleri daha yüksek olduğu için daha çabuk hit kazanabiliriz.

Bunu eğer ; Dünya üzerindeki en ünlü 5 Sosyal ağ (inceleme) olarak başlık bölgemize yazarsak ; www.siteadi.blogspot.com/tarih/tarih/Dnya-zerindeki-en-nl-5-sosyal-ag-inceleme olacaktı ki ; şimdi bu URL ; www.siteadi.blogspot.com/tarih/tarih/en-unlu-5-sosyal-ag.html oldu.

Eminim şimdi aklınıza gelen ilk soru peki ama bu kadar yazıyı bunun içinmi okuduk yani ? o zaman başlıklarımızda sitemizde öyle görünecek diyebildiğinizi duyabilyorum sanki :) tabiki hayır.

Yazımızı yayınladıktan hemen sonra tekrar yazıyı düzünlemek için giriyoruz ve Başlığımızı Dünya üzerindeki en ünlü 5 Sosyal Ağ  (inceleme) olarak değiştiriyoruz. ve tekrar siteye gidip Url'ye bir bakıyorsunuz ki ;URL farklı ve yazınızın Title'ı farklı :) böylece hem kısa bir url elde ettik hem SEO etkileşimini sağladık hemde yazımız için örneğin kendi blogumda çok sık kullandığım (inceleme), (infografik) gibi okuyucuyu bilgilendiren bir başlık zenginliği de katmış olduk.

Uzunca yazımızı okuyan herkeze çok teşekkür ediyorum :) aklınıza takılan sorularınızı sormanız ve yorumlarınızı esirgememeniz dileğimle :)

 

Yazar Hakkında:  Burak Göç Sosyal Medya,SEO ve Blogging konularında yazılar veren bir blogcu ve Bilgeyazar gelişimi ile ilgileniyor.Bu yazısı Blog Hocam’da Misafir blogcu olarak yayınlanmıştır.

Türk Yapımı “Noty” Bilgilendirme Çubuğu

Daha önce kapatılabilir şeffaf bir bilgilendirme çubuğu paylaşmıştım.Bir arkadaşımın isteği üzerine yine buna benzer bir bilgilendirme çubuğu ararken Nedim Arabacı tarafından geliştirilmiş Noty ile karşılaştım ve sizlerle de paylaşmak istedim.

 

 

Bu kapatılabilir bilgilendirme çubuğu pat diye değil bir efekt ile açılıyor ve köşesindeki X ikonuna basılmadığı takdirde belli bir süre sonra kendiliğinden kapanıyor.Blogunuza nasıl ekleyeceğinize gelirsek…

 

1.Adım: Şablonunuzdan </head> kodunu bulun ve hemen üstüne aşağıdaki kodları ekleyin.

 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script type="text/javascript" src="http://yourjavascript.com/61925244214/jquery-noty.js"></script>

<link rel="stylesheet" type="text/css" href="https://drive.google.com/file/d/0BxxMpDce-fNUQjl0cjd5ZXZfbWc"/>
<link rel="stylesheet" type="text/css" href="https://drive.google.com/file/d/0BxxMpDce-fNUd1Y1NlVqd1QtV0U"/>

 

2.Adım: Şablonunuzdan bu kez </body> kodunu bulun ve hemen üstüne aşağıdaki kodları ekleyin.

 

<script type="text/javascript">
noty({"text":"Blog Hocam'ı Twitter'da takip edin! <a href='http://twitter.com/bloghocam' target='_blank'>@BlogHocam</a>","layout":"bottom","type":"success","textAlign":"center","easing":"swing","animateOpen":{"height":"toggle"},"animateClose":{"height":"toggle"},"speed":750,"timeout":10000,"closable":true,"closeOnSelfClick":false});
</script>

 

Bu çubuğu sayfanın 3 farklı yernde gösterebilirsiniz.Çubuğun sayfanın üst kısmında gözükmesini istiyorsanız bottom yazan yeri top ,  ortada bir pencere şeklinde açılmasını istiyorsanız center olarak değiştirebilirsiniz.

 

Nedim Arabacı’ya böyle bir uygulama geliştirip bizlerle paylaştığı için bir kez daha teşekkür ediyorum.http://needim.github.com/noty/#creator sayfasına gidip bu uygulamadan yararlanarak farklı tarzda çubuklar da oluşturabilirsiniz.

İlk Sony Xperia Sahnede

Sony, Xperia NXT (Gelecek Kuşak) serisinden Xperia S ile Android telefon dünyasına hızlı bir giriş yaptı. Sony’nin 4 ekran stratejisinde önemli bir yeri olan çift çekirdekli tasarım harikası Xperia S, Sony Bravia HD parlak ekranıyla akıllı ve eğlenceli Android telefon dünyasının yeni ikonu olacak.

Sony’nin 4 ekran vizyonunda içerik paylaşımını en üst seviyeye taşıyan çift çekirdekli tasarım harikası Xperia S, televizyondan tablete tüm elektronik cihazlara bağlanarak kullanıcıya eşsiz bir deneyim yaşatıyor. Ofis ve ev ortamında kullanıcıyı küçük telefon ekranına bağlı kalmaktan kurtararak Android telefonları birer mobil teknoloji üssü ve pratik uzaktan kumandaya dönüştüren Xperia S, Sony Bravia HD parlak ekranı ile eşsiz bir görsel deneyim sunuyor.

Xperia S, 12 megapiksel Exmor R kamerası ile bekleme modundan 1,5 saniye gibi kısa bir sürede çıkarak fotoğraf çekimi yapabiliyor veya Full HD video çekebiliyor. Sony kalitesini yansıtan telefon ekranının altını vurgulayan ışıklı şeffaf bandıyla hemen dikkat çeken Xperia S şık tasarımı ile akıllı telefon dünyasının ikonu olacak.

Xperia S Sony dünyasının bir parçası

Kullanıcının TV, akıllı telefon, dizüstü bilgisayar ve tablet arasında kolayca geçiş yapmasını sağlayan Xperia S mobil teknoloji ile ev ve ofis ortamını birleştiren tam bir cep kontrol merkezi. Birbirine bağlı bu dünyada sadece akıllı bir uzaktan kumandadan ibaret olmayan Xperia S, HDMI bağlantısı ile televizyon üzerinden Sony Entertainment Network’e bağlanarak filmlerden müziğe, video oyunlarından kliplere kadar her alanda kullanıcılara dijital eğlencenin kapılarını açıyor.

Xperia S kablosuz ağ bağlantısı ile fotoğrafların ve videoların tek tuşla paylaşılmasını sağladığı gibi NFC (yakın alan iletişim) teknolojisi ile kullanıcıların telefonları arasında resim, belge ve şarkı paylaşmasına da izin veriyor.

Eşsiz Sony eğlence dünyasına cepten erişim

Xperia S kullanıcıları Sony Entertainment Network’e bağlanabilecek. Music Unlimited 15 milyondan daha fazla şarkı içeren global bir katalog sunarken Video Unlimited da dünyanın büyük yapımcılarının gişe hasılatı rekorları kıran en yeni filmleriyle TV dizilerini akıllı telefona taşıyacak. Aynı zamanda PlayStation™ onaylı Xperia S, PlayStation® Store üzerinden kullanıcılara Sony PlayStation kalitesini yaşatacak.

Android 2.3 Gingerbread işletim sistemiyle satışa sunulan Xperia S, 2012’nin ikinci yarısında Android 4.0 Ice Cream Sandwich sürümüne güncellenebilecek. Xperia S Turkcell mağazalarında satışa sunuldu.



Bir bumads advertorial içeriğidir.

Son Zamanlarda Blogda Yaptığım Değişiklikler-3

Daha önce blogda yaptığım değişikliklerden şurada ve şurada bahsetmiştim.Son zamanlarda üçüncü bir seri değişklik daha yaptım.Kısaca bunlardan bahsetmek istiyorum.

 

1. Click Box

 

 

Bir süredir Click Box adını verdiğim, içerisinde Facebook, Twitter ve +1 butonlarını bulunan widgetı değiştirmeyi düşünüyordum ancak nasıl bir tasarım olacağı konusunda kararsızdım.Bloglar arası bir gezinti yaparken http://www.yazar.gen.tr/ adresinde ki bloga rastladım ve orada gördüğüm tasarım çok hoşuma gitti.Küçük değişiklikler yaparak Click Box’ı güncelledim.

 

2. E-Posta Abonelik Formu

 

 

E-posta abonelik formu bence kenar çubuğunda ki en önemli öğelerden.Blogunuzu takip etmek isteyenler için en kolay ve en cazip  seçenek e-posta aboneliği olduğu için bu formun tasarımına özen göstermelisiniz.Blog Hocam’ın kenar çubuğundaki öğelerin sayısı arttıkça kullandığım e-posta abonelik formu eskisi kadar dikkat çekmemeye başlamıştı.Ben de küçük bir değişiklik yaparak daha dikkat çekici bir görünüm kazandırmak istedim.Başarılı oldum sanırım.

 

3. Yeni Rozeti

 

 

Ana sayfada gördüğünüz ve en son yayınlanan yazının sağ üst köşesinde ki yeni rozetini şu ana kadar başka bir blogda görmediğim için ( mutlaka vardır da ben henüz denk gelmedim ) çok seviyorum.Bu rozet sadece ana sayfada en son yazının köşesinde gözüküyor.

 

Söz Sizde

Yaptığım bu değişklikler hakkında ki fikirlerinizi merak ediyorum.Yorum bölümünden benimle paylaşırsanız sevinirim.Aklıma yeni bir fikir geldiğinde veya başka bir blogda gördüğüm bir özellikten etkilendiğimde yenilikler yapmaya devam edeceğim.Şimdilik bu kadar.

CSS İle Uyarı Mesajı Kutuları Yapalım

Bu yazıda, blog yazılarınızda bir mesaj vermek veya uyarı yapmak istediğinizde kullanmanız için ikonlarla desteklenmiş mesaj kutuları yapmayı anlatacağım.Bu mesaj kutrtularını CSS teknolojisi ile yapcacağız.Bu örneklerden yola çıkarak siz de benzer kutular ve paneller oluşturabilirsiniz.Başlamadan önce her blogcunun bilmesi gerektiğini düşündüğüm ve bu mesaj kutularını oluştururken kullandığımız CSS’ten bahsetmek istiyorum.

 

 

CSS Nedir?

 

CSS (Cascading Style Sheets) yani stil şablonları; HTML’e ek olarak web sayfalarına daha çok görsellik katmak için geliştirilmiş bir web teknolojisidir.CSS le bir web sayfasındaki öğelerin rengini, boyutunu, konumunu ve bir çok özelliğini kolayca ayarlayabiliriz.

 

Blogger şablonlarında CSS kodları ]]></b:skin> kodunun üzerindeki bölümde bulunur.CSS öğrenerek  belki kendi temanızı sıfırdan yapamazsınız ancak mevcut temalarda değişiklikler yapabilirsiniz.CSS hakkında daha detaylı bilgiler bulmak için Fatih Hayrioğlu’nun blogunu ziyaret edebilirsiniz.

 

Gelelim mesaj kutularını oluşturmaya.Öncelikle şablonumuza kutuların görünümünü tanıtmak için gerekli CSS kodlarını ekleyeceğiz.Bu kodları yukarıda da bahsettiğim gibi şablonumuzun ]]></b:skin> kodunun üstüne yazacağız.Örnek olarak 3 ayrı uyarı kutusu oluşturacağız.Siz bu örneklerden faydalanarak kendi mesaj kutularınızı oluşturabilirsiniz.Kodlar şöyle:

 

.dikkat{
        border:solid 1px #DEDEDE;
        background:#FFFFCC url(http://icons.iconarchive.com/icons/famfamfam/mini/16/icon-alert-icon.png) 8px 6px no-repeat;
        color:#222222;
                font-weight:bold;
        padding:4px;
        text-align:center;
    }
    .onay{
        border:solid 1px #90ac13;
        background:#eef4d3 url(http://icons.iconarchive.com/icons/famfamfam/silk/16/accept-icon.png) 8px 6px no-repeat;
        color:#6b800d;
        font-weight:bold;
        padding:4px;
        text-align:center;
    }
    .yasak{
        border:solid 1px #CC0000;
        background:#F7CBCA url(http://icons.iconarchive.com/icons/famfamfam/silk/16/delete-icon.png) 8px 6px no-repeat;
        color:#CC0000;
        font-weight:bold;
        padding:4px;
        text-align:center;
    }

 

Kodlarda dikkkat, onay ve yasak isimli 3 ayrı kutunun görünümü belirttik.Şimdi sıra bu kodları kullanmaya geldi.

 

Blogunuza yeni kayıt oluştururken HTML’yi Düzenle bölümünü açın ve buraya aşağıdaki kodları yazın:

 

<div class="dikkat">
Blog Hocam Dikkat Mesaj Kutusu</div>

<div class="onay">
Blog Hocam Onay Mesaj Kutusu</div>

<div class="yasak">
Blog Hocam Yasak Mesaj Kutusu</div>

 

Bu örneklerden yola çıkarak farklı CSS kodları kullanabilir ve kendi özel mesaj kutularını oluşturabilirsiniz.

Daha iyi bir Google tecrübesi Yaşayabilmek. Google+ Yeni Arayüzünü Keşfe Çıkın..

170 milyondan fazla insan Google+ kullanmaya başlayarak Arama, Gmail ve birçok diğer ürünümüzü yeni bir platform üzerinden deneyimlemeye başladılar. Google+’da henüz işin başındayız ve yapılacak daha çok şey var. Ancak, Google’ın tüm ürünlerinin entegre olduğu bir platform üzerinden, kullanıcılarımıza kusursuz bir sosyal web tecrübesi yaşatma hedefimizle ilgili her zamankinden daha fazla heyecanlıyız.

Bu sosyal platformun tasarım sürecinin temelinde düşlerimizi gerçeğe dönüştürmek yatıyor. Bu amaç doğrultusunda bugün Google+’ın daha işlevsel yeni ara yüzünü sizlerle paylaşıyoruz . Google+’ın yeni ara yüzünün kullanımının sizin için daha kolay olacağını, burada vakit geçirmekten daha fazla keyif alacağınızı düşünüyoruz. Ancak herşeyden önemlisi, bu, bizim daha basit ve daha iyi bir Google tecrübesi yaşatma çabalarımızı hızla gerçek kılma hedefimizin bir ürünü.



Dilediğiniz gibi keşfe çıkın!

Google+’da ilk dikkatinizi çekecek yeni unsurlardan bir tanesi artık sayfanızdaki akışı daha yakından takip edebilecek olmanız. Üstteki sabit simgelerin yerini sol tarafta dinamik bir uygulamalar bandı aldı. Bu yeniliğin bir çok avantajı var ancak bizim favorilerimiz şunlar:

● İstediğiniz sırayı oluşturmak için uygulamaların aşağı ya da yukarı sürüklenebilmesi
● Farenizle birtakım uygulamaların üzerine gittiğinizde yapabileceklerinizi gösteren küçük pencerelerin açılması
● Uygulamaları diğer simgesinin ikonunun içine veya dışına taşıyarak gösterebilme ve gizleyebilme

Bu yenilikler favorilerinize ulaşmanızı ve zaman içerisinde tercihlerinizi yeniden düzenlemenizi kolaylaştırmak üzere tasarlandı. Sayfanın sağında kalan boş alanı da ileride eklemeyi planladığımız yeni özellikler için ayırdık. Bizi izlemeye devam edin.




Düzenli Takip Ettiğiniz Sohbetler

Google+ kullanmaya başladığınız andan itibaren, nerede olurlarsa olsunlar çevrenizdeki kişiler ile paylaşımda bulunmanız çok kolay. Ancak biz daha da büyük düşünüyoruz. Amacımız size, faydayı ve güzelliği bir araya getiren –başkaları ile iletişim kurmak ve sohbeti keyifli hale getirmek için ilham veren bir deneyim yaşatabilmek. Google+’ın yeni arayüzü bu hedefi gerçek kılmak için önemli bir adım ve aşağıdakileri içeriyor:

● Paylaşmaktan keyif alacağınız fotoğraflar ve videolar
● Sohbet katılmanızı kolaylaştıracak ‘’sohbet “kartları” akışı
● İlgilendiğiniz konulardan haberdar olacağınız bir ilan panosu




Kısaca, paylaşımı kusursuz bir hale getirmeyi hedefliyoruz. Bir sanat eseri nefesinizi kestiğinde veya bir arkadaşınız size sürpriz bir hediye aldığındaki duyguyu bilirsiniz. Google+’daki paylaşımlarınızın her seferinde böyle bir duygu yaratmasını arzu ediyoruz.


Video ile Sohbet için Yeni Bir Adres

‘Google+ Videoyla Sohbet’ te (Hangout) insanların görüntülü iletişim kurmalarını sağlıyoruz. Bu kimi zaman duygusal bir paylaşım olurken, bazen de yaşanılan bir maceranın ya da yeni bir şarkının heyecanını paylaşmak olabiliyor. Google+’ın yeni tasarımına, insanların birbirleri ile daha etkin iletişim kurmalarını sağlayacak ‘Videoyla Sohbet’ sayfasını ekliyoruz. Yeni ‘Videoyla Sohbet’ özelliğinde şunlar yer alıyor:

● Çevrenizdeki insanlardan gelen ve sürekli yenilenen bir davet listesi.
● Yeni biriyle tanışmak veya canlı yayınlanan bir yapım izlemek istediğinizde her türlü genel ve canlı yayınlanan video sohbete hızlı erişim
● Popüler videoyla sohbetleri takip etmenizi sağlayacak bir ilan panosu yer alıyor.



Dünyanın her yerinde katılabileceğiniz video sohbetleri belirleyerek, birlikte zaman geçirmek – ve hatta birbirinin yanında olmak– kolaylaşıyor. Hangout apps gibi çalışmalarına devam ettiğimiz yeni özelliklerin eklenmesi ile birlikte gelecekte daha da etkin video sohbet imkanına sahip olunacak.


Bir noktadan diğerine gitmek

Google+’da yaptığımız güncelleme, navigasyon, akışın ve video ile sohbetlerin iyileştirilmesinin ötesine geçiyor. Örneğin, Google+’da artık yeni trendleri Explore(Keşif) sayfası yardımı ile yakından takip edebileceksiniz. Ayrıca tercihinize göre daha büyük fotoğraflarınız ile profil oluşturabilecek, sohbet listenizi dilediğiniz gibi düzenleyebileceksiniz.

İlerleyen günlerde Google+’da tüm bu yenilikleri gözlemleyebileceksiniz.



Size, sevdiğiniz insanlara ve ilgilendiğiniz konulara odaklanarak, -Arama’dan, Haritalar’a ve Gmail’e - halihazırda bildiğiniz ve sevdiğiniz tüm ürünlerimizi iyileştirmeye devam edeceğiz. Bugünün değişimleri ile, daha basit ve daha güzel bir Google tecrübesi yaşatma hedefimize hızlı adımlar ile ilerliyoruz.

Vic Gundotra, Kıdemli Başkan Yardımcısı

Blogger İçin Pinterest Widget

Genel manasıyla sosyalleştrilmiş bir çevrimiçi pano diyebileceğimiz Pinterst, 2012 ile birlikte tüm dünyada olduğu gibi ülkemizde de hızla yaygınlaşarak sosyal medyanın yeni fenomeni olma yolunda ilerlemeye devam ediyor.

 

Blog yazarları ( özellikle bayanlar ), Pinterest’e çabuk ayak uydurmuşlar gibi gözüküyor.Oluşturdukları panolarda kendi bloglarında ki ve internette dolaşırken beğendikleri görsel öğeleri takipçileriyle paylaşıyorlar.

 

 

Pinterst bu kadar yaygınlaşmışken hala bir kod yazarının Blogger için Pinterest widget’ı geliştirmiş olmamasına şaşırmışken Marie Mosley ile karşılaştım.Kendisi Blogger için güzel bir Pinterst widget’ı kodlamış.Bu widget ile Pinterest sayfanızda paylaştığınız öğeleri blogunuzun sidear’ında gösterebiliyorsunuz.

 

Bu widget’ı blogunuza eklemek için aşağıdaki kodları HTML/JavaScript gadget penceresine yapıştırın.

 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
/**
* Plugin: jquery.zRSSFeed
*
* Version: 1.0.1
* (c) Copyright 2010, Zazar Ltd
*
* Description: jQuery plugin for display of RSS feeds via Google Feed API
*              (Based on original plugin jGFeed by jQuery HowTo)
*
* Modified by Richard Mackney (originally for Instagram images, see https://gist.github.com/865838)
* Modified further by Marie Mosley for a Pinterest "gadget" for Blogger.
* Tutorial for use with Blogspot at: http://www.codeitpretty.com/2012/03/pinterest-gadget-for-blogger.html
**/

(function($){

    var current = null;

    $.fn.rssfeed = function(url, options) {   

        // Set plugin defaults
        var defaults = {
            limit: 6,
            titletag: 'h4',
            content: true,
            snippet: true,
            showerror: true,
            errormsg: '',
            key: null
        }; 
        var options = $.extend(defaults, options);

        // Functions
        return this.each(function(i, e) {
            var $e = $(e);

            // Add feed class to user div
            if (!$e.hasClass('rssFeed')) $e.addClass('rssFeed');

            // Check for valid url
            if(url == null) return false;

            // Create Google Feed API address
            var api = "http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&callback=?&q=" + url;
            if (options.limit != null) api += "&num=" + options.limit;
            if (options.key != null) api += "&key=" + options.key;

            // Send request
            $.getJSON(api, function(data){

                // Check for error
                if (data.responseStatus == 200) {

                    // Process the feeds
                    _callback(e, data.responseData.feed, options);
                } else {

                    // Handle error if required
                    if (options.showerror)
                        if (options.errormsg != '') {
                            var msg = options.errormsg;
                        } else {
                            var msg = data.responseDetails;
                        };
                        $(e).html('<div class="rssError"><p>'+ msg +'</p></div>');
                };
            });               
        });
    };

    // Callback function to create HTML result
    var _callback = function(e, feeds, options) {
        if (!feeds) {
            return false;
        }
        var html = '';   
        var row = 'odd';   

 

        // Add body
        html += '<div class="rssBody">' +
            '<ul>';

        // Add feeds
        for (var i=0; i<feeds.entries.length; i++) {

            // Get individual feed
            var entry = feeds.entries[i];

            // Add feed row
            html += '<li class="rssRow '+row+'">' +
                '<'+ options.titletag +'><a href="'+ entry.link +'" title="View this feed at '+ feeds.title +'">'+ entry.title +'</a></'+ options.titletag +'>'
            if (options.date) html += '<div>'+ pubDate +'</div>'
            if (options.content) {

                // Use feed snippet if available and optioned
                if (options.snippet && entry.contentSnippet != '') {
                    var content = entry.contentSnippet;
                } else {
                    var content = entry.content;
                }

                html += '<p><a href="'+entry.link+'" title="'+ entry.title +' " target="_blank">'+ content +'</a></p>'
            }

            html += '</li>';

            // Alternate row classes
            if (row == 'odd') {
                row = 'even';
            } else {
                row = 'odd';
            }           
        }

        html += '</ul>' +
            '</div>'

        $(e).html(html);

        //correct href for images so they point to Pinterest
            $(function() {
              $('.rssFeed a').each(function() {
                var href = $(this).attr('href');
                $(this).attr('href', 'http://www.pinterest.com' + href);
  });
});

          
    };
})(jQuery);

</script>

<style type="text/css">
body {
    margin: 0px;
}

.rssFeed a {
    color: #444;
    text-decoration: none;
        text-display: none;
}
.rssBody ul {
    list-style: none;
}
.rssBody ul, .rssRow, .rssRow h4, .rssRow p {
    margin: 0;
    padding: 0;
}

.rssBody li {
        position: relative;
        color: transparent;
        width: 100px;
        height: 100px;
        overflow: hidden;
    padding: 6px;
    float: left;
        z-index: 1;
}

/* This part of the style shows the full photo when the thumbnail is hovered. If you'd prefer not to use this, remove .rssBody li:hover, its curly braces, and everything inside its curly braces. This was designed for a left sidebar on Blogger. For a right sidebar, play with the translate numbers until the enlarged photo moves the way you want it to. */

.rssBody li:hover {
font-size: 1px;
overflow: visible;
z-index: 1000;
-ms-transform: translate(-60px,-10px);
-webkit-transform: translate(-60px,-10px);
-o-transform: translate(-60px,-10px);
-moz-transform: translate(-60px,-10px);
transform: translate(-60px, -10px);
}

/* end hover image effect */

.rssRow {
    padding: 3px;
}
.rssRow h4 {
    display: none;
}
.rssRow div {
    color: #666;
    margin: 0.2em 0 0.4em 0;
}

</style>

<script type="text/javascript">

/** use your own Pinterest username in the rssfeed url. To display your latest photos from all boards, use http://www.pinterest.com/USER-NAME-HERE/feed.rss  to show a specific board, use http://www.pinterest.com/USER-NAME-HERE/BOARD-NAME-HERE/rss **/

$(document).ready(function () {
    $('#pinterest').rssfeed('http://www.pinterest.com/Kullanıcı_Adı/feed.rss', {
        limit: 6,
        snippet: false,
        header: false,
        date: false
    });
});

</script>
<!-- Optional logo and gadget title. To use, uncomment it and add in your own Pinterest url, then place your own image link in the quotation marks after img src. -->

<!-- <a href=""><img src=""><br />Latest Pins</a>
-->
<div id="pinterest"></div>

 

Kodlarda değiştirmeniz gereken tek yerkırmızı renkle yazdığım Kullanıcı_Adı.Buraya Pinterest kullanıcı adınızı yazın.Eğer belli bir panodaki resimleri göstermek istiyorsanız buayı şe şekilde değiştirin: Kullanıcı_Adı/Pano_Adı

Sadece Blogculara Özel Sözlük: Weblog!

Merhabalar, interaktif sözlükleri bilmeyen yoktur diye düşünüyorum, (Mesela; Ekşi Sözlük) o yüzden direk konuya girmek istiyorum. Ne hakkında mı bahsedeceğim?
Weblog Sözlük'ten..

Bildiğiniz üzere sözlükspot alt yapısı kullanılarak sözlük açılabiliyor. Her alanda her konuda sözlük açmak mümkün, tematik sözlük fikride buradan çıkıyor zaten. Ben de yararlı bulduğum bir fikrimi hayata geçirerek sadece blogculara özel bir sözlük kurdum. Şuan için çok güzel tepkiler alıyorum, üye sayımızda git gide katlanıyor. Ama buna rağmen sözlüğün tutup tutmaması önemli olmamakla birlikte, siz değerli blogcuların keyfine ve zevkine kalmış bir durumdur.

Her şey bir yana, blogcuların tanışıp, kaynaşıp, paylaşıp ve eğlenebildiği bir platformu bir sözlük olarak düşünmek bence harika bir fikir.

Peki Weblog Sözlük ne kazandırır?

• Blogunuzu özgürce çok daha fazla başka blogcuya tanıtma fırsatı bulabilirsiniz.
• Hem kendiniz hem de blogunuz için yararlı bilgilere ulaşabilirsiniz.
• Kendi ilgi alanınızda ya da yakın kişilerle tanışıp, fikirlerini görebilirsiniz.
• Samimi bir ortamda, blog ailesi kıvamında, hem kendinizi hem de blogunuzu temsil edip aynı zamanda eğlenebilirsiniz.
• Sizin seçeceğiniz bir rumuz ile kayıt olup, özgürce bir sözlükte yazabilmenin keyfini yaşayabilirsiniz.
• Ve belki bir gün, sözlüğümüz hep birlikte iyi yerlere geldiğinde, köklü bir oluşumun temel taşlarından olmanın ve  1. nesillerinden olmanın verdiği haklı gururu yaşayabilirsiniz.
• Bu saydıklarımda dahil bir çok iyi şeye daha şahit ve dahil olacağınızı garanti ederim.

Sözlük nedir, nasıl yazılır, ne işe yarar gibi kaygılarınız varsa derhal bu düşünceleri terkedin, tek yapmanız gereken sözlüğe üye olup yazmaya başlamak. Akabinde olacakların ve yaşanacakların sadece tadını çıkarın.

 

Weblog Sözlük - Blogların Gücü Adına! 

Yazar Hakkında: Bu yazı, Weblog Sözlük kurucusu ve yazarı Yoge Griffin tarafından Blog Hocam için yazılmıştır.

Flash Animasyonlu Etiket Bulutu

Blogger’da klasik etiketler widgetından sıkıldıysanız daha farklı, daha orijinal bir alternatif ister misiniz?

 

 

Harish isimli arkadaş flash animasyonlu bir etiket bulutu scripti yazmış.Blog yazılarınızda kullandığınız etiketleri flash animasyonlu bir bulut olarak sidebarınıza ekleyebiliyorsunuz.Nasıl çalıştığını görmek için aşağıdaki videoyu izleyebilirsiniz.

 

 

Bu flash animasyonlu etiket bulutunu blogunuza eklemek için aşağıdaki kodları HTML/JavaScript gadget olarak eklemeniz yeterli.

 

<script type="text/javascript">
/*<![CDATA[*/
var w2bFlashLabelSettings = {
    blogurl        : "http://bloghocam.blogspot.com/",
    color          : "000000",
    hoverColor     : "0bb839",
    backgroundColor: "FFFFFF",
    size           : 12,
    speed          : 100,
    width          : 250,
    height         : 300
};
/*]]>*/
</script>
<script type="text/javascript" src="http://yourjavascript.com/49442413251/bloghocam-flash-etiket-bulutu.js"></script>

 

• http://bloghocam.blogspot.com/ yerine kendi blogu adresinizi yazmayı unutmayın.

Blogger’dan +1 Düğmesi ve Google+ Rozeti Gadgetları

Bugün test blogmda bir eklenti denerken HTML/JavaScript gadget’ı eklemek için gadget listesini açtığımda Blogger’ın listeye 2 yeni gadget eklediğini farkettim.Neler mi?

 

+1 Düğmesi

 

 

Ziyaretçilerin, içeriğinizi Google Arama'da önermesine ve Google+'da paylaşmasına izin vermelerini sağlayan buton.

 

Google+ Rozeti

 

 

Ziyaretçilerinizin Google+ profilinize veya blogunuz için oluşturduğunuz Google+ sayfanıza ulaşarak sizi çevrelerine eklemelerini sağlayan rozet.

 

Bunlar yeni özellikler değil ama çoğu blogcu bu butonları bloguna elerken kodlarda yaptığı hatalar nedeniyle sıkıntı yaşayabiliyordu.Bu ayede herkes +1 düğmesini ve Google+ rozetini zahmetsizcer bloguna ekleyebilecek.