Featured Post Random Dengan Label
Tutorial kali ini aku akan membahas perihal cara menciptakan Featured Post Random Dengan Label diblogger, postingan kali ini mungkin akan mempunyai kegunaan untuk kalian yang mempunyai blog dengan niche fansub atau fanshare anime.
Tutorial kali ini berbeda dengan yang sebelumnya aku buat adalah cara menciptakan Ongoing List Anime Auto Index, pada post kali ini aku akan menciptakan Featured Post Random Dengan Label dengan text atau tag menyerupai screenshoot diatas. sebelum kita mulai silahkan cek pratinjau yang sudah jadi dibawah ini.
Cara Membuat Featured Post Random Dengan Label
- Buka Blogger > Tema > Edit HTML, kemudian cek javascript berikut diatas </head> sudah ada atau belum?, kalau sudah ada abaikan
- Simpan javascript berikut diatas </body> atau <!--</body>--></body>
- Carilah </style> kemudian simpan CSS berikut diatasnya
- Jika sudah save Tema.
- Buka Tata Letak > Tambahkan Widget > HTML/Javascript, simpan javascript berikut diwidget tersebut
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js' type='text/javascript'/><b:if cond='data:blog.pageType != "item" and data:blog.pageType != "static_page"'> <script type="text/javascript"> $('#rdm_arleth98 img').each(function(){$(this).attr('src',$(this).attr('src').replace(/\/s[0-9]+(\-c)?\//,'/w150-h195-c/'))}); </script> </b:if>/* CSS Random Post With Text Status by Arlethdesign ================================================ */ .cover #rdm_arleth98 img{margin:0;padding:0;width:150px;height: 195px;overflow:hidden} .cover ul#rdm_arleth98 h2{color: #fff;bottom: -10px;background: rgba(17,17,17,0.6);width: 140px;font-weight: 500;padding: 3px 5px;font-size: 13px;line-height: 20px;position: absolute;height: 25px;transition: .3s linear;text-align: center;} .cover ul#rdm_arleth98 h2:hover {height:65px;transition:.3s linear} .cover .rdminc p{display:none;} .cover ul#rdm_arleth98{list-style:none;margin:0;padding:5px 0 0;overflow:hidden;border-top:none}.inf-link {font-size: 11px;padding: 0px 5px;border-radius: 2px;position: absolute;bottom: 10px;right: -5px;} .cover #rdm_arleth98 a{color:#64707a;transition:all .3s;display:block} .cover .rdm_sum{font-size:13px;color:999} .cover .rdminc{position:absolute;top:0;right:0;margin:5px;border-radius:5px;padding:5px;background:rgba(17,17,17,0.6);color:#FFF;font-size:12px;font-family:arial,sans-serif} .cover #rdm_arleth98 li{margin:5px;padding:0;position:relative;display:inline-block;transition:all .3s;overflow:hidden} @media screen and (max-width: 640px){.cover #rdm_arleth98 li{float:left;width:46%;}.cover #rdm_arleth98 img{width:auto;height:auto;}}<div class='cover'><ul id='rdm_arleth98'> <script type='text/javaScript'> var randomarleth_number=4;var randomarleth_chars=0;var randomarleth_details="yes";var randomarleth_comments="Comment";var randomarleth_commentsd="no";var randomarleth_current=[];var total_randomarleth=0;var randomarleth_current=new Array(randomarleth_number);function randomarleth(a){total_randomarleth=a.feed.openSearch$totalResults.$t}document.write('<script type="text/javascript" src="/feeds/posts/default/-/Anime?alt=json-in-script&max-results=0&callback=randomarleth"><\/script>');function getvalue(){for(var e=0;e<randomarleth_number;e++){var g=false;var h=get_random();for(var f=0;f<randomarleth_current.length;f++){if(randomarleth_current[f]==h){g=true;break}}if(g){e--}else{randomarleth_current[e]=h}}}function get_random(){var b=1+Math.round(Math.random()*(total_randomarleth-1));return b}; </script> <script type='text/javaScript'> function rdm_arleth(j){for(var p=0;p<randomarleth_number;p++){var n=j.feed.entry[p];var s=n.title.$t;if("content" in n){var m=n.content.$t}else{if("summary" in n){var m=n.summary.$t}else{var m=""}}for(var q=0;q<n.link.length;q++){if("thr$total" in n){var l=n.thr$total.$t+" "+randomarleth_comments}else{l=randomarleth_commentsd}if(n.link[q].rel=="alternate"){var o=n.link[q].href;if("media$thumbnail" in n){var r=n.media$thumbnail.url}else{r="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVky_nTVJ7C0SBCXrxqswpSVhzZ3mytv2jf_w0YjSc4N7pW3G9x2YH-ljMF_7tKpvPZyqFnM5-QaCFoAfqdQnMtg1pdEZ77fZbeCPmKeUoOa2cYUlO1CMB9CSGmbKf23ZDmNOiQZRZ/s1600/no-image.png"}}}document.write("<li>");document.write('<a href="'+o+'" rel="nofollow"><img alt="Tutorial kali ini aku akan membahas perihal cara menciptakan Featured Post Random Dengan Labe Featured Post Random Dengan Label" src="'+r+'" width="'+145+'" height="'+185+'"/><h2>'+s+"</h2></a>");if(randomarleth_details=="yes"){document.write('<div class="rdminc">Tv Series <p> '+l)+'</p></div><div style="clear:both"></div></li>'}}}getvalue();for(var i=0;i<randomarleth_number;i++){document.write('<script type="text/javascript" src="/feeds/posts/default/-/Anime?alt=json-in-script&start-index='+randomarleth_current[i]+'&max-results=1&callback=rdm_arleth"><\/script>')}; </script> </ul></div>| Tag | Keterangan |
|---|---|
| var randomarleth_number=4 | Silahkan Ganti No 4 untuk menampilkan Jumlah postnya |
| /feeds/posts/default/-/Anime | Ganti Anime Dengan Label |
| Tv Series | Ganti Dengan Text Yang diinginkan |
Jangan mengatur jumlah post banyak kalau postingan blog masih sedikit, sebab dapat menjadikan Crash pada Browser