City Blue XS

Tasarım Sepeti olarak sizler için dizayn ettiğimiz bu sade ve şık site tasarımı, tr gg sitelerini özellikle eğlence platformu olarak kullanmaya hevesli kişiler için ideal.

Mavi ve beyaz ağırlıklı temanın en güzel özellikleri kuşkusuz sayfa altındaki şehir manzarası ve header bölümündeki kayarak açılabilen duyuru panosu.

Tasarım ayrıca sosyal paylaşım ve haber widgetleri de bulunduruyor. Özellikle tr.gg kullanmaya yeni başlamış kullanıcılara öneririz.

Tasarımın
Önizlemesini Gör

Yorumları Gör / Yorum Yap

Nasıl Eklemeliyim?

Tasarım Özellikleri:

Haber Widgeti
Duyuru Paneli
Sosyal Paylaşım
Reklam Alanı

Tasarımın üzerindeki yazı:

<div class="tamheader">
<div class="ststyu">
<a style="position:absolute;top:10px;left:15px;font-family:Arial, sans-serif;font-size:26px;font-weight:bold;color:white;">Site Adı</a><center><a class="ctctyu"></a></center>
</div>
<div style="width:860px;height:152px;background:white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYplvy4-cdHmQ0K6NfbY0Egpbdhj7KM925gzek_SdNZx9tUaRXPPR1dV7pRSTzmOMkvS7gstdwSA5wWSzflTLwCTMxBZvPvctwW9mwRWDZZADrK7eZV0aXZ9R7TMNLfzgkUMSLvC7kfko/s1600/cbats.png) no-repeat top left;position:relative;">

<a target="_blank" href="http://tasarimsepeti.blogspot.com" style="display:block;width:220px;height:119px;position:absolute;top:20px;left:95px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrrBzb19IfgyNGwaSfLInW8YESVNqrWfAL3KGWgjUTWEkP2hf9lW3tt7bHNZkxg7eRMqcTEI9OKUWAe9Up1IAsC-t90J_Yb8dVow6daT3GlYCSwbgtI6dhAcn4xhXb_uxZ8PyZG4T_ycI/s1600/tasar%25C4%25B1m+sepeti.png) no-repeat center;">
</a>





<div style="width:506px;height:150px;float:right;">
<center><!-- açılır duyuru panosu kod başlangıcı -->
<SCRIPT type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></SCRIPT>
<div id="contentt"><a href="javascript:void(0)" style="margin:0px;padding:0px;background-color:transparent;border:none;text-decoration:none;font-family:Calibri, Arial;font-size:16px;font-weight:bold;color:#fff;float:left;text-align:center;width:100%;height:36px;line-height:26px;" id="animate">Yeni Duyuru!</a>
<input style="float:right;margin-top:1px;margin-right:10px;" id="resett" type="button" value="Kapat"><br/><div style="display:none;text-align:center;"id="duyurun"><a style="text-align:center;font-family:Calibri, Arial;font-size:16px;font-weight:bold;color:#e5e5e5;margin:0px;padding:0px;background-color:transparent;border:none;text-decoration:none;">
<br/><br/>
Tasarım Sepeti tarafından oluşturulan yeni tasarımımız nihayet sizlerle!


</a></div>
<!-- DONT DELETE THIS CODE -->
<!-- siteneeklekodlari.blogspot.com -->
<!-- BU KISIMDAN İTİBAREN KODDA DEĞİŞİKLİK YAPMAK YASAKTIR -->
<div id="eklesseyi" style="display:none;position:absolute;bottom:1px;right:3px;">
<!-- bu kod koddostu tarafından oluşturulmuştur -->
<a title="sitene açılır duyuru panosu kodu ekle" href="http://siteneeklekodlari.blogspot.com/2012/01/sitene-aclr-duyuru-panosu-koddostu.html" target="_blank" style="float:right;margin:0px;padding:0px;background-color:transparent;border:none;text-decoration:none;"><img alt="kod dostu duyuru panosu" src="http://4.bp.blogspot.com/-xtuPxjTyUKY/TwQmZLDs3LI/AAAAAAAAD-Y/YosLOoCQY70/s1600/225h2.png" style="opacity:0.4;filter:alpha(opacity=40);margin:0px;padding:0px;background-color:transparent;border:none;"/></a></div></div>
<script type="text/javascript">
$("#animate").click(function() {
$("#contentt")
.animate({"width": "500px"}, 500)
.animate({"height": "140px"}, 500);
document.getElementById('resett').style.display='block';
document.getElementById('animate').style.display='none';
document.getElementById('duyurun').style.display='block';
document.getElementById('eklesseyi').style.display='block';
});
$("#resett").click(function() {
$("#contentt")
.animate({"height": "26px"}, 500)
.animate({"width": "130px"}, 500);
document.getElementById('duyurun').style.display='none';
document.getElementById('animate').style.display='block';
document.getElementById('resett').style.display='none';
document.getElementById('eklesseyi').style.display='none';
});
</script>
<!-- bu kod koddostu tarafından oluşturulmuştur -->
<!-- siteneeklekodlari.blogspot.com -->
<!-- açılır duyuru panosu kod sonu -->

</center>


</div>

















</div>
<div class="ststyu">
<center><a href="javascript:void(0)" class="tsenu">Ana Sayfa</a><a href="javascript:void(0)" class="tsenu">sayfa1</a><a href="javascript:void(0)" class="tsenu">sayfa2</a><a class="ctctyu"></a><a href="javascript:void(0)" class="tsenu">sayfa3</a><a href="javascript:void(0)" class="tsenu">sayfa4</a><a href="javascript:void(0)" class="tsenu">sayfa5</a></center>
</div>

</div>

<div style="width:860px;overflow:hidden;margin-right:auto;margin-left:auto;margin-top:16px;">
<div style="float:left;width:550px;-webkit-border-radius: 8px;border-radius: 8px;overflow:hidden;background:white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPDUoHTmsQJmgtXElpcCk1DMsY7GxlLQ40uRK6GX0wM28fecMdDg1k22tBeCTZCAMWbjSUf2BNktUjaUx3bIaaC6mOJ7vz3R9HkSt3TtUMS3xxIrQpt4yc5nyqbrlozQYNWNEJGoTw-9E/s1600/cats.jpg) repeat-y top left;border-top:1px solid #3f6cb8;border-bottom:1px solid #3f6cb8;margin-top:16px;min-height:700px;margin-bottom:250px;">

Tasarımın altındaki yazı:

<br/></div>

<div style="width:300px;float:right;">
<div style="width:298px;height:80px;position:relative;padding:0px;margin:0px;overflow:hidden;margin-top:17px;border:1px solid #3f6cb8;-webkit-border-radius: 8px;border-radius: 8px;background-color:white;"><center>
<a style="display:block;font-family:Trebuchet MS, sans-serif;font-size:15px;font-weight:bold;color:#4f4f4f;margin-top:8px;">Bu sayfayı paylaş</a>

<!--Kod Dostu kod başlangıcı-->
<!--KOD İÇERİSİNDE DEĞİŞİKLİK YAPMAK YASAKTIR-->
<table border="0" cellspacing="0" style="border-spacing: 0px;"><tr><td class="nucrelerim">
<a href="javascript:void(0);" onclick="window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(location.href)+'&t='+encodeURIComponent(document.title), 'facebook','toolbar=no,width=600,height=310'); return false;" class="sosyalkoddostu" style="background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2cmANv2CnnNgPwItHRHVsAtRrf1uJ8v_GwzAlOiZ52zOAueJ36gFNkum6_tUFMlDdKF_NEhIkwZhlLiRUlnE0s77pErjSMfI7HwG-MFUYEY5mtJNb-RiFEQW0u7mCCchh_0IzPOqyKKOn/s1600/face.png);"></a>
<!--BU PAYLAŞ BUTONLARI ŞU SİTEYE AİTTİR: siteneeklekodlari.blogspot.com-->
</td><td class="nucrelerim">
<a href="javascript:(function(){var hght=400;var nmbr=Number((window.screen.width-wdth)/2);var wdth=490;var y=Number((window.screen.height-hght)/2);window.open('https://plusone.google.com/_/+1/confirm?hl=tr&url='+encodeURIComponent(location.href)+'&title='+encodeURIComponent(document.title),'','width='+wdth+',height='+hght+',left='+nmbr+',top='+hght+',scrollbars=no');})();" class="sosyalkoddostu" style="background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOFSxdHzpS0itpg1jNmvaHTDWan-9Gv5Ori153qQqCr4pkjuD_SFajC620sWa49yirB2TZ9e0wXWxL2qaxrozP25ReZcH8hxtytwVGnAEqcT4wDyGu6kn2IBypJ-vNlqhVScQWm8tmvie5/s1600/gp.png);"></a>
<!--BU PAYLAŞ BUTONLARI ŞU SİTEYE AİTTİR: siteneeklekodlari.blogspot.com-->
</td><td class="nucrelerim">
<a onclick="window.open('http://twitter.com/share?text='+encodeURIComponent(document.title)+'@koddostu&url='+encodeURIComponent(location.href), 'facebook','toolbar=no,width=600,height=310'); return false;" href="javascript:void(0);" class="sosyalkoddostu" style="background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1txINHARodjDTtSGvnoJ-n1iR0M2jOFnUpB1whcfTf-bqrZli3cV9q8t9SSjfgPQUTSTEdApk6jtt44rP1I6MVyQr7Na5gk0qaHAxCY1zIcWIKsbG0O1aQAD6ghFfashRzctxMyyu3lkT/s1600/twi.png);"></a>
<!--BU PAYLAŞ BUTONLARI ŞU SİTEYE AİTTİR: siteneeklekodlari.blogspot.com-->
</td><td class="nucrelerim">
<a href="javascript:void(0);" onclick="window.open('http://www.netlog.com/go/manage/blog/view=add&origin=external&title='+encodeURIComponent(document.title)+'&referer='+encodeURIComponent(location.href), 'netlog','toolbar=no,width=550,height=550'); return false;" class="sosyalkoddostu" style="background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCrSXfUYXNEFWfL2YMVl0YwT3NsmynwOrbouhQpO_EHVC8uiW-fcX0jUVNCmSlRNy-pXFXPfB2lEpDjPsJQZEbAIOxg_phyWyULfdi6wcsqLrGqbjPjtMtZJ7denGl8fxLbHrup-IaesqW/s1600/net.png);"></a>



</td></tr></table>

</div>




<a href="http://tasarimsepeti.blogspot.com" target="_blank" style="border:1px solid #3f6cb8;margin-top:17px;-webkit-border-radius: 8px;border-radius: 8px;display:block;width:298px;height:250px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOgzm1RRy3Wtcp4JaKzfWUe_-AzxF4awo929f7GTa_p18c-RhTzBoisBTOvQ-ItT0bhog8BzJRS7ahGQW8n68z3ByaI5WCBOgQUL7VBkHSJ4pbkgC6cbGKukiq9Qk-IRolaONPuzrrGA8/s1600/cats+-+Kopya+%282%29.png) no-repeat center;border:1px solid #bbb;"></a>

<div style="width:298px;height:250px;position:relative;padding:0px;margin:0px;overflow:hidden;margin-top:17px;border:1px solid #3f6cb8;-webkit-border-radius: 8px;border-radius: 8px;"><iframe src="http://www.google.com/uds/modules/elements/newsshow/iframe.html?topic=e,p,s,n&rsz=small&format=300x250" frameborder="0" width="300" height="250" marginwidth="0" marginheight="0" style="position:absolute;top:0px;left:0px;margin:0px;padding:0px;border:none;"></iframe>
<Script Language='Javascript'>
<!-- Google News Gadget -->
<!--
document.write(unescape('%3C%64%69%76%20%73%74%79%6C%65%3D%22%70%6F%73%69%74%69%6F%6E%3A%61%62%73%6F%6C%75%74%65%3B%62%6F%74%74%6F%6D%3A%31%70%78%3B%72%69%67%68%74%3A%31%70%78%3B%77%69%64%74%68%3A%31%34%30%70%78%3B%68%65%69%67%68%74%3A%32%32%70%78%3B%62%61%63%6B%67%72%6F%75%6E%64%2D%63%6F%6C%6F%72%3A%77%68%69%74%65%3B%7A%2D%69%6E%64%65%78%3A%35%30%30%3B%22%3E%3C%2F%64%69%76%3E%3C%61%20%68%72%65%66%3D%22%68%74%74%70%3A%2F%2F%73%69%74%65%6E%65%65%6B%6C%65%6B%6F%64%6C%61%72%69%2E%62%6C%6F%67%73%70%6F%74%2E%63%6F%6D%2F%32%30%31%32%2F%30%36%2F%73%69%74%65%6E%65%2D%67%6F%6F%67%6C%65%2D%68%61%62%65%72%6C%65%72%69%2D%65%6B%6C%65%2D%6D%75%68%74%65%73%65%6D%2E%68%74%6D%6C%22%20%74%61%72%67%65%74%3D%22%5F%62%6C%61%6E%6B%22%20%63%6C%61%73%73%3D%22%68%61%6D%62%6F%6C%65%6C%75%79%22%20%73%74%79%6C%65%3D%22%64%69%73%70%6C%61%79%3A%62%6C%6F%63%6B%20%21%69%6D%70%6F%72%74%61%6E%74%3B%77%69%64%74%68%3A%39%30%70%78%3B%68%65%69%67%68%74%3A%31%38%70%78%3B%62%6F%72%64%65%72%3A%6E%6F%6E%65%3B%70%61%64%64%69%6E%67%3A%30%70%78%3B%6D%61%72%67%69%6E%3A%30%70%78%3B%62%61%63%6B%67%72%6F%75%6E%64%3A%74%72%61%6E%73%70%61%72%65%6E%74%20%75%72%6C%28%68%74%74%70%3A%2F%2F%33%2E%62%70%2E%62%6C%6F%67%73%70%6F%74%2E%63%6F%6D%2F%2D%6D%70%5A%50%63%5F%75%61%6F%50%67%2F%54%39%58%47%6B%46%52%33%73%36%49%2F%41%41%41%41%41%41%41%41%4C%4C%67%2F%65%53%4F%66%47%37%64%41%51%53%59%2F%73%31%36%30%30%2F%6B%64%32%2E%70%6E%67%29%20%6E%6F%2D%72%65%70%65%61%74%20%63%65%6E%74%65%72%3B%70%6F%73%69%74%69%6F%6E%3A%61%62%73%6F%6C%75%74%65%3B%62%6F%74%74%6F%6D%3A%31%70%78%3B%72%69%67%68%74%3A%2D%36%30%70%78%3B%7A%2D%69%6E%64%65%78%3A%35%35%30%3B%6F%70%61%63%69%74%79%3A%30%2E%38%3B%66%69%6C%74%65%72%3A%61%6C%70%68%61%28%6F%70%61%63%69%74%79%3D%38%30%29%3B%22%3E%3C%2F%61%3E%0A%0A%3C%73%74%79%6C%65%3E%2E%68%61%6D%62%6F%6C%65%6C%75%79%3A%68%6F%76%65%72%7B%72%69%67%68%74%3A%30%70%78%20%21%69%6D%70%6F%72%74%61%6E%74%3B%7D%3C%2F%73%74%79%6C%65%3E'));
//-->
</Script>
</div>

</div>
</div>


   <!DOCTYPE HTML><style type="text/css">div.ucvuc{line-height:18px;position:fixed;text-align:center;z-index:1000;}div.ixded-s-e{bottom:0px;left:0px;}</style>


<script type="text/javascript">
<!-- tasarım sepeti css -->
<!--
document.write(unescape('%3c%64%69%76%20%63%6c%61%73%73%3d%22%75%63%76%75%63%20%69%78%64%65%64%2d%73%2d%65%22%20%73%74%79%6c%65%3d%22%77%69%64%74%68%3a%31%30%30%25%3b%68%65%69%67%68%74%3a%31%37%36%70%78%3b%62%61%63%6b%67%72%6f%75%6e%64%3a%74%72%61%6e%73%70%61%72%65%6e%74%20%75%72%6c%28%68%74%74%70%3a%2f%2f%32%2e%62%70%2e%62%6c%6f%67%73%70%6f%74%2e%63%6f%6d%2f%2d%48%74%50%77%66%50%4f%7a%6d%39%67%2f%54%2d%37%41%61%36%55%52%4e%68%49%2f%41%41%41%41%41%41%41%41%4c%72%59%2f%51%48%57%6f%76%39%70%68%2d%70%77%2f%73%31%36%30%30%2f%63%61%74%73%2e%70%6e%67%29%20%72%65%70%65%61%74%2d%78%20%63%65%6e%74%65%72%3b%22%3e%0d%0a%0d%0a%3c%61%20%68%72%65%66%3d%22%68%74%74%70%3a%2f%2f%74%61%73%61%72%69%6d%73%65%70%65%74%69%2e%62%6c%6f%67%73%70%6f%74%2e%63%6f%6d%22%20%73%74%79%6c%65%3d%22%70%6f%73%69%74%69%6f%6e%3a%61%62%73%6f%6c%75%74%65%3b%62%6f%74%74%6f%6d%3a%30%70%78%3b%72%69%67%68%74%3a%30%70%78%3b%63%6f%6c%6f%72%3a%23%38%30%41%46%46%46%3b%66%6f%6e%74%2d%66%61%6d%69%6c%79%3a%41%72%69%61%6c%2c%20%73%61%6e%73%2d%73%65%72%69%66%3b%66%6f%6e%74%2d%73%69%7a%65%3a%31%32%70%78%3b%74%65%78%74%2d%64%65%63%6f%72%61%74%69%6f%6e%3a%6e%6f%6e%65%3b%22%3e%32%30%31%32%20%2d%20%32%30%31%37%20%a9%20%54%fc%6d%20%48%61%6b%6c%61%72ı%20%53%61%6b%6cı%64ı%72%20%7c%20%54%61%73%61%72ı%6d%20%53%65%70%65%74%69%3c%2f%61%3e%0d%0a%3c%2f%64%69%76%3e'));
//-->
</script>

CSS kodu:

body{background:white url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiao9amvZgrRPT-xc27Lht_RwwzrN9kpAe_PMuP5UOrI205iuin2YAdeLlnjvxItQjEidEjDJk4UoQRqJynkUKcgibQvgCisy8icy4PoN8BUZbarQpY7Z_oIkxkAEWKTA40e9TibVygjD8/s1600/4334148978_840b505926.jpg) repeat center;}
.tsenu{display:inline-block;width:90px;height:30px;background-color:white;margin-right:14px;font-family:Trebuchet MS, sans-serif;font-size:14px;font-weight:bold;color:#3f6cb8 !important;line-height:30px;vertical-align:15px;-webkit-border-radius: 8px;border-radius: 8px;overflow:hidden;}
#nav_container{display:none;}
#header_container{display:none;}
body, input{font-family: Calibri, Arial;}
#contentt {text-align:left;position:relative;border:2px outset #000;background-color:#3f6cb8;width:130px;height:26px;padding:3px;margin-top:5px;overflow:hidden !important;padding:0px;-webkit-border-radius: 14px;-moz-border-radius: 14px;border-radius: 14px;} 
#resett{display:none;}
#animate:hover{background-color:#80AFFF !important;-webkit-border-radius: 14px;-moz-border-radius: 14px;border-radius: 14px;}
.sosyalkoddostu{display:block;width:55px;height:42px;}
.sosyalkoddostu:hover{background-position: 0px -43px;}
.nucrelerim{border:none;width:70px;height:45px;}
.tamheader{width:860px;height:250px;border:none;-webkit-border-radius: 8px;border-radius: 8px;overflow:hidden;margin-right:auto;margin-left:auto;}
.ststyu{position:relative;width:860px;height:49px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYAB3OPmBcQcOqQNF-y9Q2sHt8_3DBFP7FtdJg4GOWRFn9DU-CMvWZsFLEs4rtuhUj4tX0huSMvZsL0AAyw8lK6ijlrhmzVatARQC3jaFyb_7SnG7gOkmUAJhTS9Sz3ZJTMkPyzKB1dxQ/s1600/g.png) repeat-x center;}
#content_container{margin-left:25px;}
.ctctyu{display:inline-block;width:154px;height:49px;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiI5UfzHEHwLk9bId82Twgxk43HzS0P4iWeDgClrHMu5CiHT7gxcHWNWZazZPMvYtX0b9oH4PuVdUTQ6zrD0qnEbPV__geSFc_QkK5YwPY9-QCiDwKSVczFf6emaFDddSwX4xCbKIA-vzw/s154/g.png) no-repeat center;}

Ana sayfaya eklenecek kod: