Getting started

OutputKit is a bit of JSON (a dictionary in the form of text) that contains the markup for Bootstrap components , you put into a variable at the start of your Shortcut.

Starting with the template shortcut

To get started its best to take the OutputKit Template Shortcut and just start a shortcut from there. It already has all the actions in that you need to use and create something with OutputKit. You can always update the tags, or make a different html template with OutputKit Build.

Starting with your own Shortcut

Using the OutputKit Build Shortcut, you can create your own html template and copy the json text you'll need to include at the top of your Shortcut.

Copying tags to your Shortcut

The json text should be copied into a text box, then Get Dictionary from Input, then a variable name.

Building a html template

Building a template youll be asked what to include, you can always repeat the process later if you change your mind.

Once youve added to the Shortcut will need to have to insert a variable containng output from your Shortcut.

The html template should be copied into a text box and then usually displayed, there are several ways of doing this, quickview, View Web Page or opening in Safari using a data URI.

Adding images and other media

It's often useful to put any base64 encoded images/sounds and other big/reused items in dictionary at the top of your shortcut, and it keeps the text window clear of long strings. So when it comes to adding an image you can just type it's name. Copy and paste the base64 encoded strings into a Dictionary, an example is in the Template, and the Examples.

Tags

Once youve have a template Shortcut, or have added the json to your own Shortcut, you can then refer to the different elements with the tags for different components.

Tags are put in a Text action along with other output. You can mix in html tags, or even use Markdown, as long as you convert it first. Its often useful to use several text boxes to split things up.

Choose the variable you've assigned the OutputKit dictionary to, and enter a tag.