19 Mayıs 2015 Salı

Blogger Üsteki Yorumu Cevapla Eklentisi




              Blogger adresinizi sıradan bir şekilde bırakmayın. Çünkü, Blogger üzerinde yer alan özellikler ve kodları kullanmak, Wordpres'den daha iyi hale gelmesini sağlar.

            Blogger Üsteki Yorumu Cevapla Eklentisi yaparak, kullanıcıların ve ziyaretçilerin kendi aralarında yorum yoluyla konuşmalarını sağlayabilirsiniz. Böyle yaparak, Sitenizin hiti artar ve insanlar sizin Blogunuz da gezerken gerçekten keyif alır.

         Aşağıdaki Kodu " Widget Şablonu Genişlet" seçeneklerini kullanarak, doğru bir şekilde kodu kullanın.

                     <data:commentPostedByMsg/>
Daha sonra, aşağıdaki kodları yukarıdaki koddan sonra ekliyoruz;
<span><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=Blogunuzun-ID-Numara

18 Mayıs 2015 Pazartesi

Blogger İçin Google Tipi Arama Kutusu Ekleme



                     Blogger Adresinizde ziyaretçilerin dikkat çekmesi için gerekli ayarları yapmak, gerekli düzenlemelerle beraber direkt olarak aktarım yapmak zorundasınız. İnsanların içerikleri düzgün okuması ve açık bir şekilde aradıklarını rahat bulmak gerekmektedir.

                         Blogger Google Tipi Arama Kutusu Eklemek için aşağıda vereceğim kodu gerekli alanlara yapıştırmanız gerekiyor.tek yapmanız gereken HTML-JAVASCRİPT bölümüne gelerek, gereken kodları aratıp bulun ve sonrasında eklemeleri yapın.

                   
/* div container containing the form */
#searchContainer {
margin:20px;
}
/* Style the search input field. */
#field {
float:left;
width:200px;
height:27px;
line-height:27px;
text-indent:10px;
font-family:arial, sans-serif;
font-size:1em;
color:#333;
background: #fff;
border:solid 1px #d9d9d9;
border-top:solid 1px #c0c0c0;
border-right:none;
}
/* Style the "X" text button next to the search input field */
#delete {
float:left;
width:16px;
height:29px;
line-height:27px;
margin-right:15px;
padding:0 10px 0 10px;
font-family: "Lucida Sans", "Lucida Sans Unicode",sans-serif;
font-size:22px;
background: #fff;
border:solid 1px #d9d9d9;
border-top:solid 1px #c0c0c0;
border-left:none;
}
/* Set default state of "X" and hide it */
#delete #x {
color:#A1B9ED;
cursor:pointer;
display:none;
}
/* Set the hover state of "X" */
#delete #x:hover {
color:#36c;
}
/* Syle the search button. Settings of line-height, font-size, text-indent used to hide submit value in IE */
#submit {
cursor:pointer;
width:70px;
height: 31px;
line-height:0;
font-size:0;
text-indent:-999px;
color: transparent;
background: url(http://4.bp.blogspot.com/-GX7E4j3jwR0/ThMXKjuQ9VI/AAAAAAAAEsE/rJE5Ip1qDEg/s1600/ico-search.png) no-repeat #4d90fe center;
border: 1px solid #3079ED;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
}
/* Style the search button hover state */
#submit:hover {
background: url(http://4.bp.blogspot.com/-GX7E4j3jwR0/ThMXKjuQ9VI/AAAAAAAAEsE/rJE5Ip1qDEg/s1600/ico-search.png) no-repeat center #357AE8;
border: 1px solid #2F5BB7;
}
/* Clear floats */
.fclear {clear:both}
/*End Google Style Search Bar - Info @ http://www.spiceupyourblog.com*/
Daha sonra, aşağıdaki kodu bulalım..
</head>
Ve aşağıdaki kodları, yukarıdaki koddan önce ekliyoruz..
<script src='http://code.jquery.com/jquery-1.6.1.min.js' type='text/javascript'/>
<script type='text/javascript'>
$().ready(function() {
// if text input field value is not empty show the &quot;X&quot; button
$(&quot;#field&quot;).keyup(function() {
$(&quot;#x&quot;).fadeIn();
if ($.trim($(&quot;#field&quot;).val()) == &quot;&quot;) {
$(&quot;#x&quot;).fadeOut();
}
});
// on click of &quot;X&quot;, delete input field value and hide &quot;X&quot;
$(&quot;#x&quot;).click(function() {
$(&quot;#field&quot;).val(&quot;&quot;);
$(this).hide();
});
});
</script>
Son olarak ise; Tasarım > Sayfa Öğeleri > Gadget Ekle bölümünden HTML/JavaScript Ekle seçeneğine tıklayarak aşağıdaki kodları ekliyoruz..
<div id="searchContainer">
<form name="SUYB" action="/search" method="get">
<input type="text" id="field" id="s" name="q"/>
<div id="delete"><span id="x">x</span></div>
<input type="submit" name="submit" id="submit" value="Search" />
</form>
</div>