Teknoox blogger temalarının sonuncusu olan Teknooxigniel teması ile karşınızdayım. İgniel blogger temasının tasarım olan Teknooxigniel teması Wordpersste kullanılan temalardan bir eksiği olmayan çok farklı alanlarda paylaşım yapan blogcular için oldukça ideal bir tema. Blogger temasının diğer bir tasarımda yaptığım değişiklikler sonucunda tek bir renk kodunu değiştirerek tasarıma istediğiniz rengi verebiliyor oluşunuzdur.
Tema Ayarları:
Temada kullanabileceğiniz üç farklı tarzda slayder manşet eklentisi. Tasarımlarda istediğinizi resimde gösterilen yere Gadget Olarak ekleyiniz ve kodlardaki https://teknoox.blogspot.com urlsini kendin url adresinizle değiştirin.
Manşet-1
<div class='featured_stz' id='featured_stwrap'>
<div class='ct-wrapper'>
<!--Unlabeled-->
<script>
document.write("<script src=\"https://teknoox.blogspot.com//feeds/posts/default?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=recentposts1\"><\/script>");
</script>
</div>
</div>
Manşet-2
<style>
body {
background: #f8f8f8;
color: #000;
font-family: 'Poppins',sans-serif;
font-size: 16px;
padding: 0;
margin: 0;
font-weight: normal;
}
a{text-decoration:none}
/* Featured Post */
#featured-posx-section{max-height:380px;overflow:hidden;margin:20px auto 0 auto}.featured-posx a{font-size:1em;color:#fff}.featured-posx a:hover{color:#fff}.main-post.featured-posx a{margin:0;font-size:17px}.featured-posx .col-post{float:left;position:relative;overflow:hidden;margin:0 10px 0 0;border-radius:5px}.featured-posx .secondary-post{width:31.5%;margin:0 0 10px 0;animation:moccaShine 1.25s linear infinite;background:#f5f5f5 linear-gradient(to right,rgba(255,255,255,0) 5%,rgba(255,255,255,.75) 20%,rgba(255,255,255,0) 30%);background-size:800px 100px;transition:all .4s}.featured-posx .secondary-post:nth-child(even){margin:0 10px 10px 0!important}.featured-posx .main-post{width:34.9%;padding:0;animation:moccaShine 1.25s linear infinite;background:#f5f5f5 linear-gradient(to right,rgba(255,255,255,0) 5%,rgba(255,255,255,.75) 20%,rgba(255,255,255,0) 30%);background-size:800px 100px;transition:all .4s}.featured-posx span{background:rgba(20,20,20,.85);color:#fff;font-style:normal;font-weight:600;position:absolute;font-size:11px;line-height:1.4;padding:3px 10px;top:10px;left:10px;z-index:3;border-radius:3px;opacity:0;visibility:hidden;transform:scale(0.5);transition:all .4s}#featured-posx-section:hover span{opacity:1;visibility:visible;transform:scale(1.0)}.featured-posx .main-post:hover span,.featured-posx .secondary-post:hover span{background:#f39c12;color:#fff}.featured-posx img{height:100%;transition:all .5s}.featured-posx .main-post img{height:380px;width:100%;object-fit:cover}.featured-posx .secondary-post img{height:185px;object-fit:cover;width:100%}.featured-posx .main-post:hover img,.featured-posx .secondary-post:hover img{backface-visibility:hidden;transform-style:preserve-3d}.featured-posx header{display:inline-block;position:absolute;background:rgba(40,40,40,.3);top:0;bottom:0;opacity:1;visibility:visible;left:0;right:0;padding:0;z-index:2;transition:all .4s}.featured-posx header:hover{background:rgba(40,40,40,.7)}.featured-posx .main-post h3,.featured-posx .secondary-post h4{position:absolute;bottom:5px;left:5px}.featured-posx .secondary-post h4{position:absolute;bottom:0;left:0}.featured-posx .main-post:hover h3,.featured-posx .secondary-post:hover h4{}.featured-posx .secondary-post header{padding:0}.featured-posx header h3{font-size:20px;margin:0}.featured-posx h4{font-size:14px;margin:0}.featured-posx header h3 a,.featured-posx header h4 a{display:block;padding:10px}.featured-posx .main-post:hover h3 a,.featured-posx .secondary-post:hover h4 a{color:#fff}.featured-posx .secondary-post:nth-child(4) span{transition-delay:.2s}.featured-posx .secondary-post:nth-child(5) span{transition-delay:.4s}.featured-posx .secondary-post:nth-child(6) span{transition-delay:.6s}.featured-posx .secondary-post:nth-child(7) span{transition-delay:.8s}.featured-posx:hover .secondary-post:nth-child(4) span,.featured-posx:hover .secondary-post:nth-child(5) span,.featured-posx:hover .secondary-post:nth-child(6) span,.featured-posx:hover .secondary-post:nth-child(7) span{transition-delay:initial}
@media screen and (max-width:768px){
#featured-posx-section{margin:0 auto}.featured-posx .main-post{width:100%;border-radius:0}.featured-posx .secondary-post.col-post{display:none}}
@media screen and (max-width:640px){
#featured-posx-section{max-height:240px}.featured-posx .main-post img{height:240px}
</style>
<script>
//< * Math['random']()) : 0, img = new Array, numposts1 <= _0x5fd3x2['feed']['entry']['length'] ? maxpost = numposts1 : maxpost = _0x5fd3x2['feed']['entry']['length'];
for (var _0x5fd3x3 = 0; _0x5fd3x3 < maxpost; _0x5fd3x3++) {
var _0x5fd3x5, _0x5fd3x7, _0x5fd3x8 = _0x5fd3x2['feed']['entry'][_0x5fd3x3],
_0x5fd3x9 = _0x5fd3x8['category'][0]['term'],
_0x5fd3xa = _0x5fd3x8['title']['$t'];
if (_0x5fd3x3 == _0x5fd3x2['feed']['entry']['length']) {
break
};
for (var _0x5fd3xb = 0; _0x5fd3xb < _0x5fd3x8['link']['length']; _0x5fd3xb++) {
if ('alternate' == _0x5fd3x8['link'][_0x5fd3xb]['rel']) {
_0x5fd3x7 = _0x5fd3x8['link'][_0x5fd3xb]['href'];
break
}
};
for (var _0x5fd3xb = 0; _0x5fd3xb < _0x5fd3x8['link']['length']; _0x5fd3xb++) {
if ('replies' == _0x5fd3x8['link'][_0x5fd3xb]['rel'] && 'text/html' == _0x5fd3x8['link'][_0x5fd3xb]['type']) {
_0x5fd3x5 = _0x5fd3x8['link'][_0x5fd3xb]['title']['split'](' ')[0];
break
}
};
if ('content' in _0x5fd3x8) {
var _0x5fd3xc = _0x5fd3x8['content']['$t']
} else {
if ('summary' in _0x5fd3x8) {
var _0x5fd3xc = _0x5fd3x8['summary']['$t']
} else {
var _0x5fd3xc = ''
}
};
postdate = _0x5fd3x8['published']['$t'], j > imgr['length'] - 1 && (j = 0), img[_0x5fd3x3] = imgr[j], s = _0x5fd3xc, a = s['indexOf']('<img'), b = s['indexOf']('src="', a), c = s['indexOf']('"', b + 5), d = s['substr'](b + 5, c - b - 5), -1 != a && -1 != b && -1 != c && '' != d && (img[_0x5fd3x3] = d);
for (var _0x5fd3xd = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12], _0x5fd3xe = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], _0x5fd3xf = (postdate['split']('-')[2]['substring'](0, 2), postdate['split']('-')[1]), _0x5fd3x10 = (postdate['split']('-')[0], 0); _0x5fd3x10 < _0x5fd3xd['length']; _0x5fd3x10++) {
if (parseInt(_0x5fd3xf) == _0x5fd3xd[_0x5fd3x10]) {
_0x5fd3xf = _0x5fd3xe[_0x5fd3x10];
break
}
};
if (0 == _0x5fd3x3) {
var _0x5fd3x11 = '<div class="main-post col-post"><a href="' + _0x5fd3x7 + '"><span class="blue">' + _0x5fd3x9 + '</span><img src="' + img[_0x5fd3x3] + '" height="340" width="640" alt=""></img></a><header><h3 class="entry-title"><a href="' + _0x5fd3x7 + '" title="">' + _0x5fd3xa + '</a></h3></header></div>';
document['write'](_0x5fd3x11)
} else {
var _0x5fd3x11 = '<div class="secondary-post col-post" style="margin-right:0"><span class="blue">' + _0x5fd3x9 + '</span><a class="hover_play_small" href="' + _0x5fd3x7 + '"><img src="' + img[_0x5fd3x3] + '" height="200" width="320"></img></a><header><h4><a href="' + _0x5fd3x7 + '">' + _0x5fd3xa + '</a></h4></header></div>';
document['write'](_0x5fd3x11)
};
j++
}
}
imgr = new Array, imgr[0] = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgPOuQv5TfMaAQvhdvwWLRRzIsoV9fc57Tau6N8rclBJ0wuaLCZgBLVuYbQbzJqIvn0Uj6eL2atZOrQEVCWhKjYj98lm12I-AnhhpWEJpKIgrlJBn-5EEqfWi9y0-h8zMae5LSw_Sugo40/s1600/no_thumbnail2.jpg', showRandomImg = !0, aBold = !0, summaryPost = 150, summaryTitle = 50, numposts1 = 10, featured_numposx = '50'
//]]>
</script>
<div class='ct-wrapper' id='featured-posx-section'>
<div class='featured-posx padding clearfix'>
<script type='text/javaScript'>
document.write("<script src=\"https://teknoox.blogspot.com//feeds/posts/default/?max-results="+featured_numposx+"&orderby=published&alt=json-in-script&callback=slderposx\"><\/script>");
</script>
</div>
</div>
Son Yazılar Akış Eklentisi
<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'>
<style>
#breakingwrapper{background:#00838F;color:#fff;display:block;margin:0 20px 20px 20px;overflow:hidden}#breakingnews{width:100%;max-width:990px;display:block;margin:0 auto;line-height:36px;height:36px;overflow:hidden;font-size:13px;padding:0}#breakingnews .tulisbreaking{color:#fff;display:block;padding:0 12.5px;font-size:13px;font-weight:normal;height:36px;line-height:36px;float:left;text-align:center;border-right:1px solid rgba(255,255,255,0.1)}#recentbreaking{float:left;margin:0 0 0 15px;font-size:13px;color:#fff}#recentbreaking ul,#recentbreaking li{list-style:none;margin:0;padding:0}#recentbreaking li a{color:#fff;text-decoration: none;transition: all .3s}#recentbreaking li a:hover{color:rgba(255,255,255,.7)}.blog-date{display:inline-block;float:right;margin:0 15px 0 0;font-size:13px;border-radius:2px;cursor:pointer}#breakingnews .tulisbreaking i{margin:0 5px 0 0;font-family:fontawesome;color:#fff}
@media only screen and (max-width:768px){
#breakingwrapper{margin: 0 0 20px 0}#breakingnews{padding:0 10px 0 0}#recentbreaking{text-align:center;float:none;margin:0 auto}#breakingnews .tulisbreaking i{margin:0}#breakingnews .tulisbreaking .breakhidden,#breakingnews .tulisbreaking{display:none}}
</style>
<div id='breakingwrapper'>
<div id='breakingnews'>
<span class='tulisbreaking'><i class='fa fa-circle-o-notch fa-spin fa-fw'></i><span class='breakhidden'></span></span>
<div id='recentbreaking'>Fetching data...</div>
<div class='blog-date'>
<script language='Javascript'>
var dayName = new Array("Pazar", "Pazartesi", "Salı", "Çarşamba", "Perşembe", "Cuma", "Cumartesi");
var monName = new Array("Ocak", "Şubat", "Mart", "Nisan", "Mayıs", "Haziran", "Temmuz", "Ağustos", "Eylül", "Ekim", "Kasım", "Aralık");
var now = new Date();
document.write("" + " " + dayName[now.getDay()] + "," + " " + now.getDate() + " " + monName[now.getMonth()] + "");
</script>
</div>
</div>
</div>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js'></script>
<script>
//<![CDATA[
$(document).ready(function(){var e="https://teknoox.blogspot.com/",t=10;$.ajax({url:""+e+"/feeds/posts/default?alt=json-in-script&max-results="+t,type:"get",dataType:"jsonp",success:function(e){function t(){$("#recentbreaking li:first").slideUp(function(){$(this).appendTo($("#recentbreaking ul")).slideDown()})}var n,r,a="",i=e.feed.entry;if(void 0!==i){a="<ul>";for(var l=0;l<i.length;l++){for(var s=0;s<i[l].link.length;s++)if("alternate"==i[l].link[s].rel){n=i[l].link[s].href;break}r=i[l].title.$t,a+='<li><a href="'+n+'" target="_blank">'+r+"</a></li>"}a+="</ul>",$("#recentbreaking").html(a),setInterval(function(){t()},5e3)}else $("#recentbreaking").html("<span>There nothing here?</span>")},error:function(){$("#recentbreaking").html("<strong>Error Loading Feed!</strong>")}})});
//]]>
</script>
Butonlar:
<a href="https://www.google.com"><button class="download">Download</button></a>
<a href="https://www.google.com"><button class="demo">Demo</button></a>
Kod Kutusu:
<pre><code>KODLAR BURAYA</code></pre>
Temayı sahip olmak istiyorsanız e posta adresini yorum olarak bırakınız.
Diğer Yayınlar