All the components of the game have selectable CSS attributes. So if all you’re looking to do is make the game take up more height on the page, you can increase the padding on the frame the game is played in by increasing padding of .dino-outer:first-of-type .
Just keep in mind that won’t increase the actual “playable area” of the game, only the size of the outer frame the game is in. The playable area of the game is part of the game logic js file. The height of the game is calculated and created dynamically based on a few things like the size of the frame it’s in, the type of screen (mobile or desktop) and the size of the screen. If you look through the game logic js code, and search for “opt_height” and “canvasDimensions” you’ll see a lot of code that determines how to construct the size of the game. This is because the game logic javascript is forked from the ‘T-Rex runner’ game in Chromium, and designed (originally) to run on phones, tablets, computers, and in basically every screen size that Chromium based browsers like Chrome can run on. So it’s not designed to be easy to modify in terms of min/max height, it’s designed to be smart about the size that it displays based on the size and type of screen.
In summary, if you’re looking to just modify the frame the game is played in, that’s easily done with some CSS as described above. If you’re looking to modify the size of the playable area of the game, you’ll have to do some tricky modification of JS. It’s possible, but it’s not trivial to do.
If you do want to use this plugin and shortcode but with a modified/forked version of the game logic javascript, I would suggest installing this helper plugin: custom-assets-dinosaur-game.zip . The helper plugin allows customizations to be made to JS, CSS, game sprites, and markup, without those customizations being erased every time there’s an update to the regular dinosaur game plugin.
Hopefully this info helps!
