SIDOBEY

Cara Membuat Feature Post Keren di Blog Blogger

ADS GOOGLE
» » Cara Membuat Feature Post Keren di Blog Blogger

Cara Membuat Feature Post Keren di Blog Blogger

D2Ubed Agustus 15, 2019 0 komentar
Short URL:
Hallo sobat blogger Kali ini sidobey akan berbagi trik bagaimana cara membuat ataupun memasang Feature Post yang keren di blog,Feature Post Merupakan salah satu Feature Yang menampilkan Suatu Postingan Post yang baru atau Postingan Andalan yang berada di bagian Sidebar atau Widget
Dan kali ini Pun saya akan berbagi trik cara membuat atu memasang Feature Post yang di sertai dengan deretan Gambar yang mearik di bagian blog khusus di sidebar atu Widget Blog,
Feature post ini sering kita temui di situs2 besar yang menampilkan Berita atau Headline yang di recomendasikan oleh pemilik situs tersebut

Cara Memasang Feature Post Keren di Blog

Untuk anda yang tertarik dengan Feature Post Tersebut,dapat anda Coba untuk memasang Feature post tersebut di blog sobat dengan mengikuti langkah-langkah di bawah ini
  • Silahkan Masuk ke akun blogger SObat
  • Setelah itu pilih Blog sobat
  • Kemudian Masuk Thema lalu Edit Html
  • Setelah berada di bagian Edit Html kemudian silahkan anda letakan kode di bawah tepat sebelum kode <head>
<b:if cond="data:view.isHomepage">
<style type="text/css">
/* Featured Post by sidobey.com */
*,*:before, *:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.featured_namiwrap{display:inline-block;width:100%;<span style="color: rgb(243, 243, 243);"><span style="background-color: rgb(255, 0, 0);">max-width:1070px</span></span>;margin:0 auto 20px auto;overflow:hidden;max-height:410px}.featured_sidobey{display:block;position:relative;float:left;overflow:hidden;height:410px}.featured_sidobey.first{width:44.7%;margin-right:1px}.featured_sidobey.second{width:25%;margin-right:1px}.featured_sidobey.third,.featured_sidobey.fourth{width:30%;height:205px}.featured_sidobey.third{margin-bottom:1px}.featured_sidobey a{display:block;color:rgb(255,255,255);position:relative;vertical-align:bottom;z-index:1;height:100%}.featured_sidobey a:before{width:100%;height:100%;position:absolute;content:'';background:linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,.8) 100%);opacity:.7;z-index:2;transition:all .6s}.featured_sidobey:hover a:before{opacity:1}.featured_sidobey a .blog_contents{display:block;position:absolute;z-index:5;bottom:15px;left:15px;right:15px;letter-spacing:-1px;text-transform:uppercase;line-height:120%;transition:all 0.2s}.featured_namiwrap span{color:#fff;padding:3px 6px;letter-spacing:0;font-size:12px;line-height:1;border-radius:3px;text-transform:capitalize;box-shadow:0 2px 5px rgba(0,0,0,0.2)}.featured_sidobey.first span{background:#679e37}.featured_sidobey.second span{background:#f8a724}.featured_sidobey.third span{background:#029ae4}.featured_sidobey.fourth span{background:#e53935}.featured_sidobey a .blog_contents h3{color:#fff;margin-top:15px;font-size:16px;line-height:normal;font-weight:normal;letter-spacing:-0.4px;text-transform:none;text-shadow:none}.featured_sidobey a .blog_contents h3:hover{text-decoration:underline}.featured_sidobey.first a .blog_contents h3{font-size:22px}.featured_sidobey .feat-img{width:100%;height:100%;background-size:cover;background-position:50%;-webkit-backface-visibility:hidden;transition:all .3s}.featured_sidobey:hover .feat-img{transform:rotate(-3deg) scale(1.2);-webkit-filter:blur(2px);filter:blur(2px)}
@media only screen and (max-width:768px){
.featured_namiwrap{max-height:initial}.featured_sidobey.second,.featured_sidobey.first,.featured_sidobey.third,.featured_sidobey.fourth{width:100%;height:300px;margin:0;margin-bottom:1px}.featured_sidobey a .blog_contents{left:15px;right:15px;bottom:10px}.featured_sidobey.first a .blog_contents h3,.featured_sidobey a .blog_contents h3{font-size:20px}}
</style>
<script type="text/javascript">
//<![CDATA[
// Featured post by sidobey.com
function recentposts1(e){j=showRandomImg?Math.floor((imgr.length+1)*Math.random()):0,img=new Array,numposts1<=e.feed.entry.length?maxpost=numposts1:maxpost=e.feed.entry.length,document.write('<div class="featured_namiwrap">
');for(var t=0;t<maxpost;t++){var i,n=e.feed.entry[t],r=n.title.$t,l=n.category[0].term;newsize;if(t==e.feed.entry.length)break;for(var o=0;o<n.link.length;o++)if("alternate"==n.link[o].rel){i=n.link[o].href;break}for(o=0;o<n.link.length;o++)if("replies"==n.link[o].rel&&"text/html"==n.link[o].type){n.link[o].title.split(" ")[0];break}if("content"in n)var g=n.content.$t;else if("summary"in n)g=n.summary.$t;else g="";postdate=n.published.$t,j>imgr.length-1&&(j=0),img[t]=imgr[j],s=g,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[t]=d);for(var m=[1,2,3,4,5,6,7,8,9,10,11,12],f=["Oca","Şub","Mar","Nis","May","Haz","Tem","Ağu","Eyl","Eki","Kas","Ara"],p=(postdate.split("-")[2].substring(0,2),postdate.split("-")[1]),u=(postdate.split("-")[0],0);u<m.length;u++)if(parseInt(p)==m[u]){p=f[u];break}if(0==t){var v='<div class="featured_sidobey first">
<a href="'+i+'"><div class="blog_contents">
<span>'+l+"</span><h3>
"+r+'</h3>
</div>
<div class="feat-img" style="background-image:url('+img[t]+');">
</div>
</a></div>
';document.write(v)}if(1==t){v='<div class="featured_sidobey second">
<a href="'+i+'"><div class="blog_contents">
<span>'+l+"</span><h3>
"+r+'</h3>
</div>
<div class="feat-img" style="background-image:url('+img[t]+');">
</div>
</a></div>
';document.write(v)}if(2==t){v='<div class="featured_sidobey third">
<a href="'+i+'"><div class="blog_contents">
<span>'+l+"</span><h3>
"+r+'</h3>
</div>
<div class="feat-img" style="background-image:url('+img[t]+');">
</div>
</a></div>
';document.write(v)}if(3==t){v='<div class="featured_sidobey fourth">
<a href="'+i+'"><div class="blog_contents">
<span>'+l+"</span><h3>
"+r+'</h3>
</div>
<div class="feat-img" style="background-image:url('+img[t]+');">
</div>
</a></div>
';document.write(v)}j++}document.write("</div>
")}imgr=new Array,imgr[0]="data:image/gif;base64,R0lGODlhAQABAIAAAPHx8AAAACH5BAEAAAAALAAAAAABAAEAQAICRAEAOw==",showRandomImg=!0,aBold=!0,numposts1=4,numposts11=1,newsize=400;
//]]>
</script></b:if>
  • Kemudian Silahkan Save Template
Silahkan anda perhatikan kode yang sudah di tandai warna merah mx-widt:1070px sesuaikan dengan Lebar template anda,dan pastikan di template anda sudah terpasang jQuery Library
  •  Selanjut nya tambahkan MarkUp dari widget Feature Post ini tempatkan sesuai dengan keinginan anda selama masih di dalam bodi antara dan </body>
<b:if cond="data:view.isHomepage">
<div class="featured_sidobeyz" id="featured_namiwrap">
<div class="ct-wrapper">
<script>
document.write("<script src=\"/feeds/posts/default?max-results="+numposts1+"&orderby=published&alt=json-in-script&callback=recentposts1\"><\/script>");
</script></div>
</div>
</b:if>
  • Dan Save template lihat hasil nya
Nah itulah cara memasang Feature Post Keren di blog cukup Mudah Bukan semoga artikel ini bisa membantu sobat blogger semua,selamat mencoba

Posted by D2Ubed, Published at Agustus 15, 2019 and have 0 komentar
D2Ubed

I manage this blog and post tutorials related to Blogger, SEO, Software Tools, Windows, CSS and Social Media. Did you find this blog helpful? Please socialize with us !!


Advertisement

IKLAN DISINI