×

İletişim Formu


Buton etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
Buton etiketine sahip kayıtlar gösteriliyor. Tüm kayıtları göster
Uygulama İndirme Butonları (APP Store - Play Store)

Uygulama İndirme Butonları (APP Store - Play Store)

9/20/2018 0 Yorum
<!DOCTYPE html> <html> <head> <title>Uygulama İndirme Butonları (APP Store - Play Store)</title> <style type="text/css"> /*<![CDATA[*/ .app_down_btn { margin:16px 0 16px; text-align:center } .app_down_btn a { padding:10px 20px; border-radius:25px; text-align:center; background:#e9e9e9; margin:0 5px 0 5px; transition:all 150ms ease-out; border-bottom:2px solid #d15241; display:inline-block } a.play_store_btn:after{ content:''; background:no-repeat url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjG7zvrIf1N7mDXNnBGMYy4epERQPTP4i8ny8Pgn6FuVSfmX27xm5MTI__-mk04YmTXHZV7bnivc0yXvKz0citqj-JSjp1kzyh60acuoTCJK0PRMRBNu9zcEAXjiD64hRNSBIhgQdH5z3E/s1600/googleplay.png); display:inline-block; background-size:90px 20px; width:90px; height:20px; margin:0; vertical-align:middle } a.app_store_btn:after{ content:''; background:no-repeat url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcOKoMHxveDYnFgBiXeR13fhvrCuXpDio65yXiTh8iKIOVZ5DPfYIleNGAJ6Jv56RO1NypkxsAKJcLMB8vIwT9AM2fVPu5nnZM8WOPc3X_7VUaWvNv0TUFGuNSg9QW1nt5xykcow2F8oU/s1600/appstore.png); display:inline-block; background-size:90px 20px; width:90px; height:20px; margin:0; vertical-align:middle } .app_down_btn a:hover { background:#f9f9f9; border-bottom:2px solid #eee } /*]]>*/ </style> </head> <body> <div class="app_down_btn"> <a class="play_store_btn" href="#" target="_blank" title="Play Store" rel="nofollow noopener"></a> <a class="app_store_btn" href="#" target="_blank" title="APP Store" rel="nofollow noopener"></a> </div> </body> </html>
Blogger Aşağı/Yukarı Kaydırma ve Disqus Son Yorumlar Widget Tasarımı

Blogger Aşağı/Yukarı Kaydırma ve Disqus Son Yorumlar Widget Tasarımı

5/08/2018 0 Yorum
<!DOCTYPE html> <HTML> <head> <title>Blog Sayfalarını Aşağı ve Yukarı Kaydırma Butonları ve Disqus Son Yorumlar Widget'ı</title> <style type='text/css'> body{font-family:-apple-system,BlinkMacSystemFont,"Roboto","Segoe UI","Oxygen-Sans","Ubuntu","Cantarell","Helvetica Neue",sans-serif;padding:0 10px} a {text-decoration:none} .post_img img{position:relative;width:100%;height:auto;border-radius:16px;overflow:hidden} /* === Animation === */ .ripple_animate{position:relative;overflow:hidden;transition:all 0.2s ease;z-index:0}.ink{display:block;position:absolute;background:rgba(255,255,255,0.3);border-radius:100%;transform:scale(0)}.animate{animation:ripple 0.65s linear}@keyframes ripple{100%{opacity:0;transform:scale(2.5)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}100%{opacity:1;transform:translateY(0)}}@keyframes rubberBand{from{transform:scale3d(1,1,1)}30%{transform:scale3d(1.25,0.75,1)}40%{transform:scale3d(0.75,1.25,1)}50%{transform:scale3d(1.15,0.85,1)}65%{transform:scale3d(.95,1.05,1)}75%{transform:scale3d(1.05,.95,1)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}@keyframes bounceInLeft{from,60%,75%,90%,to{animation-timing-function:cubic-bezier(0.215,0.610,0.355,1.000)}0%{opacity:0;transform:translate3d(-3000px,0,0)}60%{opacity:1;transform:translate3d(25px,0,0)}75%{transform:translate3d(-10px,0,0)}90%{transform:translate3d(5px,0,0)}to{transform:none}}@keyframes slideInRight{from{transform:translate3d(100%,0,0);visibility:visible;-webkit-backface-visibility:hidden}to{transform:translate3d(0,0,0)}}@keyframes slideInDown{from{transform:translate3d(0,100%,0);visibility:visible;-webkit-backface-visibility:hidden}to{transform:translate3d(0,0,0)}}@keyframes slideInTop{from{transform:translate3d(0,-100%,0);visibility:visible;-webkit-backface-visibility:hidden}to{transform:translate3d(0,0,0)}} /* === ToTop CSS === */ #blogToTop{display:none;position:fixed;bottom:49%;right:20px;cursor:pointer;list-style:none;-webkit-transform:translateZ(0);transform:translateZ(0);z-index:99} #blogToTop a{background:#fff;position:relative;overflow:hidden;display:inline-block;margin:5px auto;padding:12px 14px;border-radius:99em;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)} #blogToTop a:hover{box-shadow:0 10px 21px rgba(0,0,0,0.15),0 6px 6px rgba(0,0,0,0.12)} #top{position:absolute;top:0} #blogToTop li:nth-child(1){animation:slideInTop .5s} #blogToTop li:nth-child(2){animation:slideInRight .5s} #blogToTop li:nth-child(3){animation:slideInDown .5s} .drawer-header{background:#2e9eff;color:#fff;height:auto;padding:15px;overflow:hidden} .drawer-header h4{font-size:18px;float:left;color:#fff;margin:0;padding:0} .drawer-header img{max-width:100%;height:auto;float:right} #blogToTop .viewport-show{color:#27A0DC;transition:all .6s} #blogToTop .viewport-show:hover{color:#27A0DC} /* === Disqus Comments === */ .viewport-show:hover svg{animation:rubberBand 1s} #disqus_viewport{background:#fff;position:fixed;z-index:999;width:23.5%;top:0;right:-769px;bottom:0;transition:all .5s} #disqus_viewport.active{right:0} #drawer_overlay.active{background:rgba(53,58,61,.93);position:fixed;z-index:997;overflow:hidden;width:100%;height:100%;top:0;left:0} #disqus_viewport .drawer-close{position:fixed;margin-left:-40px;margin-top:16px;color:#fff;transition:all .3s} #disqus_viewport .drawer-close svg{transform:rotate(180deg);transition:all .3s} #disqus_viewport .drawer-close:hover svg{transform:rotate(360deg)} #RecentComments{display:block;width:100%;margin:0 auto;padding:0;height:100%} #RecentComments ul.dsq-widget-list{background:#f6f7f9;text-align:left;max-height:95%;overflow:auto;overflow-x:hidden} #RecentComments img.dsq-widget-avatar{margin:0 10px 0 0;width:32px;height:32px;padding:0;float:left;border-radius:3px;clear:both;display:block} #RecentComments p.dsq-widget-meta{clear:both;font-size:80%;margin-top:5px;font-weight:400} #RecentComments p.dsq-widget-meta a{display:inline-block;width:48%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#ced6e0;font-size:12px} #RecentComments p.dsq-widget-meta a:hover{color:#a4b0be} #RecentComments li.dsq-widget-item{background:#fff;margin:10px;padding:10px;clear:both;color:#888;border-radius:5px;border-bottom:2px solid rgba(0,0,0,0.08)} #RecentComments a.dsq-widget-user{display:table;color:#5cb767;font-weight:600;font-size:14px;margin:7px 0 0 0} #RecentComments a.dsq-widget-user:hover{color:#2e87e7} #RecentComments span.dsq-widget-comment{display:block;clear:both;margin:20px 10px 10px 0} #RecentComments .dsq-widget-comment p{display:inline-block;font-size:13px;color:#444;margin:0;font-weight:400;line-height:1.5} #RecentComments .dsq-widget-item pre{background:#f1f2f6;position:relative;color:#111;font-family:monospace;line-height:normal;overflow:hidden;text-overflow:ellipsis;padding:10px;margin:5px 0;border-radius:3px;font-size:12px} #RecentComments .dsq-widget-item pre code{color:#000;padding:0} #disqus_viewport.active #RecentComments li.dsq-widget-item{animation:bounceInLeft 1.5s} #RecentComments .dsq-widget-comment p a{color:#ced6e0} #RecentComments .dsq-widget-comment p a:hover{color:#a4b0be} @media screen and (max-width:1080px){#disqus_viewport{width:35%}} @media screen and (max-width:640px){#disqus_viewport{width:100%}#disqus_viewport .drawer-close{background:#535c68;font-size:35px;font-weight:700;color:#fff;display:block;text-align:left;margin:0;padding:0 15px;position:relative}} </style> </head> <body> <div class="post_img"> <img alt="Okuma Sevgisi Sonradan Kazandırılabilir mi?" border="0" data-original-height="353" data-original-width="578" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0attGz1P9Tuy1OQO0seng2Ynhff3cmds0VM0n_NhBOyxcE9dJBYU6Pm4M6OOiQWgusF7Ut5ptl2vUCua0hHfNn-z406NUEJOAmXITndtGZ-6FcfY5pv13bul7niyZM6x-B-j_tYZn1Ys/s1600/cocuk.jpg" title="Okuma Sevgisi Sonradan Kazandırılabilir mi?" /></div> <h2>Okuma Sevgisi Sonradan Kazandırılabilir mi?</h2> <p><b>Burada dikkat edilmesi gereken temel parametre elbette anne babanın kitap okumayı seviyor, kitap okuyor olması gelmekte. Çünkü çocuklar sizlerin kitaplar ile kurduğu ilişkileri model alarak büyüyorlar ev içinde.</b></p> <blockquote class="tr_bq">Sık sık kitaptaki karakterlerle ilgili soru sorun, hatta bazen beraber hikayenin sonunu yeniden oluşturun, bu yaratıcı düşünmelerine de yardımcı olacaktır.</blockquote> <p>Günümüz koşullarında yazılı basın ürünü kitap okuma alışkanlığı ne yazık ki gittikçe azalmakta. Elbette okumak dijital ya da kağıt üzerinde olması fark etmeksizin bireye ve sonrasında toplumlara katkısı büyük bir eylemdir. Çünkü deneyimleme şansı olunmayan birçok bilgi ancak okuma yolu ile edinilmektedir. Ancak çalışmalar göstermektedir ki erken yaşlar itibarıyla eski usul kitapların (Basılı) okunması, hem zihinsel hem de duygusal gelişim adına önemli bir yere sahiptir.</p> <p><b>Okuma alışkanlığının faydaları:</b></p> <p>Duygusal gelişim adına kitapçıya gitme ve seçme davranışı özgüven, alınan kitabı bitirme gayreti sabır, sorumluluk ve erteleyebilme gibi temel sosyal-duygusal kazanımlar olarak sıralanabilir. Bu alınan kitapların aile büyükleri tarafından okunması aile içi ilişkileri olumlu yönde etkilemekte ve okul çağında çocukların kitaplarını okula götürüp arkadaşlarına gösterme, öğretmenin tüm sınıfa kitapları okuması ise çocuklarda paylaşma kavramının gelişmesi adına önemli bir adımdır.</p> <p>Bilişsel gelişim adına ise yine bir kitabın kendisine okunmasını bekleyebilme ve okuma çağındaki çocuğun kitabı okumaya ve bitirmeye gayret etmesi ileriki yıllar için dikkat ve hafıza gibi temel bilişsel süreçlerin kuvvetlenmesi ve akademik performans için temel ihtiyaç olan erteleyebilme davranışının kazanılmasına olanak sağlamaktadır. Son yıllarda yapılan araştırmalar, erken yaşlar itibari ile kendisine kitap okunan ve sonrasında kitap okuma alışkanlığı edinmiş çocukların, akranlarına kıyasla konsantre olma ve derin öğrenme için %40 daha avantajlı olduklarını göstermekte.</p> <p>Dil gelişimi için ilk altı yılda özellikle kendisine kitap okunan çocukların ileriki yıllarda akranlarına kıyasla çok geniş bir sözcük dağarcığına sahip olduklarını bilinmekte. Bunun nedeni ise işitsel ve görsel korteksin yani işitme ve görme ile ilgili beyindeki belli alanların ilk 36 ay içerisinde en hızlı geliştiği dönem olması ve dolayısı ile bu aralıkta çocukların bu alanlarını kuvvetlendirecek en değerli etkinliklerin başında da kendilerine kitap okunması olduğu yapılan araştırmalarca kanıtlanmakta.</p> <p>Peki, erken yaşlarda kitap okumanın faydalarını özetleyecek olursak:</p> <ol> <li>Aile içi ilişkilerin kuvvetlenmesi. (Anne-çocuk/baba-çocuk okuma saatleri ile)</li> <li>Ana dil becerilerinin kuvvetlenmesi.</li> <li>Kendini ifade etme ve iletişim becerilerinin gelişmesi.</li> <li>Dikkat ve odaklanma becerilerinin kazanılması ve geliştirilmesi.</li> <li>Okunan hikayelerin etkisi ile (Yaşanan zorluklar ve mutlu sonlar) olumlu duygular geliştirmesi.</li> <li>Yaratıcılık ve hayal gücünün gelişmesi.</li> <li>Okuma sevgisi ve alışkanlığının kazandırılması.</li> </ol> <p>Elbette yukarıda saydığımız kitap okumanın faydalarının yanı sıra, kitap okumayı sevdirmek başlı başına bir konu. Burada dikkat edilmesi gereken temel parametre elbette anne babanın kitap okumayı seviyor, kitap okuyor olması gelmekte. Çünkü çocuklar sizlerin kitaplar ile kurduğu ilişkileri model alarak büyüyorlar ev içinde. Diğer parametre ise çocukların yaşlarına uygun kitapların seçilmesi. Çünkü 3 yaşında bir çocuğa 100 sayfalık ve resimsiz bir kitap okumaya kalkarsak sıkılacak ve süreci hiç içselleştiremeden sonlandırmaya çalışacaktır. O halde çocukların gelişimsel özelliklerine göre doğru kitap tercihinde nelere dikkat etmek gerekir özetlemeye çalışalım...<p> <p><b>0-3 yaş dönemi çocuklar:</b></p> <p>Yeni doğan bebekler için bez ve hışırtı sesleri çıkaran, yazısız ya da çok az yazılı kitaplar uygundur. Altıncı aydan itibaren, bebek dünyayı dokunarak keşfetmeye başlar. Bunun için içinde farklı dokuların bulunduğu, “Dokun-Hisset” serisi olarak adlandırılan kitapları tercih edebilirsiniz.</p> <p>1 yaştan itibaren çocuğun dil gelişimiyle beraber, içinde kısa hikayelerin ve her sayfada bir iki cümlenin olduğu kitaplar, çocuğunuz için faydalı olacaktır. 2-3 yaşındaki çocuklar ise dokunarak ve dinleyerek öğrenirler. Hayvanlarla, çocuklarla, yiyeceklerle ve araçlarla ilgili olan kitaplar ilgilerini çeker. Okuduğunuz kitapların içinde onun bildiği nesnelerin olmasına dikkat edin. Renkli ve sevimli karakterler ve kısa cümlelerle anlatılmış masallar, bu dönem çocukların ilgisini çekmektedir.</p> <p><b>3-6 yaş dönemi çocuklar:</b></p> <p>Bu dönemde kısa hikayelerin yanı sıra masalları da okumaya başlayabilirsiniz. Hoşlarına giden bir masalı defalarca dinlemek isteyebilirler, hatta ezbere kendileri de eşlik edebilirler. Siz sıkılmadan her istediklerinde okuyun, çünkü tekrarın öğrenmede etkisi çok büyüktür. Bu yaş dönemindeki çocuklara, içinde rakamların, çocukların ve hayvanların olduğu kitapları okuyabilirsiniz. Bununla beraber okul, aile ve arkadaş temalı masalları da çok severler. Kahramanlara ilgilerinin arttığı bu dönemde, bu tarz kitaplara da çokça ilgi göstereceklerdir.</p> <p>Sık sık kitaptaki karakterlerle ilgili soru sorun, hatta bazen beraber hikayenin sonunu yeniden oluşturun, bu yaratıcı düşünmelerine de yardımcı olacaktır.</p> <p><b>Okul dönemi:</b></p> <p>Okulun ilk yıllarında çocuk hala somut düşünce evresinden tam çıkmış değildir. Çoğunlukla çocuk kahramanların hikayelerinden hoşlanırlar. Doğal yaşam ve hayvanlara olan ilgileri devam eder. Okumayı sökmeleriyle de beraber artık daha çok yazı, daha az resim olan kitapları beğenebilirler.</p> <p>10 yaş civarında gelişmeye başlayan soyut düşünce dahilinde, ilgi alanlarına yönelik kitaplar seçmeye başlarlar. Mizah, macera gibi konulara veya dergilere ilgi gösterebilirler. Kitap seçiminde yaşa uygun olmasının önemli olduğu kadar, çocuğunuzun seçimi de önemlidir, mutlaka buna saygı göstermelisiniz.</p> <p><b>Keyifli okumalar....</b></p> <p><b>Önemli Hatırlatma:</b> <em>Bu içerik ilgili uzman danışman tarafından izleyicilerimizi bilgilendirme amaçlı hazırlanmıştır. Kendinizin veya çocuğunuzun sağlığı ile ilgili her konuda, bir tıp doktoruna veya çocuk eğitimi ve psikolojisi alanında çalışan uzmanlara danışmanızı tavsiye ederiz.</em></p> <div id='drawer_overlay'></div> <div id='disqus_viewport'> <a class='drawer-close' href='javascript:;' title='Kapat'><svg width="20" height="20" fill="#fff" viewBox="0 0 1792 1792"><path d="M1490 1322q0 40-28 68l-136 136q-28 28-68 28t-68-28l-294-294-294 294q-28 28-68 28t-68-28l-136-136q-28-28-28-68t28-68l294-294-294-294q-28-28-28-68t28-68l136-136q28-28 68-28t68 28l294 294 294-294q28-28 68-28t68 28l136 136q28 28 28 68t-28 68l-294 294 294 294q28 28 28 68z"/></svg></a> <div class='drawer-header'><h4>Yorumlar</h4><img alt='Disqus Logo' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVbIW-iGjEQ-1eslZVrgFeYSmzlMeZT1u-KUzBE2ADOPzKBHToMXH59ytzQI9qepn5Dx06W-HBkDA-aHWfuHBXCzsxbpki2YKiZb7Ku-vyN6CuK74XGEAIZyZfRcfQe3tVmgAGYBSXfwdR/s1600/Disqus.png' title='Disqus'/></div> <div class='dsq-widget' id='RecentComments'> <script defer='defer' type='text/javascript'> //<![CDATA[ document.write("<scr" + "ipt type=\"text/javascript\" src=\"https://bloggerekibi.disqus.com/recent_comments_widget.js?num_items=20&hide_mods=0&hide_avatars=0&avatar_size=32&excerpt_length=180\"></scr" + "ipt>"); //]]> </script> </div> </div> <ul id='blogToTop'> <li><a class='ripple_animate' href='#top' title='Yukarı Git'><svg width="16" height="16" viewBox="0 0 1792 1792"><path d="M1683 1331l-166 165q-19 19-45 19t-45-19l-531-531-531 531q-19 19-45 19t-45-19l-166-165q-19-19-19-45.5t19-45.5l742-741q19-19 45-19t45 19l742 741q19 19 19 45.5t-19 45.5z"/></svg></a> </li> <li><a class='viewport-show ripple_animate' href='javascript:;' title='Disqus Yorumları Aç'><svg width="16" height="16" fill="#27a0dc" viewBox="0 0 1792 1792"><path d="M912 1696q0-16-16-16-59 0-101.5-42.5t-42.5-101.5q0-16-16-16t-16 16q0 73 51.5 124.5t124.5 51.5q16 0 16-16zm816-288q0 52-38 90t-90 38h-448q0 106-75 181t-181 75-181-75-75-181h-448q-52 0-90-38t-38-90q50-42 91-88t85-119.5 74.5-158.5 50-206 19.5-260q0-152 117-282.5t307-158.5q-8-19-8-39 0-40 28-68t68-28 68 28 28 68q0 20-8 39 190 28 307 158.5t117 282.5q0 139 19.5 260t50 206 74.5 158.5 85 119.5 91 88z"/></svg></a> </li> <li><a class='ripple_animate' href='#bottom' title='Aşağı Git'><svg width="16" height="16" viewBox="0 0 1792 1792"><path d="M1683 808l-742 741q-19 19-45 19t-45-19l-742-741q-19-19-19-45.5t19-45.5l166-165q19-19 45-19t45 19l531 531 531-531q19-19 45-19t45 19l166 165q19 19 19 45.5t-19 45.5z"/></svg></a></li> </ul> <div id='top'></div> <div id='bottom'></div> <script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script type='text/javascript'> //<![CDATA[ // Blogger blogToTop jQuery(document).ready(function(){var o=220,r=600;jQuery(window).scroll(function(){jQuery(this).scrollTop() > o?jQuery("#blogToTop").fadeIn(r):jQuery("#blogToTop").fadeOut(r)})}); $(function(){$("a[href*=#]:not([href=#])").click(function(){if(location.pathname.replace(/^\//,"")==this.pathname.replace(/^\//,"")&&location.hostname==this.hostname){var t=$(this.hash);if(t=t.length?t:$("[name="+this.hash.slice(1)+"]"),t.length)return $("html,body").animate({scrollTop:t.offset().top},600),!1}})}); // Disqus Comments $(function(){$(".viewport-show").on("click",function(){$("#disqus_viewport").addClass("active").focus()});$(".drawer-close").on("click",function(){$("#disqus_viewport").removeClass("active")})}); $(function(){$(".viewport-show").on("click",function(){$("#drawer_overlay").addClass("active").focus()});$(".drawer-close").on("click",function(){$("#drawer_overlay").removeClass("active")})}); $("#RecentComments a").filter(function(){return this.hostname&&this.hostname!==location.hostname}).attr('rel', 'nofollow noopener').attr('target', '_blank'); //]]> </script> </body> </HTML>
Blog Yazılarına Eklenen Not Bilgileri ve Bağlantı Kodları

Blog Yazılarına Eklenen Not Bilgileri ve Bağlantı Kodları

11/19/2017 0 Yorum
<!DOCTYPE html> <html lang="tr_TR"> <head> <title>Blogger Eklentileri - Kodeks</title> <style type="text/css"> @import url('https://fonts.googleapis.com/css?family=Fira+Sans+Condensed'); body { font-family: 'Fira Sans Condensed', sans-serif; margin: 0; padding: 20px; line-height: 1.6em } p, pre, blockquote, ul, ol, h1, h2, h3, h4, h5, h6 { display: block; margin: 1em 0; padding: 0; margin-top: -17px } div.important_note { background: #f6cece; border-radius: 8px; padding: 15px 15px 10px 15px } div.important_note p { text-indent: 50px; text-align: justify; margin: 0; padding: 0; font-size: 14px; } .tmpl_insp_wrapp { padding: 20px; display: block; text-align: center } .tmpl_insp_wrapp a { border-radius: 4px 4px 4px 4px; color: #fff; cursor: pointer; font-size: 14px; margin: 0 10px; padding: 15px 39px; box-shadow: 1px 1px 1px #999; text-decoration: none } .tmpl_insp_demo { background: #4cb849; } .tmpl_insp_wrapp .tmpl_insp_download, .get_all_insp { background: #6bacf0; } .tmpl_insp_wrapp a:hover, a.buy.this_one:hover, a.get_all_insp:hover { background: #333; color: #fff; } #sales_btn { padding: 20px; display: block; text-align: center; } a.mrDtl, a.buyNow { border-radius: 3px; color: #fff; text-transform: uppercase; font-size: 14px; margin: 11px 5px; padding: 10px 20px; text-decoration: none; } a.mrDtl { background-color: #4CB849; } a.buyNow { background-color: #F15723; } a.mrDtl:hover, a.buyNow:hover { color: #000; background-color: #fff; } a.mrDtl, a.buyNow { -webkit-box-shadow: 0 2px 5px #A2A2A2 inset; -moz-box-shadow: 0 2px 5px #A2A2A2 inset; -ms-box-shadow: 0 2px 5px #A2A2A2 inset; box-shadow: 0 2px 5px #A2A2A2 inset; } </style> </head> <body> <div class="important_note"> <p>Herhangi bir değişiklik yapmadan önce, web sitnizin yedeklemesini mutlaka alın (tema, dosya, klasör ve veri tamanı). İlk önce test web sitesinde yükseltme / günceleme işlemini kontrol edin!<br>Bileşenlerde özel değişiklikleriniz varsa, değişikliklerinizi <u>kaybedebilirsiniz</u>. Lütfen, bu durumda günceleme veya değişiklik yapmayın. Size güncelleme konusunda yardımcı olabilecek herhangi bir yerden teknik destek alın.</p> </div> <br> <div class="tmpl_insp_wrapp"> <a target="_blank" class="tmpl_insp_demo" title="alt başlık" href="#">Bu yayına yapılan yorumlar</a> <a target="_blank" title="alt başlık" href="#" class="tmpl_insp_download">Bağlantı</a> </div> <br> <div id="sales_btn"> <a class="mrDtl" href="#" title="alt başlık" target="_blank">Ön İzleme</a> <a class="buyNow" href="#" title="alt başlık" target="_blank">İndir</a> </div> </body> </html>
Blog Sayfa ve Yayınlarında Kullanılan Butonlar

Blog Sayfa ve Yayınlarında Kullanılan Butonlar

11/19/2017 0 Yorum
<!DOCTYPE html> <html lang="tr_TR"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> @import url('https://fonts.googleapis.com/css?family=Fira+Sans+Condensed'); @import url('https://ar-themes.github.io/fonts/fontawesome.bootstrap-no-glyph.min.css'); body { font-family: 'Fira Sans Condensed', sans-serif; line-height:1.42857; color: #444; background: #f7f7f7 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiC7sErQvfXbpAbnbyL9Xn3aEY2pZ8rKv8-sVNWv0XBYT2qeXb0S1E6vEo8yBBe-lzeEoRYxyHAJBhJfcaHd8iRHQ-lk-j-QsdV0szQSaUAWW_83Xf7uvovx1WFGpysR0ToSRuBmwexhm4/s1600/noise.png) repeat scroll top center; padding: 0; margin:0 } header { margin: 0; padding-bottom: 15px; } header, footer { text-align: center; background: #fff; } footer { clear: both; margin: auto; padding: 10px 0 0; font-size: 14px; display: block; overflow: hidden; position: relative; } .post-body img { border: 3px solid #eee; } img { max-width: 100%; } .row { margin-left: -20px; margin-right: -20px; padding: 0 5px } header a { display: inline-block; } header h1 { text-shadow: 0.5px 0.5px #3A3F47, 1.5px 1.5px #3a3f47; color: #FFBE45; transition: all 0.3s ease-out; font-weight: 700; } footer a { color: #F97413; text-decoration: none; } h1:hover, a:hover { text-decoration: none; } .post-body .row { margin-left: -20px; margin-right: -20px; padding: 0 5px 20px; } .post-body { padding: 20px; border: 1px solid #eee; border-radius: 0; -webkit-box-shadow: 0 0 0; -moz-box-shadow: 0 0 0; box-shadow: 0 0 0; margin-bottom: 20px; margin-top: 20px; background-color: #FFF; } blockquote { display: block; } .alert i { position: absolute; left: 20px; top: 20px; } a { color: #f97413; text-decoration: none; max-width: 100%; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } a:visited { color: #f97413; text-decoration: none; } pre { overflow: hidden; border: none; border-radius: 0 } .alert { position: relative; border: 0; border-radius: 0 } .alert i { position: absolute; left: 20px; top: 20px } .alert p { overflow: hidden; margin: 2px 0 0 30px } .btn { border-radius: 0; margin: 0 5px 5px 0; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s } .btn.active.focus, .btn.active:focus, .btn.focus, .btn.focus:active, .btn:active:focus, .btn:focus { outline: none } a.btn { text-decoration: none !important } .nav-tabs { padding: 0 !important; margin: 0 !important; border: 0 } .nav-tabs > li { margin: 0 !important } .nav-tabs > li > a { margin: 0; border-radius: 0; border: 1px solid #ddd !important; border-right: 0 !important; border-bottom: 0 !important } .nav-tabs > li:last-child > a { border-right: 1px solid #ddd !important } .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover { background: #F97413; color: #fff } .tab-content { border: 1px solid #ddd; padding: 15px } .tooltip.top .tooltip-arrow { border-top-color: #F97413 } .tooltip.right .tooltip-arrow { border-right-color: #F97413 } .tooltip.bottom .tooltip-arrow { border-bottom-color: #F97413 } .tooltip.left .tooltip-arrow { border-left-color: #F97413 } .tooltip-inner { background-color: #F97413 } .panel-group .panel { border-radius: 0; -webkit-box-shadow: 0 0 0; -moz-box-shadow: 0 0 0; box-shadow: 0 0 0 } .panel-group .panel-heading { padding: 0; border-radius: 0 } .panel-group .panel-heading a { padding: 10px 15px; opacity: 1; display: block; text-decoration: none } .panel-group .panel-heading a:hover, .panel-group .panel-heading a:focus { text-decoration: none; opacity: 0.8 } .tooltip.top .tooltip-arrow { border-top-color: #F97413 } .tooltip.right .tooltip-arrow { border-right-color: #F97413 } .tooltip.bottom .tooltip-arrow { border-bottom-color: #F97413 } .tooltip.left .tooltip-arrow { border-left-color: #F97413 } .tooltip-inner { background-color: #F97413 } blockquote footer { text-align: left; } </style> </head> <body> <div class="wrapper"> <header> <a href="https://bloggereklentileri.blogspot.com"> <h1>BLOGGER EKLENTİLERİ</h1> </a> <h3>Blogger eklenti ve tema paylaşım blogu.</h3> </header> <div class="container"> <div class="blog-posts hfeed row"> <div class="full-side col-md-12"> <div class="post hentry inner"> <div class="post-body entry-content"> <h3>Butonlar</h3> <button class="btn btn-default btn-xs">Ekstra Küçük beyaz</button> <button class="btn btn-primary btn-xs">Ekstra Küçük mavi</button> <button type="button" class="btn btn-success btn-xs">Ekstra Küçük yeşil</button> <button type="button" class="btn btn-info btn-xs">Ekstra Küçük açık mavi</button> <button type="button" class="btn btn-warning btn-xs">Ekstra Küçük sarı</button> <button type="button" class="btn btn-danger btn-xs">Ekstra Küçük kırmızı</button> <br> <button class="btn btn-default btn-sm">Küçük beyaz</button> <button type="button" class="btn btn-primary btn-sm">Küçük mavi</button> <button type="button" class="btn btn-success btn-sm">Küçük yeşil</button> <button type="button" class="btn btn-info btn-sm">Küçük açık mavi</button> <button type="button" class="btn btn-warning btn-sm">Küçük sarı</button> <button type="button" class="btn btn-danger btn-sm">Küçük kırmızı</button> <br> <button class="btn btn-default">Normal beyaz</button> <button type="button" class="btn btn-primary">Normal mavi</button> <button type="button" class="btn btn-success">Normal yeşil</button> <button type="button" class="btn btn-info">Normal açık mavi</button> <button type="button" class="btn btn-warning">Normal sarı</button> <button type="button" class="btn btn-danger">Normal kırmızı</button> <br> <button class="btn btn-default btn-lg">Büyük beyaz</button> <button type="button" class="btn btn-primary btn-lg">Büyük mavi</button> <button type="button" class="btn btn-success btn-lg">Büyük yeşil</button> <button type="button" class="btn btn-info btn-lg">Büyük açık mavi</button> <button type="button" class="btn btn-warning btn-lg">Büyük sarı</button> <button type="button" class="btn btn-danger btn-lg">Büyük kırmızı</button> <br> <button class="btn btn-success"> <i class="fa fa-th-list" aria-hidden="true"></i>&nbsp;&nbsp;Beyaz buton</button> <button class="btn btn-danger"> <i class="fa fa-trash-o fa-lg" aria-hidden="true"></i>&nbsp;&nbsp;Sil</button> <button class="btn btn-default"> <i class="fa fa-cog" aria-hidden="true"></i>&nbsp;&nbsp;Ayarlar</button> <hr> <h3>İpuçları</h3> <p> Açıklamalarınızı yazın ve görüntülenmesi için <a data-original-title="Varsayılan ipucu!" href="#" data-toggle="tooltip" title="">ipucu</a> bakabilirsiniz. Açıklamalarınızı yazın ve görüntülenmesi için <a data-original-title="Başka bir ipucu!" href="#" data-toggle="tooltip" title="">ipucu</a> bakabilirsiniz. Açıklamalarınızı yazın ve görüntülenmesi için <a data-original-title="Diğer ipucu!" href="#" data-toggle="tooltip" title="">ipucu</a> bakabilirsiniz. Açıklamalarınızı yazın ve görüntülenmesi için <a data-original-title="Son bir ipucu!" href="#" data-toggle="tooltip" title="">ipucu</a> bakabilirsiniz. </p> <hr> <p class="text-center"> <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="left" title="" data-original-title="İpucu aracı solda"> İpucu aracı solda </button> <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="top" title="" data-original-title="İpucu aracı üstte"> İpucu aracı üstte </button> <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="İpucu aracı altta"> İpucu aracı altta </button> <button type="button" class="btn btn-default" data-toggle="tooltip" data-placement="right" title="" data-original-title="İpucu aracı sağda"> İpucu aracı sağda </button> </p> <hr> <h3>Blockquotes</h3> <blockquote> <p> Blogger Eklentileri özel yeni nesil eklentileri, temaları, CSS, CSS3, HTML, HTML5 Javascript ve JQuery kodları ile blog sitelerinize farklı tasarımlar kazandırmayı amaçlayan, blogger ipuçları hakkında bilgiler paylaşan ve rehberlik yapan kişisel bir blog. </p> <footer> Daha iyi bloglar için faydalı bilgilerin yanı sıra blog sitelerine katkıda bulunmak temel amacımızdır. Teşekkürler. </footer> </blockquote> <hr> <footer> <p>Copyright © 2016 <a href="https://bloggereklentileri.blogspot.com" target="_blank">Blogger Eklentileri</a>. Powered by <a href="https://www.blogger.com" target="_blank">Blogger</a>.</p> </footer> </div> </div> </div> </div> </div> </div> <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js' type='text/javascript'></script> <script src='https://cdn.rawgit.com/jquerycods/0.0.1/master/itemrow.js' type='text/javascript'></script> </body> </html>
Disqus Butonları

Disqus Butonları

11/18/2017 0 Yorum
<!DOCTYPE html> <html> <head> <style> /*<![CDATA[*/ @import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro'); body { font-family: 'Source Sans Pro', sans-serif; } a { text-decoration: none } #rate_link { text-align: center } .rate_link:after { clear: both } a.rate_link { color: #65bc9c; font-size: 14px; border: 2px solid #65bc9c; padding: 8px 24px; margin:10px 6px; display: inline-block; font-weight: 600; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; -webkit-transition: ease background 0.5s; -o-transition: ease background 0.5s; transition: ease background 0.5s } a.link-down { color: #b85252; border-color: #f19595 } a.link-contact { transition: all 0.5s ease!important; background: transparent; color: #3498DB; border: 2px solid #eaeaea; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px } a.rate_link:hover, a.rate_link:focus { background: #65bc9c; color: #fff; text-decoration: none } a.link-down:hover, a.link-down:focus { background: #f19595; color: #fff; text-decoration: none } a.link-contact:hover, a.link-contact:focus { background: transparent; color: #3498DB; border-color: #3498DB } /*]]>*/ </style> </head> <body> <div id="rate_link"> <a class="rate_link link-preview" href="https://bloggereklentileri.blogspot.com" rel="nofollow" target="_blank"> Ön İzleme </a> <a class="rate_link link-down" href="https://bloggereklentileri.blogspot.com" rel="nofollow"> İndir </a> </div> <div id="rate_link"> <a class="rate_link link-contact" href="https://bloggereklentileri.blogspot.com" rel="nofollow" target="_blank"> Bağlantı </a> </div> </body> </html>