tasarimduragi - css time basket

css time basket

Time Basket

Tasarım Sepeti ekibi olarak, Facebook'un Timeline profil görünümünden ilham alarak yarattığımız bu tr gg tasarım sayesinde ziyaretçileriniz nereye uğradıklarını şaşıracaklar!

Time Basket, açılır facebook penceresinden duyuru paneline, anasayfa şablonundan TS Reklam Saklayıcı'ya kadar pek çok işlevi bir arada sunuyor.
Özellikle kişisel web sitesi oluşturmak isteyenler için son derece cazip bir bedava-sitem tasarımı olmakla birlikte, geniş kapak fotoğrafı sayesinde tek bir büyük resimle özelleştirmek mümkündür.

Tasarım üzerindeki yazı :

Tasarım altındaki yazı :

<div class='widget FollowByEmail' id='FollowByEmail1'><br/> <div class="discerc"><center><div class="iccerc"><div class="source"><a href="http://siteneeklekodlari.blogspot.com/2011/10/sitene-kayarak-degisen-duyuru-panosu.html" _fcksavedurl="http://siteneeklekodlari.blogspot.com/2011/10/sitene-kayarak-degisen-duyuru-panosu.html" target="_blank"><img style="border:none;height:20px;float:right;" src="http://img607.imageshack.us/img607/5117/35219057.png" _fcksavedurl="http://img607.imageshack.us/img607/5117/35219057.png" /></a></div><a class="anabaslik">Duyurular</a><MARQUEE direction=up width=300 height=100><center><br/><a class="baslik">Açıldık!</a><p class="duyur">   Yeni sitemizi muhteşem arşiviyle birlikte sizlerin hizmetine sunuyoruz</p><br/><hr><br/><a class="baslik">Duyuru 2</a><p class="duyur">   Buraya ikinci duyurunun metnini yazacaksınız</p><br/><hr></center> </MARQUEE></div></center></div>  <style>.source{position:absolute;bottom:0px;right:0px;}.anabaslik{font-family:Verdana;color:#fff;font-weight:bold;font-size:16px;display:block;width:300px;height:26px;border-top:1px solid #aaa;border-bottom:1px solid #aaa;background-color:#3b5998} .baslik{color:#3b5998;font-weight:bold;font-size:19px;} .duyur{font-family:Verdana;font-size:13px;} .iccerc{-moz-border-radius: 8px; border-radius: 8px;position:relative;background-color:#fff;padding-top:5px;margin-top:10px;width:300px;height:130px;border:1px solid #ccc;overflow:hidden;} .discerc{-moz-border-radius: 6px; border-radius: 6px;background-color:#3b5998;width:330px;height:160px;border:1px solid #aaa}</style>                 </div><div class='widget Text' id='Text1'> <div class='widget-content'> <a style="line-height:22px;">20 Ekim tarihinde doğdu.</a><br/><a style="line-height:22px;">İzmir'de yaşıyor.</a><br/> </div> </div></div> </div> <div id='rsidebar-wrapper'>  <div class='tabviewsection'> <div class='widget-container'> <div class='tabs-widget-content tabs-widget-content-widget-themater_tabs-1432447472-id' id='widget-themater_tabs-1432447472-id1'> <div class='sidebar section' id='sidebartab1'><div class='widget BlogArchive' id='BlogArchive1'> <div class='widget-content'> <div id='ArchiveList'> <div id='BlogArchive1_ArchiveList'> <ul class='hierarchy'> <li class='archivedate expanded'> <a class='post-count-link' >2012</a> <span class='post-count' dir='ltr'>(7)</span> <ul class='hierarchy'> <li class='archivedate expanded'> <a class='post-count-link' href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Mart</a> <span class='post-count' dir='ltr'>(1)</span> </li> </ul> <ul class='hierarchy'> <li class='archivedate collapsed'> <a class='post-count-link' href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Şubat</a> <span class='post-count' dir='ltr'>(1)</span> </li> </ul> <ul class='hierarchy'> <li class='archivedate collapsed'> <a class='post-count-link' href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Ocak</a> <span class='post-count' dir='ltr'>(5)</span> </li> </ul> </li> </ul> <ul class='hierarchy'> <li class='archivedate collapsed'> <a class='post-count-link' href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>2011</a> <span class='post-count' dir='ltr'>(1)</span> <ul class='hierarchy'> <li class='archivedate collapsed'> <a class='post-count-link' href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Aralık</a> <span class='post-count' dir='ltr'>(1)</span> </li> </ul> </li> </ul> <ul class='hierarchy'> <li class='archivedate collapsed'> <a class='toggle' href='javascript:void(0)' _fcksavedurl='javascript:void(0)'> <span class='zippy'>            ►           </span> </a> <a class='post-count-link' href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>2010</a> <span class='post-count' dir='ltr'>(1)</span> <ul class='hierarchy'> <li class='archivedate collapsed'> <a class='post-count-link' href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Ekim</a> <span class='post-count' dir='ltr'>(1)</span> </li> </ul> </li> </ul> </div> </div> </div> </div><div class='widget HTML' id='HTML1'> <div class='widget-content'> <br/><br/><br/><br/>  <a href="javascript:void(0);" _fcksavedurl="javascript:void(0);" onclick_fckprotectedatt="%20onclick%3D%22document.getElementById('faceuyari').style.display%3D'block'%3B%22" style="margin:0px;padding:0px;color:black;background-color:transparent;border:none;text-decoration:none;"><button>  Ben de İstiyorum!  </button></a>  <style>  #kutuboyutu{ /* Yükseklik ve genişliği buradan değiştirebilirsiniz: */ width:400px; height:200px;  }</style>   <style type="text/css">div.dbhu{   /* Kutucuğun sayfa açıldığında kendiliğinden görünmesini istiyorsanız "display:none;" yazısını silin: */  display:none;  position:fixed;text-align:left;z-index:1000;}div.oocin{top:0px;left:0px;padding-top:180px;}</style><style type="text/css">div.dbhu{_position:absolute;}div.oocin{_bottom:auto;_top:expression(ie6=(document.documentElement.scrollTop+document.documentElement.clientHeight - 52+"px") );}</style><div id="faceuyari" class="dbhu oocin" style="text-align:left;width:100%;height:100%;background-color.transparent;"><center><div id="kutuboyutu" style="padding:10px;-webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px;background-color:#868686;background-color: rgba(82, 82, 82, 0.7);"><div style="background-color:white;width:100%;height:100%;border:none;position:relative;overflow:hidden;padding-right:1px;border-right:1px solid #555;"><div style="width:100%;height:27px;background-color:#6d84b4;border-top:1px solid #3b5998;border-left:1px solid #3b5998;border-right:1px solid #3b5998;border-bottom:none !important;text-align:left;position:relative;"><a target="_blank" href="http://siteneeklekodlari.blogspot.com/2012/01/sitene-facebookdaki-gibi-aclan-kutular.html" _fcksavedurl="http://siteneeklekodlari.blogspot.com/2012/01/sitene-facebookdaki-gibi-aclan-kutular.html" style="position:absolute;top:2px;right:3px;margin:0px;padding:0px;background-color:transparent;border:none;color:white;font-size:14px;font-family:Verdana;font-weight:bold;text-decoration:none;">?</a><a style="line-height:27px;margin:0px;padding:0px;background-color:transparent;border:none;text-decoration:none;font-weight:bold;color:white;font-family:Verdana;font-size:14px;margin-left:10px;">   Merhaba !    </a></div><div style="width:100%;height:100%;border:1px solid #555555;border-top:none !important;margin-top:0px;text-align:left;padding:16px;font-family:Verdana;font-size:12px;font-weight:normal;color:black;">    Bu tr gg teması, Tasarım Sepeti tarafından<br/> oluşturulmuştur ve bireysel olarak kullanımı ücretsizdir.<br/><a href="http://tasarimsepeti.blogspot.com" _fcksavedurl="http://tasarimsepeti.blogspot.com">Tasarım Sepeti</a>  </div> <div style="background-color:#f2f2f2;width:100%;height:40px;position:absolute;bottom:0px;left:0px;border:1px solid #555555;border-top:1px solid #ccc !important;text-align:right;"><a onclick_fckprotectedatt="%20onclick%3D%22document.getElementById('faceuyari').style.display%3D'none'%3B%22" style="margin:0px;padding:0px;border:none;text-decoration:none;font-weight:bold;color:white;font-family:Verdana;font-size:12px;"><button style="margin-top:9px;margin-right:10px;border:1px outset #29447e;border-bottom:1px solid #213d79 !important;height:25px;text-decoration:none;font-weight:bold;color:white;font-family:Verdana;font-size:12px;background-color:#5872a7;padding-bottom:3px;">  Tamam</button></a> </div>  </div></div></center></div><br/><br/><br/> </div> </div><div class='widget HTML' id='HTML4'> <h2 class='title'>Sponsorlu</h2> <div class='widget-content'> <a><b>Reklam Başlığı</b><br/><img src="http://www.grayrider.com/AdvertiseHere-5.JPG" _fcksavedurl="http://www.grayrider.com/AdvertiseHere-5.JPG" height="125" width="125" style="background-color:#3b5998;width:125px;height:125px;" /><br/>Örnek reklam metni buraya gelecek</a><br/> <hr/><br/> <a><b>Reklam Başlığı</b><br/><img src="http://www.grayrider.com/AdvertiseHere-5.JPG" _fcksavedurl="http://www.grayrider.com/AdvertiseHere-5.JPG" height="125" width="125" style="background-color:#3b5998;width:125px;height:125px;" /><br/>Örnek reklam metni buraya gelecek</a><br/> <hr/><br/> <a><b>Reklam Başlığı</b><br/><img src="http://www.grayrider.com/AdvertiseHere-5.JPG" _fcksavedurl="http://www.grayrider.com/AdvertiseHere-5.JPG" height="125" width="125" style="background-color:#3b5998;width:125px;height:125px;" /><br/>Örnek reklam metni buraya gelecek</a><br/> <hr/><br/> <a><b>Reklam Başlığı</b><br/><img src="http://www.grayrider.com/AdvertiseHere-5.JPG" _fcksavedurl="http://www.grayrider.com/AdvertiseHere-5.JPG" height="125" width="125" style="background-color:#3b5998;width:125px;height:125px;" /><br/>Örnek reklam metni buraya gelecek</a> </div> </div><div class='widget Attribution' id='Attribution1'> <div class='widget-content' style='text-align: center;'> Timeline Theme. Powered by <a href='http://tasarimsepeti.blogspot.com' _fcksavedurl='http://tasarimsepeti.blogspot.com' target='_blank'>Tasarım Sepeti</a>. </div> </div></div> </div>   </div> </div></div> </div> </div>

Css Kodu :

body{background-color:#E7EBF2;color:#666666;font-family: Lucida Grande , Arial, Verdana , sans-serif;font-size: 12px;margin:0px;padding:0px;} a:link,a:visited{color:#444444;text-decoration:underline;outline:none;} a:hover{color:#3b5998;text-decoration:none;outline:none;} a img{border-width:0} .clearfix:after{content:"�020";display:block;height:0;clear:both;visibility:hidden;overflow:hidden} #container,#header,#main,#main-fullwidth,.clearfix{display:block} .clear{clear:both} h1,h2,h3,h4,h5,h6{margin-bottom:6px;font-weight:normal;line-height:1} h1{font-size:40px} h2{font-size:20px;color:#1C2A47;font-family:Lucida Grande , Arial, Verdana , sans-serif;font-weight:bold;} h3{font-size:20px} h4{font-size:16px} h5{font-size:14px} h6{font-size:12px} h1 img,h2 img,h3 img,h4 img,h5 img,h6 img{margin:0} table{margin-bottom:20px;width:100%} th{font-weight:bold} thead th{background:#c3d9ff} th,td,caption{padding:4px 10px 4px 5px} tr.even td{background:#e5ecf9} tfoot{font-style:italic} caption{background:#eee} li ul,li ol{margin:0} ul,ol{margin:0 20px 20px 0;padding-left:40px} ul{list-style-type:disc} ol{list-style-type:decimal} dl{margin:0 0 20px 0} dl dt{font-weight:bold} dd{margin-left:20px} blockquote{margin:20px;color:#666;font-style:italic} pre{margin:20px 0;white-space:pre} pre,code,tt{font:13px 'andale mono','lucida console',monospace;line-height:18px} /* Header-----------------------------------------------*/ #header-wrapper{display:none;width:960px;margin:0 auto 0;height:1px;padding:18px 0px 18px 0px;overflow:hidden;} #header-inner{background-position:center;margin-left:auto;margin-right:auto} #header{margin:0;border:0 solid $bordercolor;color:$pagetitlecolor;float:left;width:62%;overflow:hidden;} #header h1{margin:0 5px 0;padding:0px 0px 0px 0px;font-family: Lucida Grande , Arial, Verdana , sans-serif;font-weight:bold;font-size:32px;line-height:32px;color:#2E372E;text-shadow:0px 1px 0px #fff;} #header .description{padding-left:7px;color:#2E372E;text-shadow:0px 1px 0px #fff;line-height:14px;font-size:14px;padding-top:0px;margin-top:5px;} .archivedate{padding-left:0px !important;padding-top:0px !important;padding-bottom:0px !important;margin-left:0px !important;margin-top:0px !important;margin-bottom:0px !important;} #header h1 a,#header h1 a:visited{color:#2E372E;text-decoration:none} #header h2{padding-left:15px;color:#2E372E;font:14px Arial,Helvetica,Sans-serif} #header2{float:right;width:36%;margin-right:0px;padding-right:0px;overflow:hidden;} #header2 .widget{padding:0px 0px 0px 0px;float:right} .social-profiles{padding-top:4px;height:24px;float:right} .social-profiles img{margin:0 0 0 6px !important} .social-profiles img:hover{opacity:0.8} .social-profiles-widget img{margin:0 6px 0 0} .social-profiles-widget img:hover{opacity:0.8} #top-social-profiles{float:right;} /* Outer-Wrapper----------------------------------------------- */ #outer-wrapper{width:1030px;margin:0px auto 0px;padding:0;text-align:left;font:$bodyfont;} #content-wrapper{position:relative;padding:0px 0px 0px 0px;} #main-wrapper{width:900px;padding-top:0px;padding-left:0px;padding-right:0px;float:left;word-wrap:break-word;overflow:hidden;} #rsidebar-wrapper{position:absolute;top:23px;left:864px;width:125px;float:right;margin-left:0px;padding-right:0px;margin-right:0px;padding-top:10px;padding-bottom:15px;word-wrap:break-word;overflow:hidden;} .menus,.menus *{margin:0;padding:0;list-style:none;list-style-type:none;line-height:1.0} .menus ul{position:absolute;top:-999em;width:100%} .menus ul li{width:100%} .menus li:hover{visibility:inherit} .menus li{float:left;position:relative} .menus a{display:block;position:relative} .menus li:hover ul,.menus li.sfHover ul{left:0;top:100%;z-index:99} .menus li:hover li ul,.menus li.sfHover li ul{top:-999em} .menus li li:hover ul,.menus li li.sfHover ul{left:100%;top:0} .menus li li:hover li ul,.menus li li.sfHover li ul{top:-999em} .menus li li li:hover ul,.menus li li li.sfHover ul{left:100%;top:0} .sf-shadow ul{padding:0 8px 9px 0;-moz-border-radius-bottomleft:17px;-moz-border-radius-topright:17px;-webkit-border-top-right-radius:17px;-webkit-border-bottom-left-radius:17px} .menus .sf-shadow ul.sf-shadow-off{background:transparent} .menu-primary-container{padding:0;position:relative;height:30px;z-index:400;float:right} .menu-primary{} .menu-primary ul{min-width:160px} .menu-primary li a{color:#3F3F3F;padding:9px 15px;text-decoration:none;font:normal 11px Arial,Helvetica,Sans-serif} .menu-primary li a:hover,.menu-primary li a:active,.menu-primary li a:focus,.menu-primary li:hover > a,.menu-primary li.current-cat > a,.menu-primary li.current_page_item > a,.menu-primary li.current-menu-item > a{color:#fff;outline:0;background:#3b5998} .menu-primary li li a{color:#3F3F3F;text-transform:none;background:#ECECEC;padding:10px 15px;margin:0;border:0;font-weight:normal} .menu-primary li li a:hover,.menu-primary li li a:active,.menu-primary li li a:focus,.menu-primary li li:hover > a,.menu-primary li li.current-cat > a,.menu-primary li li.current_page_item > a,.menu-primary li li.current-menu-item > a{color:#fff;background:#3b5998;outline:0;border-bottom:0;text-decoration:none} .menu-primary a.sf-with-ul{padding-right:20px;min-width:1px} .menu-primary .sf-sub-indicator{position:absolute;display:block;overflow:hidden;right:0;top:0;padding:8px 10px 0 0} .menu-primary li li .sf-sub-indicator{padding:9px 10px 0 0} .wrap-menu-primary .sf-shadow ul{background:url('http://1.bp.blogspot.com/-DgDDUuR5ufM/Tv3oh-iG-9I/AAAAAAAADtw/SgvYWNU-XFQ/s000/menu-primary-shadow.png') no-repeat bottom right} .menu-secondary-container{position:relative;height:42px;z-index:300;background:url(http://1.bp.blogspot.com/-1paD9KSwiXg/Tv3oiB1HjmI/AAAAAAAADt4/G5CqjcdGlhk/s000/menu-secondary-bg.png) left top repeat-x} .menu-secondary{} .menu-secondary ul{min-width:160px} .menu-secondary li a{color:#3F3F3F;padding:15px 15px 12px 15px;text-decoration:none;font:bold 12px Arial,Helvetica,Sans-serif} .menu-secondary li a:hover,.menu-secondary li a:active,.menu-secondary li a:focus,.menu-secondary li:hover > a,.menu-secondary li.current-cat > a,.menu-secondary li.current_page_item > a,.menu-secondary li.current-menu-item > a{color:#F5F5F5;background:url(http://1.bp.blogspot.com/-1paD9KSwiXg/Tv3oiB1HjmI/AAAAAAAADt4/G5CqjcdGlhk/s000/menu-secondary-bg.png) left -142px repeat-x;outline:0} .menu-secondary li li a{color:#F5F5F5;background:#3b5998;padding:10px 15px;text-transform:none;margin:0;font-weight:normal} .menu-secondary li li a:hover,.menu-secondary li li a:active,.menu-secondary li li a:focus,.menu-secondary li li:hover > a,.menu-secondary li li.current-cat > a,.menu-secondary li li.current_page_item > a,.menu-secondary li li.current-menu-item > a{color:#3F3F3F;background:#E7E7E7;outline:0} .menu-secondary a.sf-with-ul{padding-right:26px;min-width:1px} .menu-secondary .sf-sub-indicator{position:absolute;display:block;overflow:hidden;right:0;top:0;padding:14px 13px 0 0} .menu-secondary li li .sf-sub-indicator{padding:9px 13px 0 0} .wrap-menu-secondary .sf-shadow ul{background:url('http://4.bp.blogspot.com/-Y0WQ-L4xZjM/Tv3oiaRVYPI/AAAAAAAADuA/lhDfAJI4mCA/s000/menu-secondary-shadow.png') no-repeat bottom right} /* Headings----------------------------------------------- */ h2{} /* Posts-----------------------------------------------*/ h2.date-header{margin:1.5em 0 .5em;display:none;} .wrapfullpost{} .toggle{display:none;} .post-count{display:none;} #FollowByEmail1{position:absolute;width:350px;height:78px;top:320px;left:490px;} #PopularPosts1{position:absolute;width:350px;top:398px;left:490px;} .entry-title a{color:#1C2A47;font-size:16px;padding-left:8px;padding-top:8px;font-family:Lucida Grande , sans-serif;} .post-count-link{color:#94A0C1 !important;display:block;height:22px;width:150px;border:none;border-left:5px solid #C8D1E2;text-indent:10px;line-height:22px;font-size:11px;text-decoration:none;} .expanded .post-count-link{border-left:5px solid #627AAD !important;color:#627AAD !important;} .post-count-link:hover{text-decoration:underline;} .post{-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;margin-bottom:15px;border:1px solid #c4cde0;background:#FFF;padding:5px 5px 0 5px;position:relative;} .post:hover{border-color:#97A4C2 !important;} .post-title{color:#555555;margin:0 0 10px 0;padding:0;font-family: Lucida Grande , Arial, Verdana , sans-serif;font-size:24px;line-height:24px;font-weight:bold;text-transform:none;} .post-title a,.post-title a:visited,.post-title strong{display:block;text-decoration:none;color:#555555;text-decoration:none;} .post-title strong,.post-title a:hover{color:#3b5998;text-decoration:none;} .post-body{margin:0px;padding:0px 10px 0px 0px;font-family: Lucida Grande , Arial, Verdana , sans-serif;font-size:12px;line-height: 20px;} .post-footer{margin:5px 0;} .comment-link{margin-$startSide:.6em} .post-body img{padding:6px;border:1px solid #c4cde0;background:#ffffff;} .postmeta-primary{color:#666;font-size:11px;padding:0 0 10px 0;margin:0 0 5px 0;border-bottom:1px solid #CCC} .postmeta-secondary{color:#666;font-size:11px;padding:0 0 15px 0} .meta_date,.meta_author,.meta_comments,.meta_edit,.meta_categories,.meta_tags{padding:3px 0 3px 0px;background-position:left center;background-repeat:no-repeat} .meta_date{} .meta_author{} .meta_comments{background-image:url(http://2.bp.blogspot.com/-K4fkHDXOQpg/Tv3okOJaVUI/AAAAAAAADuY/_No5bCm6pFs/s000/comments.png)} .meta_edit{background-image:url(images/edit.png)} .meta_categories{background-image:url(http://2.bp.blogspot.com/-h0DQ6CGRAFc/Tv3okOHX09I/AAAAAAAADug/bQ4aguSLzhg/s000/cat.png)} .meta_tags{background-image:url(http://3.bp.blogspot.com/-aZZZ02Bv4Ds/Tv3okeoptYI/AAAAAAAADuo/39i5LpoECKQ/s000/tags.png)} .readmore{float:right;position:absolute;bottom:10px;right:10px;} .readmore a{font-family:Lucida Grande , sans-serif;font-size:11px;padding:4px 8px;display:inline-block;line-height:14px;text-decoration:none;border:none;color:#3b5998;} .readmore a:hover{text-decoration:underline;} .fp-slider{margin:0 0 15px 0;border:0 solid #6F261D;position:relative;width:960px;height:332px;overflow:hidden} .fp-slides-container{} .fp-slides,.fp-thumbnail,.fp-prev-next-wrap,.fp-nav{width:960px} .fp-content{width:930px} .fp-slides,.fp-thumbnail{height:300px;overflow:hidden;position:relative} .fp-title{color:#fff;font:bold 18px Arial,Helvetica,Sans-serif;padding:0 0 2px 0;margin:0} .fp-title a,.fp-title a:hover{color:#fff;text-decoration:none} .fp-content{position:absolute;bottom:0;left:0;background:#111;opacity:0.7;filter:alpha(opacity = 70);padding:10px 15px;overflow:hidden} .fp-content p{color:#fff;padding:0;margin:0;line-height:18px} .fp-more,.fp-more:hover{color:#fff;font-weight:bold} .fp-nav{height:12px;text-align:center;padding:10px 0;background:#333} .fp-pager a{background-image:url(http://1.bp.blogspot.com/-nlq1NROQORA/Tv3okeSX3-I/AAAAAAAADuw/a25MoeHmVKA/s000/featured-pager.png);cursor:pointer;margin:0 8px 0 0;padding:0;display:inline-block;width:12px;height:12px;overflow:hidden;text-indent:-999px;background-position:0 0;float:none;line-height:1;opacity:0.7;filter:alpha(opacity = 70)} .fp-pager a:hover,.fp-pager a.activeSlide{text-decoration:none;background-position:0 -112px;opacity:1.0;filter:alpha(opacity = 100)} .fp-prev-next-wrap{position:absolute;top:130px;left:0;height:37px} .fp-prev{float:left;margin-left:14px;width:37px;height:37px;background:url(http://2.bp.blogspot.com/-8ktbgSzDjBQ/Tv3oklbMy5I/AAAAAAAADu4/1i12xMRrRXA/s000/featured-prev.png) left top no-repeat;opacity:0.6;filter:alpha(opacity = 60)} .fp-prev:hover{opacity:0.8;filter:alpha(opacity = 80)} .fp-next{float:right;width:36px;height:37px;margin-right:14px;background:url(http://2.bp.blogspot.com/-zqHYr244Zi0/Tv3ok8F_PMI/AAAAAAAADvA/yOu-lCvBlQg/s000/featured-next.png) right top no-repeat;opacity:0.6;filter:alpha(opacity = 60)} .fp-next:hover{opacity:0.8;filter:alpha(opacity = 80)} /* Sidebar Content----------------------------------------------- */ .sidebar{margin:0 0 10px 0;font-size:13px;color:#333;} .sidebar a{text-decoration:none;color:#333;} .sidebar a:hover{text-decoration:underline;color:#3B5998;} .sidebar h2{color:#3B5998;font-size:11px;line-height:16px;font-family: Lucida Grande , Arial, Verdana , sans-serif;font-weight:bold;margin:0 0 10px 0;padding:6px 0 2px 2px;} .sidebar ul{list-style-type:none;list-style:none;margin:0px;padding:0px;} .sidebar ul li{padding:8px 0 8px 0;margin:0;background:url(http://3.bp.blogspot.com/-twcPQGEir6E/Tv3ok0gn5dI/AAAAAAAADvI/GiKDqdXTYyg/s000/widget-line.png) left bottom repeat-x;} .sidebar .widget{margin:0 0 15px 0;padding:0;color:#333;font-size:13px;} .main .widget{margin:0 0 5px;padding:0 0 2px} .main{position:relative;} .main .Blog{border-bottom-width:0} /* Search ----------------------------------------------- */ #content-search{width:300px;padding:15px 0}  /* Profile ----------------------------------------------- */ .profile-img{float:$startSide;margin-top:0;margin-$endSide:5px;margin-bottom:5px;margin-$startSide:0;padding:4px;border:1px solid $bordercolor} .profile-data{margin:0;letter-spacing:.1em;font:$postfooterfont;color:$sidebarcolor;font-weight:bold;line-height:1.6em} .profile-datablock{margin:.5em 0 .5em} .profile-textblock{margin:0.5em 0;line-height:1.6em} .avatar-image-container{background:url(http://2.bp.blogspot.com/-qjPrgcqHoyA/Tv3olPr73fI/AAAAAAAADvY/6kUD3V-tJBA/s000/comment-avatar.jpg);width:32px;height:32px;float:right;margin:5px 10px 5px 5px;border:1px solid #ddd;} .avatar-image-container img{width:32px;height:32px;} .profile-link{font:$postfooterfont;letter-spacing:.1em} #navbar-iframe{height:0;visibility:hidden;display:none;} /* -- number page navigation -- */ #blog-pager {padding:6px 0px;font-size:11px;} .hentry{max-width:839px !important;} #Blog1{position:relative;width:899px !important;z-index:2000 !important;} #comment-form iframe{padding:5px;width:580px;height:275px;} .tabs-widget{list-style:none;list-style-type:none;margin:0 0 10px 0;padding:0;height:26px} .tabs-widget li{list-style:none;list-style-type:none;margin:0 0 0 4px;padding:0;float:left} .tabs-widget li:first-child{margin:0} .tabs-widget li a{color:#3F3F3F;background:#EAEAEA;padding:6px 16px;display:block;text-decoration:none;font:bold 12px/12px Arial,Helvetica,Sans-serif;border:1px solid #f9f9f9} .tabs-widget li a:hover,.tabs-widget li a.tabs-widget-current{background:#C64127;color:#fff;border:1px solid #A82B13} .tabs-widget-content{} .tabviewsection{margin-top:0px;margin-bottom:10px;} .tabviewsection .widget{border:none !important;padding:0px;} #crosscol-wrapper{display:none;} .PopularPosts .item-title{font-weight:bold;padding-bottom:0.2em;text-shadow:0px 1px 0px #fff;} .PopularPosts .widget-content ul li{padding:0.7em 0;background:none} #pagelistmenusblog h2 {display:none;} .widget-container{list-style-type:none;list-style:none;margin:0 0 15px 0;padding:0;color:#333;font-size:13px} h3.widgettitle{color:#3B5998;font:bold 11px/11px "lucida grande",tahoma,verdana,arial,sans-serif;margin:0 0 10px 0;padding:6px 0 2px 2px;text-transform:uppercase} div.span-1,div.span-2,div.span-3,div.span-4,div.span-5,div.span-6,div.span-7,div.span-8,div.span-9,div.span-10,div.span-11,div.span-12,div.span-13,div.span-14,div.span-15,div.span-16,div.span-17,div.span-18,div.span-19,div.span-20,div.span-21,div.span-22,div.span-23,div.span-24{display:none;float:left;margin-right:10px} .span-1{width:30px}.span-2{width:70px}.span-3{width:110px}.span-4{width:150px}.span-5{width:190px}.span-6{width:230px}.span-7{width:270px}.span-8{width:310px}.span-9{width:350px}.span-10{width:390px}.span-11{width:430px}.span-12{width:470px}.span-13{width:510px}.span-14{width:550px}.span-15{width:590px}.span-16{width:630px}.span-17{width:670px}.span-18{width:710px}.span-19{width:750px}.span-20{width:790px}.span-21{width:830px}.span-22{width:870px}.span-23{width:910px}.span-24,div.span-24{display:none;width:960px;margin:0}input.span-1,textarea.span-1,input.span-2,textarea.span-2,input.span-3,textarea.span-3,input.span-4,textarea.span-4,input.span-5,textarea.span-5,input.span-6,textarea.span-6,input.span-7,textarea.span-7,input.span-8,textarea.span-8,input.span-9,textarea.span-9,input.span-10,textarea.span-10,input.span-11,textarea.span-11,input.span-12,textarea.span-12,input.span-13,textarea.span-13,input.span-14,textarea.span-14,input.span-15,textarea.span-15,input.span-16,textarea.span-16,input.span-17,textarea.span-17,input.span-18,textarea.span-18,input.span-19,textarea.span-19,input.span-20,textarea.span-20,input.span-21,textarea.span-21,input.span-22,textarea.span-22,input.span-23,textarea.span-23,input.span-24,textarea.span-24{border-left-width:1px!important;border-right-width:1px!important;padding-left:5px!important;padding-right:5px!important}input.span-1,textarea.span-1{width:18px!important}input.span-2,textarea.span-2{width:58px!important}input.span-3,textarea.span-3{width:98px!important}input.span-4,textarea.span-4{width:138px!important}input.span-5,textarea.span-5{width:178px!important}input.span-6,textarea.span-6{width:218px!important}input.span-7,textarea.span-7{width:258px!important}input.span-8,textarea.span-8{width:298px!important}input.span-9,textarea.span-9{width:338px!important}input.span-10,textarea.span-10{width:378px!important}input.span-11,textarea.span-11{width:418px!important}input.span-12,textarea.span-12{width:458px!important}input.span-13,textarea.span-13{width:498px!important}input.span-14,textarea.span-14{width:538px!important}input.span-15,textarea.span-15{width:578px!important}input.span-16,textarea.span-16{width:618px!important}input.span-17,textarea.span-17{width:658px!important}input.span-18,textarea.span-18{width:698px!important}input.span-19,textarea.span-19{width:738px!important}input.span-20,textarea.span-20{width:778px!important}input.span-21,textarea.span-21{width:818px!important}input.span-22,textarea.span-22{width:858px!important}input.span-23,textarea.span-23{width:898px!important}input.span-24,textarea.span-24{width:938px!important}.last{margin-right:0;padding-right:0} .last,div.last{margin-right:0} .post{background:none repeat scroll 0 0 #FFF;border:1px solid #c4cde0;float:left;height:250px;margin:0 33px 10px 0;overflow:hidden;padding:10px;width:388px} .thumbimagex{width:125px;max-height:120px;overflow:hidden;margin:0px 25px 10px 8px !important;padding:0 !important;border:none !important;background:transparent;} .post-title{font-size:14px !important;line-height:16px !important} .meta_author {display:none;} #blog-pager {width:625px;}

Ansayfaya Eklenecek Kod :

<div class='widget Blog' id='Blog1'> <div class='blog-posts hfeed'>  <h2 class='date-header'>3 Mart 2012 Cumartesi</h2> <div class='wrapfullpost'> <div class='post hentry'> <a name='8590728311593273052'></a> <h3 class='post-title entry-title'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Yayın denemesi</a> </h3> <div class='post-header-line-1'></div> <div class='postmeta-primary'> <span class='meta_date'>03:06 tarihinde</span>   <span class='meta_author'>Federico Saucedo tarafından eklendi</span>     </div> <div class='post-body entry-content'> <p> <div id='summary8590728311593273052'><div class="separator" style="clear: both; text-align: center;"> <a imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img style="float:left;" border="0" height="160" src="http://2.bp.blogspot.com/-V8xOX801EdE/TyZ5eNa-rsI/AAAAAAAAACo/Q3AqMAbBbpI/s320/random-nice-building-intramuros-metro-manila-philippines.jpg" _fcksavedurl="http://2.bp.blogspot.com/-V8xOX801EdE/TyZ5eNa-rsI/AAAAAAAAACo/Q3AqMAbBbpI/s320/random-nice-building-intramuros-metro-manila-philippines.jpg" />Orada mevcut Ipsum pasajlar birçok varyasyonu vardır, ancak çoğunluk enjekte mizah, hatta biraz inandırıcı görünmüyor randomize sözlerle, bazı form değişikliği yaşadı.</a></div>  </div>  </p> <div class='readmore'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Devamını Oku...</a> </div> </div>  </div> </div> <h2 class='date-header'>8 Şubat 2012 Çarşamba</h2> <div class='wrapfullpost'> <div class='post hentry'> <a name='7804886223901323300'></a> <h3 class='post-title entry-title'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>deneme yayını</a> </h3> <div class='post-header-line-1'></div> <div class='postmeta-primary'> <span class='meta_date'>03:03 tarihinde</span>   <span class='meta_author'>Federico Saucedo tarafından eklendi</span>     </div> <div class='post-body entry-content'> <p> <div id='summary7804886223901323300'>Bu yayın deneme için yazılmıştır.Bu yayın deneme için yazılmıştır.Bu yayın deneme için yazılmıştır.Bu yayın deneme için yazılmıştır.Bu yayın deneme için yazılmıştır.Bu yayın deneme için yazılmıştır.Bu yayın deneme için yazılmıştır.</div>  </p> <div class='readmore'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Devamını Oku...</a> </div> </div> </div> </div> <h2 class='date-header'>7 Ocak 2012 Cumartesi</h2> <div class='wrapfullpost'> <div class='post hentry'> <a name='3668064909991630205'></a> <h3 class='post-title entry-title'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>deneme4</a> </h3> <div class='post-header-line-1'></div> <div class='postmeta-primary'> <span class='meta_date'>09:27 tarihinde</span>   <span class='meta_author'>Mete Ertürk tarafından eklendi</span>     </div> <div class='post-body entry-content'> <p> <div id='summary3668064909991630205'><div class="separator" style="clear: both; text-align: center;"> <a href="http://1.bp.blogspot.com/-cWiTRJekolQ/TwIrChm__-I/AAAAAAAAD8U/JTuNdtCKYFI/s1600/d8774a5f-f37a-4ffd-8bcb-775eeccd515e_wssource_widescreen_hero.jpg" _fcksavedurl="http://1.bp.blogspot.com/-cWiTRJekolQ/TwIrChm__-I/AAAAAAAAD8U/JTuNdtCKYFI/s1600/d8774a5f-f37a-4ffd-8bcb-775eeccd515e_wssource_widescreen_hero.jpg" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" src="http://1.bp.blogspot.com/-cWiTRJekolQ/TwIrChm__-I/AAAAAAAAD8U/JTuNdtCKYFI/s1600/d8774a5f-f37a-4ffd-8bcb-775eeccd515e_wssource_widescreen_hero.jpg" _fcksavedurl="http://1.bp.blogspot.com/-cWiTRJekolQ/TwIrChm__-I/AAAAAAAAD8U/JTuNdtCKYFI/s1600/d8774a5f-f37a-4ffd-8bcb-775eeccd515e_wssource_widescreen_hero.jpg" /></a></div> <span class="" id="result_box" lang="tr">Merhaba! Bu kısım tasarım sepeti tarafından oluşturulan time basket (timeline benzeri) tr gg temasına bir özet oluşturmak için yazıldı.</span></div> </p> <div class='readmore'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Devamını Oku...</a> </div> </div> </div> </div> <div class='wrapfullpost'> <div class='post hentry' style="height:380px;"> <a name='353571614454812060'></a> <h3 class='post-title entry-title'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>çok güzel bişi demek isterdim ama unutmuşum</a> </h3> <div class='post-header-line-1'></div> <div class='postmeta-primary'>  </div> <div class='post-body entry-content'> <p> <div id='summary353571614454812060'><br /> <center><object height="281" width="370"><param name="movie" value="http://www.youtube.com/v/JnDYattQH3Y?version=3&hl=en_US"> </param> <param name="allowFullScreen" value="true"> </param> <param name="allowscriptaccess" value="always"> </param> <embed src="http://www.youtube.com/v/JnDYattQH3Y?version=3&hl=en_US" type="application/x-shockwave-flash" width="370" height="281" allowscriptaccess="always" allowfullscreen="true"></embed></object></center><br /> </div>  </p> </div> </div> </div> <div class='wrapfullpost'> <div class='post hentry'> <a name='3680820695587930232'></a> <h3 class='post-title entry-title'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>deneme bilmemkaç</a> </h3> <div class='post-header-line-1'></div> <div class='postmeta-primary'> <span class='meta_date'>09:08 tarihinde</span>   <span class='meta_author'>Mete Ertürk tarafından eklendi</span>     </div> <div class='post-body entry-content'> <p> <div id='summary3680820695587930232'>deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme deneme </div>  </p> <div class='readmore'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Devamını Oku...</a> </div> </div> </div> </div> <h2 class='date-header'>5 Ocak 2012 Perşembe</h2> <div class='wrapfullpost'> <div class='post hentry'> <a name='6727988298350572842'></a> <h3 class='post-title entry-title'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>deneme 2 facebook timeline görünüm demosu</a> </h3> <div class='post-header-line-1'></div> <div class='postmeta-primary'> <span class='meta_date'>06:32 tarihinde</span>   <span class='meta_author'>Mete Ertürk tarafından eklendi</span>     </div> <div class='post-body entry-content'> <p> <div id='summary6727988298350572842'>ikinci deneme cevap iptal etmek. Bu içecek yazar yazdırın. Live, önceki içkinizi de, size daha fazla özgürlük bir aslan, ne de burada menü Tasarım Direktörü. Hayır onu İletişim, ancak şu anda. Ama, sen Başar sen burada ajanlar, yaşam ya da ağrı için. Çok adres yazar başvurun. Hastalık karakter girin, değil mi. Biz accumsan ancak bölge hendrerit. Haberler. Dikkat: belki de.  Birçok ziyaretçi size daha fazla çocuk istediğiniz her öğe kullanın. Ve göl bazı özgürlük, size ihtiyacımız var.  </div>  </p> <div class='readmore'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Devamını Oku...</a> </div> </div> </div> </div> <div class='wrapfullpost'> <div class='post hentry'> <a name='5869893750745057032'></a> <h3 class='post-title entry-title'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>deneme 1</a> </h3> <div class='post-header-line-1'></div> <div class='postmeta-primary'> <span class='meta_date'>06:31 tarihinde</span>   <span class='meta_author'>Mete Ertürk tarafından eklendi</span>     </div> <div class='post-body entry-content'> <p> <div id='summary5869893750745057032'><div class="separator" style="clear: both; text-align: center;"> <a href="http://2.bp.blogspot.com/-zBVDRVO1a9A/Twh1GtIZZcI/AAAAAAAAEAA/Tyse2kY1Y-g/s1600/cats.jpg" _fcksavedurl="http://2.bp.blogspot.com/-zBVDRVO1a9A/Twh1GtIZZcI/AAAAAAAAEAA/Tyse2kY1Y-g/s1600/cats.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://2.bp.blogspot.com/-zBVDRVO1a9A/Twh1GtIZZcI/AAAAAAAAEAA/Tyse2kY1Y-g/s1600/cats.jpg" _fcksavedurl="http://2.bp.blogspot.com/-zBVDRVO1a9A/Twh1GtIZZcI/AAAAAAAAEAA/Tyse2kY1Y-g/s1600/cats.jpg" /></a></div> ilk deneme naber dedi güneş ayakkabı uçmak gibi üzerinden yağlı diyorsan öyle gibi gülmüş sence</div>  </p> <div class='readmore'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Devamını Oku...</a> </div> </div> </div> </div> <h2 class='date-header'>14 Aralık 2011 Çarşamba</h2> <div class='wrapfullpost'> <div class='post hentry'> <a name='9074859349044705998'></a> <div class='post-header-line-1'></div> <div class='postmeta-primary'> <span class='meta_date'>09:06 tarihinde</span>   <span class='meta_author'>Mete Ertürk tarafından eklendi</span>     </div> <div class='post-body entry-content'> <p> <div id='summary9074859349044705998'><div class="separator" style="clear: both; text-align: center;"> <a href="http://4.bp.blogspot.com/-8eemAYaKHSQ/Twh7SLd8LiI/AAAAAAAAEAI/NMxi6qZqFlU/s200/images+%25282%2529.jpeg" _fcksavedurl="http://4.bp.blogspot.com/-8eemAYaKHSQ/Twh7SLd8LiI/AAAAAAAAEAI/NMxi6qZqFlU/s200/images+%25282%2529.jpeg" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="http://4.bp.blogspot.com/-8eemAYaKHSQ/Twh7SLd8LiI/AAAAAAAAEAI/NMxi6qZqFlU/s200/images+%25282%2529.jpeg" _fcksavedurl="http://4.bp.blogspot.com/-8eemAYaKHSQ/Twh7SLd8LiI/AAAAAAAAEAI/NMxi6qZqFlU/s200/images+%25282%2529.jpeg" /></a></div>Orada mevcut Ipsum pasajlar birçok varyasyonu vardır, ancak çoğunluk enjekte mizah, hatta biraz inandırıcı görünmüyor randomize sözlerle, bazı form değişikliği yaşadı. Eğer Ipsum bir geçit kullanmaya devam ediyorsanız, metnin ortasına gizlenmiş utandırıcı bir şey olmadığından emin olmak gerekir. Internet üzerindeki tüm...</div>  </p> <div class='readmore'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Devamını Oku...</a> </div> </div> </div> </div> <h2 class='date-header'>13 Ekim 2010 Çarşamba</h2> <div class='wrapfullpost'> <div class='post hentry'> <a name='6036356521960957164'></a> <h3 class='post-title entry-title'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>dasist fobay. baybay halivud</a> </h3> <div class='post-header-line-1'></div> <div class='postmeta-primary'> <span class='meta_date'>10:19 tarihinde</span>   <span class='meta_author'>Mete Ertürk tarafından eklendi</span>     </div> <div class='post-body entry-content'> <p> <div id='summary6036356521960957164'>bu bir deneme yazısıdır. hebele gübele bumbum oldu. ıslık ytak kulağakaçan gülle uğultusu trafik çok domates endüstrisi</div>  </p> <div class='readmore'> <a href='javascript:void(0)' _fcksavedurl='javascript:void(0)'>Devamını Oku...</a> </div> </div> </div> </div> </div> <style type='text/css'> #blog-pager-newer-link{background:none repeat scroll 0 0 #ffffff;border:1px solid #CBCBCB;float:left;padding:4px} #blog-pager-older-link{background:none repeat scroll 0 0 #ffffff;border:1px solid #CBCBCB;float:right;padding:4px} .home-link {background:none repeat scroll 0 0 #ffffff;border:1px solid #CBCBCB;padding:4px} #blog-pager{margin:15px 0 0;overflow:hidden;text-align:center;font-size:12px;} #blog-pager-newer-link a{color:#666;text-decoration:none} #blog-pager-older-link a{color:#666;text-decoration:none} .home-link a{color:#666;text-decoration:none} </style> <div style='clear:both;'></div> <div class='blog-pager' id='blog-pager'> </div> <div class='clear'></div> </div>