How to Add Sitemap Widget for Blogger

       How to Add Sitemap Widget for Blogger - Ya  How to Add Sitemap Widget for Blogger. Mungkin diantara kalian belum tau apa itu sitemap bukan? Sitemap itu adalah peta situs untuk situs kita. Jadi yang belum punya peta situs atau daftar isi di blog kalian. Silahkan terapkan kode - kode berikut ini.

<div id="bp_toc">
Loading Sitemap. Please wait....</div>
<script src="https://arlina-design.googlecode.com/svn/blogtoc.js" type="text/javascript"></script> <script src="/feeds/posts/summary?alt=json-in-script&amp;max-results=9999&amp;callback=loadtoc" type="text/javascript"></script>

<b:if cond="data:blog.pageType == &quot;http://www.webshared.net/p/sitemap.html&quot;"> <style scoped="" type="text/css">
#outer-wrapper {width:100%;max-width:1000px;margin:0 auto;padding:0;text-align:left;float:none;background-position:center!important;}
#post-wrapper {width:100%;max-width:1000px;margin:0 auto;text-align:left;float:none;background-position:center!important;}
.post-body,.post{background-position:center!important;}
#blog1,#artikel,.blog-posts{background-position:center!important;}
.banner,#footer-wrapper,#comments,#sidebar-wrapper,#header-wrapper,#menu-wrapper {display:none;margin-top:0;margin:0;}
.post-inner {padding:0 0 0 0;margin:20px auto;}
</style> </b:if>

Ganti http://www.webshared.net/p/sitemap.html ke url halaman blog anda

/* CSS Sitemap */
/* by www.webshared.net */
#bp_toc {
    background: transparent;
    width: 100%;
    color: #999;
    margin-top: 10px;
    margin: 0 auto;
    padding: 5px;
}

.toc-header-col1 {
    padding: 15px!important;
    line-height: 15px;
    background-color: #f56954;
    width: 250px;
    transition: all 0.3s ease-in-out;
}

.toc-header-col2 {
    padding: 15px!important;
    line-height: 15px;
    background-color: #2c323c;
    width: 75px;
    transition: all 0.3s ease-in-out;
}

.toc-header-col3 {
    padding: 15px!important;
    line-height: 15px;
    background-color: #252a32;
    width: 125px;
    transition: all 0.3s ease-in-out;
}

.toc-header-col1:hover, .toc-header-col2:hover, .toc-header-col3:hover {
    opacity: 0.9;
}

.toc-header-col1 a:link, .toc-header-col1 a:visited, .toc-header-col2 a:link, .toc-header-col2 a:visited, .toc-header-col3 a:link, .toc-header-col3 a:visited {
    font-size: 15px;
    text-transform: lowercase;
    text-decoration: none;
    color: #fff;
    font-family: 'Viga';
    font-weight: 400;
    letter-spacing: 0.5px;
}

.toc-header-col1 a:hover, .toc-header-col2 a:hover, .toc-header-col3 a:hover {
    text-decoration: none;
}

.toc-entry-col1, .toc-entry-col2, .toc-entry-col3 {
    padding: 10px;
    font-size: 92%;
    ;transition: all 0.3s ease-in-out;
}

.toc-entry-col1:hover, .toc-entry-col2:hover, .toc-entry-col3:hover {
    background: #fdfdfd;
}

.toc-entry-col1:nth-child(odd), .toc-entry-col2:nth-child(odd), .toc-entry-col3:nth-child(odd) {
    padding: 10px;
    font-size: 92%;
}

.toc-entry-col1:nth-child(even), .toc-entry-col2:nth-child(even), .toc-entry-col3:nth-child(even) {
    padding: 10px;
    font-size: 92%;
}

.toc-entry-col1 a, .toc-entry-col2 a, .toc-entry-col3 a {
    text-decoration: none;
    color: #666;
    transition: all 0.3s ease-in-out;
}

.toc-entry-col1 a:hover, .toc-entry-col2 a:hover, .toc-entry-col3 a:hover {
    color: #f56954;
}

span.toc-note {
    padding: 10px;
    margin: 10px 0;
    display: inline-block;
    background: #fff;
    color: #666;
}

#bp_toc table {
    width: 100%;
    margin: 0 auto;
    border-collapse: collapse;
    border-spacing: 0;
    border-color: transparent;
}

#bp_toc tr:nth-child(even) {
    background: #fafafa;
}

#bp_toc tr:nth-child(odd) {
    background: #f5f5f5;
}

Demo

View me

Terima Kasih telah membaca artikel tentang How to Add Sitemap Widget for Blogger . Silahkan baca artikel lainnya di daftar isi.

• Tweet
• Share
• Share
• Share
• Share

Unknown

Judul : How to Add Sitemap Widget for Blogger .
Ditulis oleh : Unknown .
Pada hari : Saturday 29 November 2014 .
Rating Blog : 5 dari 5

Follow me on: Facebook | Twitter | Google+

×

Related Post