I’ve been looking through the documentation, and I can’t see any mention of how to italicize text in Inky/Inkle. Is it possible?
Bold isn’t so important, but italics is required to write some things correctly. Not only for emphasis, but for proper nouns so that e.g. Nebraska the place can be distinguished from the USS Nebraska.
As I understand it, ink is intended to generate raw text. Presentation and formatting is handled by the game that the ink engine is plugged into.
You could decide to use a markup notation in the text output, and then set up the game to look for that markup.
It looks like Ink uses h1 tags, so normal Markdown may be supported.
If not, you can probably do it with CSS.
Fonts and colours are all controlled from the CSS file - style.css . If you open up the file, you’ll see a series of blocks like this one:
body {
font-family: 'Open Sans', sans-serif;
font-weight: lighter;
background: white;
}
Each one starts with a name like “body” or “h1”. In CSS this is called a selector since it selects a particular part of the webpage for styling. In the above case it selects the body, which is effectively the entire page.
The list of fonts following font-family is in priority order; it depends on what’s available on the user’s computer. In the above example Open Sans is a web font that’s imported at the top of the file - just visit fonts.google.com for a selection to choose from, and instructions on how to use them (it gives you one of those @import lines you can paste in yourself). If for some reason this font can’t be downloaded, it’ll fall back to the sans-serif option.
You can also use a font that’s built into the user’s system, but the problem is that there’s a very limited selection that are guaranteed to exist. The very most basic fallbacks can be specified using simply serif and sans-serif .
A few of the CSS selectors and rules in the file include:
h1 - this stands for “header level 1” - i.e. the largest header, which is used for the main title of the story at the top of the page. If you wanted change the size of the title, you could change the font-size property in here. Similarly the h1, h2 is a shortcut for setting rules on two selectors at once - header levels 1 and 2. The later is used for the byline if you have an # author: Your Name tag at the top of your ink..header - A name preceeded by a dot is a class name. This particular example selects an element that’s simply a container for the title and byline. Often in HTML/CSS, elements are given containers to help with structuring or to give fine control over spacing and layout.p - this stands for “paragraph”. It’s the selector for the main body text on the page. So this is where you should look if you want to change the font size, text colour, etc.a - This stands for anchor tag , which is HTML terminology for clickable link - these are mostly just used on our page for clickable choices, but could be anything.p.choice - This translates to “a paragraph with the ‘choice’ class”. If it was just .choice , it would mean “anything with a choice class”. Choices on our page are actually structured as specially styled paragraphs that contain clickable links (anchor tags).I don’t think Markdown is supported. I think you were thinking of HTML (h1 is an HTML tag).
If you are using the web export, then yes, HTML is supported and you can write:
Nebraska the place <strong>is not</strong> the USS <i>Nebraska</i>.
If you are using Unity or any other engine, you’d need to parse your own markup, as zarf said. (Or use tags, if you want to style a whole paragraph. Inline tags would be cool, but they don’t exist.)
That is, HTML markup is passed straight through from the ink engine to the web display. Is what I think you’re saying.
Ah, so I could simply use <em> and </em> tags? That’s brilliant! Thanks!
Thanks @Natrium729, that looks useful too. I’ll experiment.
I just wanted to say thanks for all your help, guys! Much appreciated.