Random page button

support
1

I am using hugo 0.126.2 and PaperMod.
I am trying to make a simple page with a button in /content/jetlag/challenge.md that randomly selects a file in /content/challenges/ and opens it.
So pressing the button on https://domain.tld/jetlag/challenge/ could open up https://domain.tld/challenges/7/

Here is what I have in /content/jetlag/challenge.md right now:

---
title: Random Challenge Button
---

## press for random challenge

<html>
<body style="font-size: 20px; text-align: center;">
		<button id="randomChallengeButton" class="custom-button">Random Challenge (click to earn coins!)</button>
  <script>
    document.getElementById("randomChallengeButton").addEventListener("click", function() {
      const randomNumber = Math.floor(Math.random() * 100) + 1;
      const randomChallengeFile = "challenges/" + randomNumber + ".html";
      window.location.href = randomChallengeFile;
    });
  </script>
</body>
</html>

And my /content/challenges/1.md is:

---
title: "1"
---

# Find a pigeon.
30 pts

This currently doesn’t even render a button at all. Am I missing something? Is there another better way to do this?

Thanks!!

2

That is not much information to go on, but “doesn’t even render a button at all” sounds a lot like Hugo does not like HTML in your markdown. Have a read through this:

If that doesn’t help, then maybe clarify what “does not render” means. How the page is created/rendered. Why you have html and body tag in your content. What your CLI run of hugo says. And so on…

3

Why do you include a html element in an MD file which will most probably be processed by several templates to render an HTML file? To me, that doesn’t make sense at all.

4

With this limited information, just my wild guess:

  • activate raw HTML in your hugo.toml
  • just write the button and script tags in your .md file