Sitemap Style Sheet with Bootstrap 4

Sitemaps aren't clearly displayed by all browsers when called up directly. Seen soberly, the links don't look nice either. Refresh your existing sitemap! The layout is responsive and based on Bootstrap, a front-end framework. You need to load one file to your server only.

The stylesheet.xsl

  1. Download the style sheet and upload to your server in the home directory:

    stylesheet.xsl raw

  2. Option 1: The stylesheet.xsl template uses Bootstrap v4.1.x from the Bootstrap CDN server. If you agree, you can continue with step 3.

    Option 2: If you also use a current version of the Bootstrap library on your server, you need to rewrite the path to the bootstrap.min.css file only:

    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"/>

    Rewrite the href-value in line 24: /path-to/css/bootstrap.min.css

    Option 3: Do you want our Sitemap Style Sheet without any external CSS-files? Then you can download the following stylesheet.min.xsl file. The required Bootstrap classes are included:

    stylesheet.min.xsl

Add stylesheet.xsl file to sitemap.xml

  1. Your existing sitemap.xml is usually in your root directory of your domain. Just add the stylesheet.xsl with <?xml-stylesheet href="/path-to/stylesheet.xsl" type="text/xsl"?> to the header of your sitemap-files. You downloaded the XSL-file in the first step above.

    <?xml version="1.0" encoding="UTF-8"?>
    <?xml-stylesheet href="/stylesheet.xsl" type="text/xsl"?>
    <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml">
    
    <url><loc>https://example.com/about</loc></url>
    <url><loc>https://example.com/blog</loc></url>
    <url><loc>https://example.com/contact</loc></url>
    
    </urlset>
  2. … and Bob's your uncle! Take a look at your existing sitemap.

Sitemap examples

standard sitemap raw

news sitemap

sitemap with images

sitemap with videos

Sitemap index example

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet href="/stylesheet.xsl" type="text/xsl"?>
<sitemapindex xmlns="https://www.sitemaps.org/schemas/sitemap/0.9">

<sitemap><loc>https://example.com/sitemap.xml</loc></sitemap>
<sitemap><loc>https://example.com/sitemap-categories.xml</loc></sitemap>
<sitemap><loc>https://example.com/blog/sitemap.xml</loc></sitemap>

</sitemapindex>

sitemap index raw