Membuat Recent Posts By Label Di Halaman Statis
Penggunaan hidangan pada blog merupakan hal yang umum dan hal ini tentunya memudahkan pengunjung blog menjadi lebih gampang untuk melihat isi hidangan blog Anda. Menu halaman blog biasanya terdiri dari : about, disclaimer, sitemap, contact us, label, dll, tergantung selera dari pengguna blog itu sendiri.
Menu blog untuk menautkan ke halaman kategori atau label konon merupakan hal yang tidak begitu disukai oleh google, apalagi jikalau blog Anda ingin mendaftarkan Adsense. pada umumnya hidangan label pada halaman blog yakni sebagai berikut.
http://www.domainAndadisini.com/search/label/LABEL
Pada artikel kali ini, aku akan share ulang dari blognya kompi aneh wacana alternatif yang sanggup Anda gunakan sebagai pengganti halaman label / kategori pada hidangan dan menyimpannya pada halaman statis. Silahkan ikuti langkah-lengkah berikut ini dengna teliti
Jika Anda ingin mencobanya, silahkan ikuti langkah-langkahnya di bawah ini.
Demikianlah tutorial kali ini wacana cara membuat recent post bay label di halaman statis. jikalau ada yang belum jelas, silahkan layangkan komentar Anda
sumber :
https://bloglandai.blogspot.com/search?q=memasang-multi-recent-posts-di-halaman-statis
https://bloglandai.blogspot.com/search?q=memasang-multi-recent-posts-di-halaman-statis Sumber https://dewaplokis.blogspot.com/
Menu blog untuk menautkan ke halaman kategori atau label konon merupakan hal yang tidak begitu disukai oleh google, apalagi jikalau blog Anda ingin mendaftarkan Adsense. pada umumnya hidangan label pada halaman blog yakni sebagai berikut.
http://www.domainAndadisini.com/search/label/LABEL
Pada artikel kali ini, aku akan share ulang dari blognya kompi aneh wacana alternatif yang sanggup Anda gunakan sebagai pengganti halaman label / kategori pada hidangan dan menyimpannya pada halaman statis. Silahkan ikuti langkah-lengkah berikut ini dengna teliti
Jika Anda ingin mencobanya, silahkan ikuti langkah-langkahnya di bawah ini.
Cara Pertama
Membuat recent post dengan cara yang pertama yakni menempatkan recent postnya diatur langusng dalam HTML theme. Berikut langkah-langkahnya.
1. Langkah Pertama
Silahkan simpan instruksi HTML di bawah ini pada halaman statis atau page dengan mode HTML (ingat, mode HTML bukan Compose). Namun alangkah baiknya jikalau sebelum menyimpan instruksi dibawah ini sebaiknya tulis dahulu judul halaman sesuai dengan label yang akan ditampilkan supaya URL halaman statisnya sesuai dengan judul halaman, alasannya biasanya, sesudah dipublish, muncul link HTML yang angka pada halaman HTMLnya dan aku sering mengalami hal itu sebelum mengetahui triknya wacana mengatasi penambahan angka pada link halaman statis. <div id="result-desc"> </div> <ul id="feed-container"></ul> <div id="feed-nav"> </div> <script type="text/javaScript"> var label="Musik"; </script>Penting!. Perhatikan penulisan label Anda, sesuaikan abjad besar dan kecilnya, karna jikalau salah maka label tidak akan muncul
2. Langkah Kedua
Silahkan simpan instruksi CSS di bawah ini di atas instruksi </head> <b:if cond='data:blog.url == "URL HALAMAN STATIS DI SINI"'> <style type='text/css'> #table-outer{padding:7px 10px;margin:0 auto} #table-outer table{width:auto;margin:0 auto} #table-outer form{font:inherit} #table-outer label{display:block;text-align:right;margin:0 10px 0 0;padding:4px 0 0} #table-outer select[disabled]{opacity:.4} #post-searcher{display:block;margin:0;padding:0} #table-outer input,#table-outer select{width:100%;border:1px solid #dedede;border-radius:5px;margin:0;padding:5px;font-family: Roboto,sans-serif!important;font-size:16px!important;font-weight:500!important;text-transform:capitalize!important;outline:0;color:#333!important;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box} #table-outer select option{min-height:1.4em!important;} #table-outer input#feed-q{padding:5px 10px!important;} #feed-container{background:#fff;display:block;clear:both;margin:0;padding:0;list-style:none;overflow:hidden;position:relative;border-top:none} #feed-container li{list-style:none;margin:0;padding:0;border-top:1px solid #eee;color:#555;width:auto;float:left;display:inline} #feed-container li .inner{margin:15px 0;height:auto;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis} #feed-container li a{text-decoration:none;color:#2C2C2C;font-weight:500} #feed-container li a:hover{text-decoration:none;color:#E94141} #feed-container li .news-text{margin-top:5px;line-height:1.3em!important} #feed-container li img{margin:0 15px 5px 0;padding:7px 7px 7px 0;float:left;display:block;} #result-desc{margin:0;padding:0;} #result-desc div,#result-desc span{display:block;margin:0;padding:5px 0 7px;color:#D64D52} #result-desc div{color:inherit} #feed-nav{margin:10px 0 30px;text-align:center;font-weight:500} #feed-nav a,#feed-nav span{border:1px solid #dedede;border-radius:5px;padding:0;color:#757575;text-decoration:none;display:block;height:30px;line-height:32px} #feed-nav a,#feed-nav span:hover{color:#1B1B1B} #feed-nav a:active,#feed-nav a:hover{color:#555} #feed-nav span{cursor:wait} @media (max-width:600px){#table-outer table{margin:0 auto;width:100%} #feed-container,#table-outer{margin:0 auto} #feed-container li .inner{margin:5px auto;height:auto} #feedContainer li{float:none;display:block;width:auto;height:auto} #feed-container li .news-text, #feedContainer:after,#feed-container li img{display:none!important} } .post-body{min-height:300px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinyk09IJ-IcQOGXvqkvqN2d32E4i39M0zW1mMy4qAwJflWrncWK2trsSIKb1BxqQPI9WVZPJFOFdjkHaBdQ1EQ7lcSVR-n8jHQt9oXrREeLxefTitFF0He4k-r9Ex7om9Kjo0aSLe-j9A/w220-h19-no/ajax-loader+%25281%2529.gif)50% 50% no-repeat!important;} </style> </b:if><b:if cond='data:blog.url == "URL HALAMAN STATIS DI SINI"'><b:if cond='data:blog.url in {"URL HALAMAN STATIS DI SINI" , "URL HALAMAN STATIS DI SINI" , "URL HALAMAN STATIS DI SINI"}'>3. Langkah Ketiga
Silahkan simpan instruksi javascript di bawah ini di atas instruksi </body>. Untuk conditional tag-nya silahkan samakan dengan conditional tag untuk CSS pada langkah kedua di atas.<b:if cond='data:blog.url == "URL HALAMAN STATIS DI SINI"'> <script type='text/javascript'> //<![CDATA[ document.write;var loadToc,loadCategories,_toc={init:function(){var e={homePage:"http://"+window.location.hostname,maxResults:10,numChars:270,thumbWidth:140,thumbHeight:95,navText:"Tampilkan artikel selanjutnya ▼",resetToc:"Kembali ke Awal",noImage:"http://2.bp.blogspot.com/-11FkySHGB5Y/TpZ6SSbsF2I/AAAAAAAAA94/zK10UaL7jgo/s1600/images.jpeg",loading:"<span>Memuat...</span>"},t=(window,document),n=function(e){return t.getElementById(e)},a={e:n("result-desc"),f:n("feed-container"),g:n("feed-nav"),h:t.getElementsByTagName("head")[0],i:0,j:null,k:"published",l:0,m:""},l={a:function(){old=n("temporer-script"),old.parentNode.removeChild(old)},b:function(e){var i=t.createElement("script");i.type="text/javascript",i.id="temporer-script",i.src=e,n("temporer-script")&&l.a(),a.h.appendChild(i)},c:function(t,n,i){a.i++,a.e.innerHTML=e.counting,a.g.innerHTML=e[1==t?"searching":"loading"],0===t?l.b(null!==n?e.homePage+"/feeds/posts/summary/-/"+n+"?alt=json-in-script&start-index="+(a.i*e.maxResults+1)+"&max-results="+e.maxResults+"&orderby="+i+"&callback=loadToc":e.homePage+"/feeds/posts/default/-/"+label+"?alt=json-in-script&start-index="+(a.i*e.maxResults+1)+"&max-results="+e.maxResults+"&orderby="+i+"&callback=loadToc"):1==t&&l.b(e.homePage+"/feeds/posts/default/-/"+label+"?alt=json-in-script&start-index="+(a.i*e.maxResults+1)+"&max-results="+e.maxResults+"&q="+n+"&orderby="+i+"&callback=loadToc"),a.j=null!==n?n:null,a.l=t,a.a.disabled=!0,a.b.children[0].disabled=!0},d:function(n){var i;if(a.g.innerHTML="",a.e.innerHTML="<div>Total: "+n.feed.openSearch$totalResults.$t+" Posts</div>","entry"in n.feed){for(var r,s,o,d,c=n.feed.entry,u="0 Komentar",m=0;m<e.maxResults&&m!=c.length;m++){r=c[m].title.$t,o="summary"in c[m]?c[m].summary.$t.replace(/<br ?\/?>/gi," ").replace(/<(.*?)>/g,"").replace(/<iframe/gi,"").substring(0,e.numChars):"",d="media$thumbnail"in c[m]?c[m].media$thumbnail.url.replace(/\/s[0-9]+\-c/,"/s"+e.thumbWidth):e.noImage.replace(/\/s[0-9]+\-c/,"/s"+e.thumbWidth);for(var h=0,b=c[m].link.length;b>h;h++)s="alternate"==c[m].link[h].rel?c[m].link[h].href:"#";for(var p=0,g=c[m].link.length;g>p;p++)if("replies"==c[m].link[p].rel&&"text/html"==c[m].link[p].type){u=c[m].link[p].title;break}i=t.createElement("li"),i.innerHTML='<div class="inner"><img style="width:'+e.thumbWidth+"px;height:"+e.thumbHeight+'px;" src="'+d+'" alt="Penggunaan hidangan pada blog merupakan hal yang umum dan hal ini tentunya memudahkan pengunju Membuat Recent Posts by Label Di Halaman Statis"><a class="toc-title" href="'+s+'" target="_blank" title="Membuat Recent Posts by Label Di Halaman Statis">'+r+'</a><div class="news-text">'+o+'…<br style="clear:both;"></div></div>',a.f.appendChild(i)}i=t.createElement("a"),i.href="#load-more",i.innerHTML=e.navText,i.onclick=function(){return l.c(a.l,a.j,a.k),!1}}else i=t.createElement("a"),i.href="#reset-content",i.innerHTML=e.resetToc,i.onclick=function(){return a.i=-1,a.e.innerHTML=e.counting,a.f.innerHTML="",l.c(0,null,"published"),a.a.innerHTML=a.a.innerHTML,a.b.children[0].innerHTML=a.b.children[0].innerHTML,!1};a.g.appendChild(i),a.a.disabled=!1,a.b.children[0].disabled=!1}};loadToc=l.d,loadCategories=l.e,l.b(e.homePage+"/feeds/posts/default/-/"+label+"?alt=json-in-script&start-index="+(a.i+1)+"&max-results="+e.maxResults+"&orderby=published&callback=loadToc"),l.b(e.homePage+"/feeds/posts/default/-/"+label+"?alt=json-in-script&max-results=0&orderby=published&callback=loadCategories"),a.a.onchange=function(){a.i=-1,a.f.innerHTML="",a.g.innerHTML=e.counting,a.b.children[0].innerHTML=a.b.children[0].innerHTML,l.c(0,null,this.value),a.k=this.value},a.c.onsubmit=function(){return a.i=-1,a.f.innerHTML="",a.m=a.d.value,l.c(1,a.d.value,a.k),!1}}};_toc.init(); //]]> </script> </b:if>Cara kedua
Cara keduanya dengan menerapkan pribadi di halaman statis. silahkan check dahulu di template Anda, apakah sudah terdapat instruksi dibawah ini, Jika belum, copy dan pastekan diatas </head><link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css' rel='stylesheet'/>instruksi link font awesome diatas diabaikan saja jikalau sudah ada pada template AndaBuka page kemudian klik new page kemudian klik HTML (bukan compose), kemudian pastekan instruksi berikut
<style scoped="scoped" type="text/css"> /* Multi Recent Post */ .post-body *,.post-body *:after,.post-body *:before{box-sizing:initial;-webkit-box-sizing:initial;-moz-box-sizing:initial;} .list-entries{display:table;background:#fdfdfd;margin:1.5% 1%;width:31.3%;float:left;font-size:80%;} .list-entries ul,.list-entries li{margin:0;list-style:none} #feed-list-container ul li{background:#fdfdfd;padding:15px;line-height:normal;border:1px solid #eee;border-top:0;transition:all .3s;} #feed-list-container ul li:hover{background:#fff;} #feed-list-container ul li:last-child{border-bottom:0;} .list-entries .main-title{padding:0;overflow:hidden;} .list-entries .main-title h4{position:relative;display:block;font:inherit;font-weight:700;padding:1em 1.5em;background-color:#4f93c5;color:#fff;margin:0;line-height:normal;font-size:120%;margin-top:0!important} .list-entries .main-title h4:after{display:inline-block;content:"\f02c";font-family:fontAwesome;font-size:17.4px;font-style:normal;background-color:#4384b3;color:#fff;top:0;right:0;padding:1em 1.25em;position:absolute;font-weight:400} .list-entries .title a{font-size:13px;text-decoration:none;line-height:.5em;color:#333;font-weight:700;transition:all .3s;} .list-entries .title a:hover{color:#4f93c5} .list-entries img,.list-entries .fake-img{border:none;background-color:#333;margin:0 1em 0 0;padding:0;float:left} .list-entries .summary{overflow:hidden;color:#999} .list-entries .more-link{border-bottom:none;} .list-entries .more-link a{display:block;line-height:2em;height:2em;overflow:hidden;text-decoration:none;background-color:#444;padding:1em 1.5em;position:relative;font-weight:400;color:#fff;transition:all .3s;} .list-entries .more-link a:hover{background-color:#f97e76;color:#fff;} .list-entries .more-link a:after{display:inline-block;content:"\f054";font-family:fontAwesome;font-size:16.4px;font-style:normal;background-color:#333;color:#ccc;top:0;right:0;padding:1em 1.25em;position:absolute;font-weight:400;transition:all .3s;} .list-entries .more-link a:hover:after{background-color:#ea726a;color:#fff;} .widget .post-body ul, .widget .post-body ol {position:relative;} @media (max-width:640px){ .list-entries {width:100%;} .list-entries{margin:2.5% 1%;}} </style> <div id="feed-list-container"> </div> <div style="clear:both;"> </div> <script type="text/javascript"> var multiFeed = { feedsUri: [ { name: "JUDUL LABEL", url: "URL-BLOG", tag: "NAMA LABEL" }, { name: "JUDUL LABEL", url: "URL-BLOG", tag: "NAMA LABEL" }, { name: "JUDUL LABEL", url: "URL-BLOG", tag: "NAMA LABEL" } ], numPost: 4, showThumbnail: true, showSummary: false, summaryLength: 0, titleLength: "auto", thumbSize: 72, containerId: "feed-list-container", readMore: { text: "Selengkapnya", endParam: "?max-results=5" } }; </script> <script src="https://cdn.rawgit.com/dewaplokis/multi-feed/4f8888a3/multi-feed.js" type="text/javascript"></script>Ganti "JUDUL LABEL", "URL-BLOG" dan "NAMA LABEL" sesuai dengan milik AndaCari ini sudah aku terapkan pada halaman statis aku dan aku terapkan sebagai pengganti sitemap. silahkan lihat alhasil disini https://bloglandai.blogspot.comp/sitemap.html
Demikianlah tutorial kali ini wacana cara membuat recent post bay label di halaman statis. jikalau ada yang belum jelas, silahkan layangkan komentar Anda
sumber :
https://bloglandai.blogspot.com/search?q=memasang-multi-recent-posts-di-halaman-statis
https://bloglandai.blogspot.com/search?q=memasang-multi-recent-posts-di-halaman-statis Sumber https://dewaplokis.blogspot.com/