Sitene Blogger için son yazılar kodu ekle. Daha önce "Sitene renkli son yazılar kodu eklentisi" ile bir kod paylaşmıştık, bu kodumuzda değişik ve güzel bir son yazılar kodu eklentisi.

Nasıl eklenir?

<script type="text/javascript">
var posts_no = 10;var posts_date = true;var post_summary = true;var summary_chars = 80;</script>

<div class="recentpoststyle">
<script type="text/javascript">
function showlatestposts(e){for(var t=0;t<posts_no;t++){var r,s=e.feed.entry[t],n=s.title.$t;if(t==e.feed.entry.length)break;for(var a=0;a<s.link.length;a++)if("alternate"==s.link[a].rel){r=s.link[a].href;break}n=n.link(r);var i="... read more";i=i.link(r);var l=s.published.$t,o=l.substring(0,4),u=l.substring(5,7),c=l.substring(8,10),m=new Array;if(m[1]="Jan",m[2]="Feb",m[3]="Mar",m[4]="Apr",m[5]="May",m[6]="Jun",m[7]="Jul",m[8]="Aug",m[9]="Sep",m[10]="Oct",m[11]="Nov",m[12]="Dec","content"in s)var d=s.content.$t;else if("summary"in s)var d=s.summary.$t;else var d="";var v=/<\S[^>]*>/g;if(d=d.replace(v,""),document.write('<li class="recent-post-title">'),document.write(n),document.write('</li><div class="recent-post-summ">'),1==post_summary)if(d.length<summary_chars)document.write(d);else{d=d.substring(0,summary_chars);var f=d.lastIndexOf(" ");d=d.substring(0,f),document.write(d+" "+i)}document.write("</div>"),1==posts_date&&document.write('<div class="post-date">'+m[parseInt(u,10)]+" "+c+" "+o+"</div>")}}
</script>
<script type="text/javascript">
var posts_no = 10;var posts_date = true;var post_summary = true;var summary_chars = 80;</script>
<script src="/feeds/posts/default?orderby=published&amp;alt=json-in-script&amp;callback=showlatestposts">
</script><a style="font-size: 9px; color: #CECECE;margin-top:10px;" href="http://helplogger.blogspot.com/2014/11/5-cool-recent-post-widgets-for-blogger.html" rel="nofollow">Recent Posts Widget</a>
<noscript>Your browser does not support JavaScript!</noscript>
<style type="text/css">
.recentpoststyle {counter-reset: countposts;list-style-type: none;}
.recentpoststyle a {text-decoration: none;color: #49A8D1;}
.recentpoststyle a:hover {color: #000;}
.recentpoststyle li:before {content: counter(countposts,decimal);counter-increment: countposts;float: left;z-index: 1;position:relative;font-size: 15px;font-weight: bold;color:#fff;background:#69B7E2; margin:13px 5px 0px -6px;line-height:30px;width:30px;height:30px;text-align:center;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;}li.recent-post-title{margin-bottom: 5px;padding: 0;}
.recent-post-title a {color: #444;text-decoration: none;font: bold 13px "Avant Garde",Avantgarde,"Century Gothic",CenturyGothic,AppleGothic,sans-serif;}
.post-date {font-size: 11px;color: #999;margin:5px 0px 15px 32px;}
.recent-post-summ {border-left:1px solid #69B7E2; color: #777; padding: 0px 5px 0px 20px; margin-left: 10px; font: 15px Garamond,Baskerville,"Baskerville Old Face","Hoefler Text","Times New Roman",serif;}
</style></div>

Sitene Blogger için abone ol kutusu ekle. Sitene güzel ve şık bir abone ol kutusu eklemeyi
düşünüyorsanız bu kodlar tam sizin için; hem kolay ekleme bakımından, hem de sade bir görünümde olması, bloğunuzla uyum içinde çalışır.

Blogger'a eklemek için;

Yerleşim - Gadget ekle - HTML/JavaScript - Kaydet deyip işlemi tamamlıyoruz...

<div style="text-align:center">
<form onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=MPT-Network', 'popupwindow', 'scrollbars=yes,width=600,height=520');" id="mpt-sub">
<h1>
SUBSCRIBE TODAY</h1>
<div id="mpt-img">
<img src="http://png.findicons.com/files/icons/2198/dark_glass/128/mail_appt.png" alt="email-subscribe" height="48" width="48" /> <p>
Sign up and receive our free Newsletter </p>
</div>
<input type="hidden" value="mypremiumtricks" name="uri" />
<input type="email" name="email" class="login-input" placeholder="Email Address" autofocus="autofocus" autocomplete="off" />
<input type="hidden" name="loc" value="en_IN" />
<input type="submit" value="Subscribe" class="login-submit" />
</form>
</div>
<style>
#mpt-sub h1{
font-family:mptfont1 !important;
text-shadow:-1.05px 0.58px 0.3px rgb(193, 193, 193), -2.10px 1.16px 0.3px rgb(181, 181, 181), -3.15px 1.75px 0.3px rgb(169, 169, 169), -4.20px 2.33px 0.3px rgb(156, 156, 156), -5.25px 2.91px 0.3px rgb(142, 142, 142), -6.30px 3.49px 0.3px rgb(128, 128, 128), -5.25px 2.91px 2px rgba(0, 0, 0, 0.3), -10.50px 5.82px 4px rgba(0, 0, 0, 0.3), -15.74px 8.73px 6px rgba(0, 0, 0, 0.3), -20.99px 11.64px 8px rgba(0, 0, 0, 0.3) !important;
color:white !important;
font-size:29px !important;
}
#mpt-img img{
float:left !important;
}
#mpt-sub{
width:300px !important;
-webkit-border-radius:0px !important;
-moz-border-radius:0px !important;
border-radius:0px !important;
padding:12px 16px !important;
background:-webkit-radial-gradient(rgb(112, 94, 240), rgb(60, 64, 175), rgb(67, 72, 202)) !important;
background:-moz-radial-gradient(rgb(112, 94, 240), rgb(60, 64, 175), rgb(67, 72, 202)) !important;
background:-o-radial-gradient(rgb(112, 94, 240), rgb(60, 64, 175), rgb(67, 72, 202)) !important;
background:-ms-radial-gradient(rgb(112, 94, 240), rgb(60, 64, 175), rgb(67, 72, 202)) !important;
background: radial-gradient(rgb(112, 94, 240), rgb(60, 64, 175), rgb(67, 72, 202)) !important;
-webkit-box-shadow:5px 4px 0 -1px rgba(56, 44, 197, 0.4), 8px 7px 0 1px rgba(85, 63, 199, 0.3), 12px 12px 0 1px rgba(49, 62, 219, 0.2) !important;
-moz-box-shadow:5px 4px 0 -1px rgba(56, 44, 197, 0.4), 8px 7px 0 1px rgba(85, 63, 199, 0.3), 12px 12px 0 1px rgba(49, 62, 219, 0.2) !important;
box-shadow:5px 4px 0 -1px rgba(56, 44, 197, 0.4), 8px 7px 0 1px rgba(85, 63, 199, 0.3), 12px 12px 0 1px rgba(49, 62, 219, 0.2) !important;
-webkit-transition:0.5s linear !important;
-moz-transition:0.5s linear !important;
-o-transition:0.5s linear !important;
transition:0.5s linear !important;
}
#mpt-sub:hover{
-webkit-box-shadow:5px 4px 0 -1px rgba(56, 44, 197, 0.4), 8px 7px 0 1px rgba(85, 63, 199, 0.3), 12px 12px 0 1px rgba(49, 62, 219, 0.2), inset 0px 0px 31px rgb(17, 15, 24) !important;
-moz-box-shadow:5px 4px 0 -1px rgba(56, 44, 197, 0.4), 8px 7px 0 1px rgba(85, 63, 199, 0.3), 12px 12px 0 1px rgba(49, 62, 219, 0.2), inset 0px 0px 31px rgb(17, 15, 24) !important;
box-shadow:5px 4px 0 -1px rgba(56, 44, 197, 0.4), 8px 7px 0 1px rgba(85, 63, 199, 0.3), 12px 12px 0 1px rgba(49, 62, 219, 0.2), inset 0px 0px 31px rgb(17, 15, 24) !important;
}
#mpt-sub *{
outline:0 !important;
}
#mpt-img{
padding:1em 0 !important;
height:3em !important;
}
#mpt-img p{
font-family:monospace !important;
color:white !important;
float:right !important;
top:10px !important;
position:relative !important;
width:19em !important;
}
:-moz-placeholder{
color:#bcc0c8 !important !important;
}
::-webkit-input-placeholder{
color:#bcc0c8 !important;
}
:-ms-input-placeholder{
color:#bcc0c8 !important !important;
}
.login-input{
display:block !important;
width:16em !important;
height:37px !important;
margin:8px auto !important;
text-align:center !important;
padding:0 9px !important;
color:white !important;
text-shadow:0 1px black !important;
background:#443837 !important;
border:1px solid #15243b !important;
border-top-color:#0d1827 !important;
-webkit-border-radius:4px !important;
-moz-border-radius:4px !important;
border-radius:4px !important;
background-image:-webkit-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)) !important;
background-image:-moz-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)) !important;
background-image:-o-linear-gradient(top, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)) !important;
background-image:linear-gradient(to bottom, rgba(0, 0, 0, 0.35), rgba(0, 0, 0, 0.2) 20%, rgba(0, 0, 0, 0)) !important;
-webkit-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.2) !important;
-moz-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.2) !important;
box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.2) !important;
}
.login-input:focus{
background-color:#32486d !important;
-webkit-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 0 4px 1px rgba(255, 255, 255, 0.6) !important;
-moz-box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 0 4px 1px rgba(255, 255, 255, 0.6) !important;
box-shadow:inset 0 1px 2px rgba(0, 0, 0, 0.3), 0 0 4px 1px rgba(255, 255, 255, 0.6) !important;
}
.login-submit{
display:block !important;
width:100% !important;
height:37px !important;
margin-bottom:15px !important;
font-size:14px !important;
line-height:10px !important;
font-weight:bold !important;
color:#294779 !important;
text-align:center !important;
text-shadow:0 1px rgba(255, 255, 255, 0.3) !important;
background:#adcbfa !important;
-webkit-background-clip:padding-box !important;
-moz-background-clip:/*@@prefixmycss->No equivalent*/ !important;
background-clip:padding-box !important;
/*@@prefixmycss->No equivalent*/
:!important;
border:1px solid #284473 !important;
border-bottom-color:#223b66 !important;
-webkit-border-radius:4px !important;
-moz-border-radius:4px !important;
border-radius:4px !important;
cursor:pointer !important;
background-image:-webkit-linear-gradient(top, #d0e1fe, #96b8ed) !important;
background-image:-moz-linear-gradient(top, #d0e1fe, #96b8ed) !important;
background-image:-o-linear-gradient(top, #d0e1fe, #96b8ed) !important;
background-image:linear-gradient(to bottom, #d0e1fe, #96b8ed) !important;
-webkit-box-shadow:inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15) !important;
-moz-box-shadow:inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15) !important;
box-shadow:inset 0 1px rgba(255, 255, 255, 0.5), inset 0 0 7px rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.15) !important;
}
.login-submit:active{
background:#a4c2f3 !important;
-webkit-box-shadow:inset 0 1px 5px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.1) !important;
-moz-box-shadow:inset 0 1px 5px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.1) !important;
box-shadow:inset 0 1px 5px rgba(0, 0, 0, 0.4), 0 1px rgba(255, 255, 255, 0.1) !important;
}
</style>

Sitene 3D Menü çubuğu ekle. Kullanımı kolay, istediğiniz yere ekleyebileceğiniz şık bir menü bar.

Sitenizin üst kısmında ki bir gadgete ekleyerek kullanabilirsiniz. Kodun içindeki link kodlarını, kendi menü link, kodlarnı ekleyin.

<style type="text/css">
.menuHolder {margin:25px 0 100px 0; text-align:center; position:relative; height:40px; z-index:20; background:#069;
background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0));
background-image: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
background-image: -o-linear-gradient(-90deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
background-image: linear-gradient(-90deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
border-radius:8px;
box-shadow:0 15px 10px -8px rgba(0,0,0,0.4);
-moz-perspective: 100px;
-webkit-perspective: 100px;
-o-perspective: 100px;
perspective: 100px;
}
.menuHolder ul.nav li {display:inline-block; display:inline;}
.menuHolder ul.nav {padding:0; margin:0; list-style:none; display:inline-block;
-moz-transform-style: preserve-3d;
-webkit-transform-style: preserve-3d;
-o-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.menuHolder ul.nav li {float:left; display:block; padding:0 4px;}
.menuHolder ul.nav > li {-moz-transform-style: preserve-3d;-webkit-transform-style: preserve-3d;}
.menuHolder ul.nav li a.top-a {display:block; text-decoration:none; margin-top:4px; float:left; height:36px;}
.menuHolder ul.nav li a.top-a b {display:block; padding:0 20px; font:normal 14px/30px arial, sans-serif; color:#fff;}
.menuHolder ul.nav li:hover a.top-a {background:#09c; border-radius:8px 8px 0 0;
-moz-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4);
-webkit-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4);
-o-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4);
box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4);
}
.menuHolder ul.nav div {position:absolute; top:40px; left:4px; background:#09c; padding:5px 0 10px 0;
border-radius:0 0 15px 15px;
box-shadow:0 15px 10px -8px rgba(0,0,0,0.4);
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
-o-transition: 0.5s;
transition: 0.5s;
-moz-transform-origin: 0px 0px;
-moz-transform: rotateX(-90deg);
-webkit-transform-origin: 0px 0px;
-webkit-transform: rotateX(-90deg);
-o-transform-origin: 0px 0px;
-o-transform: rotateX(-90deg);
transform-origin: 0px 0px;
transform: rotateX(-90deg);
-moz-backface-visibility: hidden;
-webkit-backface-visibility: hidden;
-o-backface-visibility: hidden;
backface-visibility: hidden;
}
.menuHolder ul.nav div.left {left:auto; right:4px;}
.menuHolder ul.nav div ul {padding:10px 0; list-style:none; width:140px; margin:10px 5px 0 5px; float:left; display:inline; text-align:left; background:#fff; border-radius:6px;
-moz-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4);
-webkit-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4);
-o-box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4);
box-shadow:inset 0px 3px 3px rgba(0, 0, 0, 0.4);
}
.menuHolder ul.nav div ul.colLeft {margin-left:10px;}
.menuHolder ul.nav div ul.colRight {margin-right:10px;}
.menuHolder ul.nav div ul.colSingle {margin-left:10px; margin-right:10px;}
.menuHolder ul.nav div ul li {float:left; border-bottom:1px dotted #09c; margin:0 5px 0 5px; display:inline;}
.menuHolder ul.nav div ul li:last-child {border:0;}
.menuHolder ul.nav div ul li a {display:block; width:105px; text-decoration:none; font:13px/16px arial, sans-serif; color:#069; margin:0; padding:4px 0 4px 15px; background:transparent url(droplistcolumns/arrow.gif) no-repeat left center;}
.menuHolder ul.nav div ul li a:hover {color:#09c; background:transparent url(droplistcolumns/arrow.gif) no-repeat 1px center;}
.menuHolder ul.nav div.col1 {width:160px;}
.menuHolder ul.nav div.col2 {width:310px;}
.menuHolder ul.nav div.col3 {width:460px;}
.menuHolder ul.nav li:hover div {
-moz-transform: rotateX(0deg);
-webkit-transform: rotateX(0deg);
-o-transform: rotateX(0deg);
transform: rotateX(0deg);
}
</style>
<div id="info">
<div class="menuHolder">
<ul class="nav">
<li><a class="top-a" href="#url"><b>Home</b></a></li>
<li><a class="top-a" href="#url"><b>Blogger</b></a>
<div class="col3">
<ul class="colLeft">
<li><a href="#url">blogger widget</a></li>
<li><a href="#url">blogger design</a></li>
<li><a href="#url">blogger tips</a></li>
<li><a href="#url">blogger seo</a></li>
<li><a href="#url">blogger templates</a></li>
</ul>
<ul class="col">
<li><a href="#url">Related post</a></li>
<li><a href="#url">Popular post</a></li>
<li><a href="#url">Recent Post</a></li>
<li><a href="#url">Chat widget</a></li>
</ul>
<ul class="colRight">
<li><a href="#url">navigation menu</a></li>
<li><a href="#url">Side menu</a></li>
<li><a href="#url">Horizontal menu</a></li>
<li><a href="#url">Vertical menu</a></li>
</ul>
</div>
</li>
<li><a class="top-a" href="#url"><b>Website SEO </b></a>
<div class="col2">
<ul class="colLeft">
<li><a href="#url">Header</a></li>
<li><a href="#url">Footer</a></li>
<li><a href="#url">Post</a></li>
<li><a href="#url">Links</a></li>
<li><a href="#url">Menu</a></li>
</ul>
<ul class="colRight">
<li><a href="#url">Mobile </a></li>
<li><a href="#url">Mobile traffic</a></li>
<li><a href="#url">Mobile seo</a></li>
<li><a href="#url">small screen</a></li>
</ul>
</div>
</li>
<li><a class="top-a" href="#url"><b>Contact</b></a>
<div class="col1">
<ul class="colSingle">
<li><a href="#url">Email ID</a></li>
<li><a href="#url">Mobile No.</a></li>
<li><a href="#url">Contact Form</a></li>
<li><a href="#url">My email</a></li>
</ul>
</div>
</li>
<li><a class="top-a" href="#url"><b>Privacy</b></a></li>
<li><a class="top-a" href="#url"><b>Benefits</b></a>
<div class="col2 left">
<ul class="colLeft">
<li><a href="#url">Google traffic</a></li>
<li><a href="#url">Permanent Links</a></li>
<li><a href="#url">Alexa Rank</a></li>
<li><a href="#url">High page rank</a></li>
</ul>
<ul class="colRight">
<li><a href="#url">Snow Hotel</a></li>
<li><a href="#url">The Snowman</a></li>
<li><a href="#url">Ice Cavern</a></li>
<li><a href="#url">Ski Inn</a></li>
</ul>
</div>
</li>
</ul>
</div>
<br /><br /><br /><br /><br /><br /><br /><br />
</div>

Beğen butonu ekleme resimli anlatım. Bu linkten giriş yapalım.

• "Facebook Page URL" denilen kutuya, kendi Facebook linkinizi yapıştırın ve mausu bir kere sol tıklayın. 
• Sizin, Facebook sayfanız, bu sayfaya gelecektir. 
• Daha sonra en altta "Get code" kısmına tıklayarak, kodumuzu alalım. 
• Burada iki adet kod göreceksiniz, ikisini de kopyalayıp, sitenizde nerede gözükmesini istiyorsanız, orada ki, gadget kısmına yapıştırıp kullanabilirsiniz.
• Aşağıda da resimlerini görüyorsunuz. Burada ki sıralamadan da takip edip fikir sahibi olabilirsiz.

            

Sitene son dakika bandı ekle. Sitenize son dakika haber bandıyla, en son yazdığınız yazılarınızı okuyucularınıza duyurabilirsiniz. Maus üzerine gelince yazı duruyor, yazının hızını ayarlamak için kodun içinde kırmızı ile yazılmış olan değeri kendi isteğinize göre değiştirin.



Kodun içindeki mavi olan yazıları kendi yazınızla değiştirin ve bandın uzunluğunu kendi eklediğiniz yere uyumlu olsun diye, genişlik ve uzunluk değerini yeşille gösterilen rakamları değiştirip kullanabilirsiniz...

Sitene son dakika bandı ekle. Sitenize son dakika haber bandıyla,en son yazdığınız yazılarınızı okuyucularınıza duyurabilirsiniz. Maus üzerine gelince yazı duruyor, yazının hızını ayarlamak için kodun içinde kırmızı ile yazılmış olan değeri kendi isteğinize göre değiştirin. Kodun içindeki mavi olan yazıları kendi yazınızla değiştirip yayınlayın...

<div class="bannerekle.blogspot.com" style="background-color: #01b8c0; color: white; float: left; font-family: Verdana, Geneva, sans-serif; font-size: 11px; line-height: 23px; margin-right: 6px; padding: 0px 10px;">
Son Dakika</div>
<marquee height="33" loop="99999" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="3" scrolldelay="60" style="background-color: #01b8c0; height: 23px; width: 480px;" width="200">Sitene son dakika bandı ekle. Sitenize son dakika haber bandıyla,en son yazdığınız yazılarınızı okuyucularınıza duyurabilirsiniz. Maus üzerine gelince yazı duruyor, yazının hızını ayarlamak için kodun içinde kırmızı ile yazılmış olan değeri kendi isteğinize göre değiştirin. Kodun içindeki mavi olan yazıları kendi yazınızla değiştirip yayınlayın...</marquee>

Blogger özel tema arka plan resmi nasıl değişir? Blogger arka planı değiştirme konusunu kısaca anlatayım. Blogger'ın kendi standart şablonlarında arka planı değiştirmek kolaydır.

Ayarlar sayfasından Şablon - Özelleştir - Arka plan yolunu takip ederek arka planı ve rengini değiştirebilirsiniz. Blogger için yazılmış yüzlerce özel şablon vardır. Bunları sitenize uyguladığınızda belki arka planını kendinize göre özelleştirip değiştirmek istersiniz. Bu yazımda bunu açıklamaya çalışacağım. Özel şablonlarda blogger arka planı değiştirmek için yapmamız gerekenleri sıralayalım.

• İlk önce bir arka plan resmi seçin ve urlesini bir kenara kaydedin.
• Daha sonra eklediğiniz özel şablonun, üste 1 nolu resimdeki gibi mouse arka plan resminin üzerine getirerek sağ tıklayın. Karşınıza resimdeki ekran çıkacak.
• Burada görülen Öğeyi denetle kısmını tıklayın.
• Karşınıza ikinci resimdeki sayfa açılacaktır. Burada gördüğünüz mavi renkli kodlar özel şablonun arka plan urlsidir. İşte bu urlyi kendi resminizin urlesiyle değiştireceksiniz.
• Bu mavi renkli urlyi kopyalayın.
• Ayarlar - Şablon - HTML'yi düzenle  yolunu takip ederek sitemizin css kodlarının olduğu sayfaya giriyoruz.
• Burada CTRL+F yaparak çıkan arama çubuğuna kopyaladığınız arka plan urlsini yapıştırıp aratıyorsunuz.
• Bulduğu url ile yazımın başında dediğim, kendi seçmiş olduğunuz arka plan resminin urlsiyle değiştirip Kaydet diyerek işlemi bitiriyoruz.