Cara Membuat Sitemap mirip Blog ini
Ada lagi Request. Katanya, gimana sih caranya bikin sitemap kaya blog ini?
nih saya kasih tau cara buatnya.
Pertama masuk Blogger -> Template -> Edit HTML
Letakkan kode CSS berikut di atas ]]></b:skin> atau di bawah <style>
/* CSS Sitemap by Fansublogger */
#table-outer table {width:100%;margin:0;padding:0;}
#table-outer input, #table-outer select {padding:4px;font:inherit;border:2px solid #eceeee;width:170px;box-sizing:border-box;}
#table-outer select {cursor:pointer;outline:none}
#table-outer input:focus{outline:none}
#resultDesc {margin-bottom:10px;}
#feedContainer {overflow:hidden;margin-top:20px;}
#feedContainer strong {font-size:10px;}
#feedContainer, #feedContainer li {padding:0;margin:0;list-style:none;}
#feedContainer li {float:left;width:50%;margin-bottom:10px;position:relative;z-index:0;}
#feedContainer .inner {padding:8px;margin: 0 5px;position:relative;background-color:#fff;height:133px;}#feedContainer img {float:left;margin: 0 8px 0 0;max-width:100%;padding:2px;}
#feedContainer .toc-title {max-height:33px;overflow:hidden;}
#feedContainer .toc-title:hover {text-decoration:underline;}
#feedContainer .news-text {font-size:11px;}
#feedNav a, #feedNav span {display:block;text-align:center;color:#fff;text-decoration:none;background-color:#222;padding:5px;width:95%;margin: 0 auto;transition:all 0.3s linear;}
#feedNav a, #feedNav span:hover {background-color:#5498C9;transition:all 0.3s linear;}
#feedContainer .date {display:none;position:absolute;bottom:0;right:0;background-color:transparent;color:#fff;font-size:9px;padding:3px 2px;width:35px;}
#feedContainer .date .dd {font-size:9px;line-height:5px;font-weight:bold;}
#feedContainer .date span {display:inline-block;line-height:5px;text-align:center;margin-left:5px;}
Kalo sudah di salin. Simpan template!.
Lalu buat Halaman baru atau mau di postingan juga boleh.
<div id="table-outer">
<table><tbody>
<tr><td><label>Sort posts by : </label></td><td><select id="orderFeedBy"><option selected="" value="published">New post</option><option value="updated">Post updated</option></select></td></tr>
<tr><td><label>Filter posts by category : </label></td><td><span id="labelSorter"><select disabled=""><option selected="">Loading...</option></select></span></td></tr>
<tr><td><label>Search by keyword : </label></td><td><form id="postSearcher">
<input type="text" /></form>
</td></tr>
</tbody></table>
</div>
<header id="resultDesc"></header>
<ul id="feedContainer"></ul>
<div id="feedNav">
Loading...</div>
<script src="https://sites.google.com/site/fansublogger/javascript/SitemapByFansublogger.js" type="text/javascript"></script>
<style scoped="" type="text/css">#comments {display:none;}
</style>
Udah? terakhir saatnya bilang Alhamdulillah.
Cara Membuat Sitemap mirip Blog ini
Reviewed by Michael William J
on
Minggu, Desember 21, 2014
Rating:
Tidak ada komentar
Terima Kasih