James Leighton

Implementing a Random Post button on Bear Blog

Create a new page, and add the following script. This will load your blog sitemap.xml file, and redirect the user to a link it references. Add this page to your navigation to create a random blog post link!

<script>
async function redirectToRandomSitemapUrl() {
  try {
    const response = await fetch('/sitemap.xml');
    if (!response.ok) {
      throw new Error(`HTTP error! status: ${response.status}`);
    }
    const xmlText = await response.text();

    const parser = new DOMParser();
    const xmlDoc = parser.parseFromString(xmlText, 'application/xml');

    // Check for XML parsing errors
    const parserError = xmlDoc.querySelector("parsererror");
    if (parserError) {
      throw new Error("XML parsing error: " + parserError.textContent);
    }

    const locNodes = Array.from(xmlDoc.getElementsByTagName('loc'));
    const urls = locNodes
      .map(node => node.textContent.trim())
      .filter(url => url); // Remove any empty or whitespace-only URLs

    if (urls.length === 0) {
      console.error('No URLs found in sitemap.');
      return;
    }

    const randomUrl = urls[Math.floor(Math.random() * urls.length)];
    window.location.href = randomUrl;

  } catch (err) {
    console.error('Error loading sitemap:', err);
  }
}

redirectToRandomSitemapUrl();
</script>

This is post 16 of #100DaysToOffload.

To respond on your own website, write a post which contains a link to this post - then enter the URl of your page here. Learn more about WebMentions.


#100DaysToOffload #How-To