Use Tracery in Jekyll

grammar.html

---
layout: tracery
---
{
	"origin": "Hello, #name#.",
	"name": [
		"#adjective# #noun#",
		"#adjective# #noun#",
		"#adjective# #noun#",
		"#adjective#, #adjective# #noun#"
	],
	"adjective": ["dear", "valued", "loyal", "weary"],
	"noun": ["reader", "friend", "minion", "traveller"]
}

tracery.html

---
layout: default
---
<!-- Add to your "_layouts" folder -->
<div class="tracery">
  <h1 class="tracery_output"></h1>
  <button class="tracery_generate">Generate Again</button>
</div>
<script type="application/json" id="grammar">
{{ content }}
</script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/cash.min.js"></script>
<script src="https://cdn.jsdelivr.net/gh/oncomouse/[email protected]/tracery.min.js"></script>
<script>
  $(function() {
    function generateTracery(grammar) {
      return function() {
        $('.tracery_output').text(grammar.flatten('#origin#'))
      }
    }
    var grammar = tracery.createGrammar(JSON.parse($('#grammar').text()));
    generateTracery(grammar)();
    $('.tracery_generate').on('click', generateTracery(grammar));
  })
</script>