How To Add Together An Html Sitemap Page Inwards Blogger

Are yous looking to practice an HTML Sitemap inwards WordPress? HTML Sitemaps are unlike from XML Sitemaps that yous submit to search engines to amend your crawelling charge per unit of measurement or get a quick indexsation of your novel posts. HTML Sitemaps, shows an organized listing of your published posts, only similar a tabular array of content. In this article, nosotros volition demo yous how to add together an HTML sitemap page inwards Blogger

XML Sitemaps vs HTML Sitemaps

An XML created amongst the assistance of an XML markup linguistic communication as well as are peculiarly intended for search engines. You tin practice as well as submit your site's XML sitemap inwards webmaster tools, which volition non alone amend your site's crawling charge per unit of measurement but also quick indexation of your site.

On the other hand, HTML sitemaps are created amongst manifestly Hyperlink Text Markup Language as well as are peculiarly intended for your website visitors. It is unremarkably used to listing all the postal service or pages that are published on your site.

You tin banking concern check the demo of this widget here.

Adding an HTML Sitemap With All Posts inwards Blogger:

To add together a HTML sitemap inwards blogger delight follow the below instructions correctly:

1. The real commencement affair yous require to practice is to  add the CSS codes as well as hence yous tin brand your sitemap hold off attractive. Go to Blogger >> Template >> Edit HTML >> Search for ]]></b:skin> tag as well as only higher upward it glue the next code. You tin also customize the below codes to gibe your mode of template color scheme:
   
   

   /* Sitemap plugin By MyBloggerLab */
   #bp_toc {
       color: #666;
       margin: 0 auto;
       padding: 0;
       border: 1px enterprise #d2d2d2;
       float: left;
       width: 100%;
   }
   span.toc-note {
       display: none;
   }
   #bp_toc tr:nth-child(2n) {
       background: #f5f5f5;
   }
   td.toc-entry-col1 a {
       font-weight: bold;
       font-size: 14px;
   }
   .toc-header-col1,
   .toc-header-col2,
   .toc-header-col3  {
   background:#9E9E9E;
   }
   .toc-header-col1 {
       padding: 10px;
       width: 250px;
   }
   .toc-header-col2 {
       padding: 10px;
       width: 75px;
   }
   .toc-header-col3 {
       padding: 10px;
       width: 125px;
   }
   .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: 13px;
       text-decoration: none;
       color: #fff;
       font-weight: 700;
       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: 5px;
       padding-left: 5px;
       font-size: 12px;
   }
   .toc-entry-col1 a,
   .toc-entry-col2 a,
   .toc-entry-col3 a {
       color: #666;
       font-size: 13px;
       text-decoration: none
   }
   .toc-entry-col1 a:hover,
   .toc-entry-col2 a:hover,
   .toc-entry-col3 a:hover {
       text-decoration:underline;
   }
   #bp_toc tabular array {
       width: 100%;
       margin: 0 auto;
       counter-reset: rowNumber;
   }
   .toc-entry-col1 {
       counter-increment: rowNumber;
   }
   #bp_toc tabular array tr td.toc-entry-col1:first-child::before {
       content: counter(rowNumber);
       min-width: 1em;
          min-height: 3em;
       float: left;
       border-right: 1px enterprise #fff;
       text-align: center;
       padding: 0px 11px 1px 6px;
       margin-right: 15px;
   }
   td.toc-entry-col2 {
       text-align: center;
   }



2. Once everything is done, press Save Template push clitoris acquaint at the real transcend of your screen.


3. Now Simply practice a novel page where yous desire to display your sitemap. Go to Blogger >> Pages >> New page. In the Blogger page editor, choose HTML tab as well as glue the next code inwards the HTML code editor:
   
   

   <div id="bp_toc">
   </div>
   <script src='http://mybloggerlab.com/js/sitemap.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>



4. After pasting the higher upward code, yous tin write a championship of your page. If yous want yous tin also disable comments because yous would non similar people posting comments on your sitemap. Once everything is done, press Publish button.

We promise this article helped yous larn how to add together an HTML sitemap page inwards Blogger. If yous enjoyed this article delight portion your thoughts inwards comments department below.

Baca Juga