Is anyone here using their Discourse instance as their entire website?

Community
33

Embeds are actually possible in both the Discourse UI (e.g. above a topic list) using a theme, and the Landing Pages Plugin. For the latter, I’ve made an example using this little version of the Dinosaur Game. You can play here: Pavilion | Dinosaur Game! (desktop only).

2021-03-04 18.54.09
2021-03-04 18.54.092544×1318 900 KB

No coding involved for that one. All I did was upload those assets to our CDN (drag and dropped the folder into a digitalocean ‘space’), created a page with the path “dinosaur” and copy/pasted this html (both via the admin UI).

HTML 
<div class="landing page dinosaur">
  <div class="container">
    <h1>Dinosaur Game!</h1>
    <canvas id="game" height="200" width="800"></canvas>
    <p class="controls">press space bar to start</p>
    
    <script src="https://pavilion-assets.nyc3.digitaloceanspaces.com/dinosaur/js/helpers.js"></script>
    <script src="https://pavilion-assets.nyc3.digitaloceanspaces.com/dinosaur/js/objects/game-object.js"></script>
    <script src="https://pavilion-assets.nyc3.digitaloceanspaces.com/dinosaur/js/objects/cactus.js"></script>
    <script src="https://pavilion-assets.nyc3.digitaloceanspaces.com/dinosaur/js/objects/dinosaur.js"></script>
    <script src="https://pavilion-assets.nyc3.digitaloceanspaces.com/dinosaur/js/objects/background.js"></script>
    <script src="https://pavilion-assets.nyc3.digitaloceanspaces.com/dinosaur/js/objects/score.js"></script>
    <script src="https://pavilion-assets.nyc3.digitaloceanspaces.com/dinosaur/js/game.js"></script>
    <script>
    	new Game({
    		el: document.getElementById("game")
    	});
    	window.onkeydown = function(e) {
            return e.keyCode !== 32;
        };
    </script>
  </div>
</div>

The Landing Pages Plugin implements the CSP and CORS settings of Discourse, which I’ve already set up to handle scripts from our CDN (via the relevant site settings).

I’ll post a full “How to host and embed assets” knowledge-base topic for that plugin to cover that use case next week.

8 Likes