HTML and ePub ttrpg creation.
What?
Part game where you create an adventure by drawing cards, part guilde on creating content for the web.
This quick guide will introduce you to creating content for your ttrpg to publish in both html and ePub formats,using pandoc to create both outputs from a single file.
Why?
The 'traditional' way of publishing your ttrpg online is to use a pdf, which is fine. Its not the best format though.
While a pdf is a great format for printing it is often not the best choice for screens. See the many times you have likely had to zoom in on a column and constantly scroll in all four directions to be able to read the tiny text.
Publishing your ttrpg as an ePub, or even html for the web, can make your content much more readable on devices like phones and tablets.
How?
You will be drawing cards from a tarot deck and using them as inspiration to write a ttrpg adventure. While you are creating that adventure I will show you how to write write it in markdown, and at the end I will show you how to convert that markdown to html and epub using pandoc.
You can click the button above to launch it in your browser,or download the epub!
Expectations.
This is a really quick introduction to these topics in the guise of an adventure creating game.
You will finish this guide with a basic knowledge of how to get going creating thhis kind of content, but it is beyond its scope to make you a fully fledged expert. It will however armed you with the tools to keep learning for yourself.
Bear in mind that both html and ePub are not a pdf. You should not create the same complex and rich layouts that your would for print in a pdf, they are different formats intended for different reasons. You can still create fantastic and beautiful work, just the style will be different.
This does not make one better than the other any more than a screwdriver is better than a hammer.
Status | Released |
Category | Physical game |
Release date | Oct 15, 2021 |
Rating | Rated 4.9 out of 5 stars (44 total ratings) |
Author | James Chip |
Genre | Adventure |
Tags | Singleplayer, Tarot, Tabletop role-playing game, Tutorial |
Code license | MIT License |
Asset license | Creative Commons Attribution v4.0 International |
Average session | A few minutes |
Languages | English |
Inputs | Keyboard |
Links | Homepage, Twitter/X |
Download
Click download now to get access to the following files:
Comments
Log in with itch.io to leave a comment.
Hey! Here's the location I made through this guide!
https://thegiftofdice.itch.io/the-sunstar-garden
Let me know how you like it!
Thank you so much for making this guide!
Thank you for this guide! I made a little module with it and I’ll publish it whenever I get the time to set up the itch page.
So my question now is: what if I want to make something bigger with a navigation bar? how should I go about it?
Hi,
I am glad you found it useful and look forward to seeing what you publish!
This is a bit I intend to add in the near future! Pandoc actually has the ability to generate a table of contents automatically. Ill add the details to the tutorial soon but the basic steps are:
1. Add <nav>$toc$</nav> to your template.html before the main section.
2. Addthe flags -s --toc to the build command for the web output.
This will should automatically generate you table of contents on your page.
Wow. Pando is… Deep! I’ll try it and let you know of my (lack of) success!
another question (as a reply to not spam the comment section)
what do I do if I want to use different fonts? do I have to copy them into the folder? what is the line I have to write to point? what if a font type for headers and another for body text?
edit: someone has told me that "cd documents/markdown_kaiju" would work its no first slash. I have no confirmed yet though.
okay if anyone is bouncing hard off "navigate to the directory using your terminal" after some help and still requiring a lot of trial and error, i got it figured out.
it seems you need to do every step by itself, you cant seem to just drop a multi directory address there, so if its not in c:, first thing is navigating to the correct harddrive (for me it was e:)
then instead of dropping "/documents/markdown_kaiju/" which didnt work, I had to first type "cd" and then the next step in the address. in this case:
"cd documents"
and then i had to follow the next step the same way
"cd markdown_kaiju"
heres a screen shot of things that didnt work and did:
Also: If you are testing it out and nothing seems to be working, hit the next page. It seems to generate a (until you play around with covers i'd guess) blank page at first that'll just have your title on it. I spent a lot of time trying to figure out what went wrong with my code before realizing that.
Hi,
You could be falling over a couple of different problems with the design and implementation of Windows here.
1. Navigating between lettered drives.
Windows makes this less than intuitive, you have to change drive first and then change directories after. Eventually, because this is such a bad idea, the eventually added the /d flag in the cd command. The /d flag tells cd that you wish to change drive first as part of the command.
I could argue the folly of drive letters vs mount pointsall day, but it is what it is.
2. Wrong slash
While cmd.exe says that it supports / in paths as well as \ as a way to become compatible with every other system on the planet, the truth is that it does so very badly. There are loads of edge cases that fail on this.
On windows / is used to specify flags for command options so it could be that as your command is
It could be that cmd is seeing the /d in /documents as a flag wanting to change drive and then finding no valid drive after that. I would recommend always using the windows style path separator to avoid these problems. It might work if you used:
But unless you need an absolute path (starts with a slash which means its a path that starts at the root of the lettered drive) I would always recommend using a relative path.
Great that you got this running in the end though, I should add a section with some links to info on navigating the terminal for people who need it soon.
:)
I have gotten help from another party, that says there should be no slash in windows between the cd and "documents" (or wherever you are heading) and that seems to have fixed the issue i was running into, i'll definately try to do the "/d" and see if that helps the swap to e: along with everything et al. ^^
Yeah i was mostly trying to toss something quick out to help folks running into the same issue as I was with this, instead of just bouncing off of it xD
Very interesting! Thanks!