Page: demo

From 5etools Community Wiki
(Redirected from Feature: Renderer Demo)
Jump to: navigation, search


Screen Demo.png

Renderer Demo

Renderer Demo is the first of the tools developed for Homebrewing content to include into 5eTools. The page serves as a style guide, and in a very limited way, UI text editor.

Instructions (How to use it)



(see Homebrew: Creature)
(see Homebrew: Spell)

Basic Formating inline Tags

@bold Bold
@italic Italic
@strike Strikethrough
@color Color of the Text



The URL after the pipe is assumed to be from the root of the homebrew repository, unless it starts with a \"...://\" prefix (i.e., any link should work, but there's a shorthand for homebrew repository links).


{@filter display text|page_without_file_extension|filter_name_1=filter_1_value_1;filter_1_value_2;...filter_1_value_n|...|filter_name_m=filter_m_value_1;filter_m_value_2;}

Homebrew and Notation


Feature Support

Known Issues/Limitations

Render Limitations

The renderer only renders portions of the schema, specifically the ones for presentation.
There are many facets of the schema for filtering or meta data that cannot be demonstated in the renderer.
The renderer also will not render a full/complete element (such a Feat; Rules; Adventure; Items; etc) it will render a Subset of those, and you can put them into the renderer

Work Around:
Render only the portions of the content you are looking for assistance upon.

Tables & Creature (oh my!)

There are two types of tables - one for tables inside a set of text, and one for the website's reference and lookup section on tables - that might not make sense now, but will as you grow to understand the tool and find it easier. The same is true about monsters/creatures.
The renderer also will not render a full / complete element (such a Feat; Rules; Adventure; Items; etc) it will render a Subset of those, and you can put them into the renderer to view them, but if you include the entire array, it will likely return a blank renderer.


The renderer does not validate JSON, it does however error trap crappy JSON's errors and... hopefully that will be enough for you to know to revisit such and fix the issues that allow you get your homebrew ready to release.
Work Around:
Test all JSON segements through JSONlint before attempting to render it int he tool.


How does this thing work?

Honestly, for the most part - it works just by existing. Its mostly used for reference. Giving insight on how the JSON is formated, and what tags are possible in the site's existence. It allows you to plan on how to implement the content you wish to add, or modify it in the way you intend.
Review the rendered content and find the action/element you'd like to include within your own homebrew; in the left-hand panel, CTRL+F and search for a text string from that rendered element. Read the converted description, review the code in which its function is defined and used, then attempt to build your own using that section as a foundation to work from.

It just returns a blank screen?!

When you insert your JSON into the renderer code panel, the updated render just clears the text from the renderer/information panel.
What is happening:
Your code likely is rendering correctly; but data sets (for an eample "items": [) are not supported to render directly, instead you've just defined data versus asking it to render a portion of that data. You'll need to remove the leading declaration and its brackets [ ] to test to confirm that though.

It won't show my item/feat/trap/hazard/vehicle/book... custom JSON

See prior question's answer

What does "Invalid JSON! We recommend using JSONLint" mean?!

When I put the code in, it doesn't seem to change anything and instead by the Render Button, I see "Invalid JSON! We recommend using JSONLint.".
What that means:
Your JSON code fails at validation, which often means :
  • you have a missing character to open or close a entry. --> all { } & [ ] need to be paired
  • an extra or missing , --> the last line of an entry, if no additional data follows shouldn't have a comma, if more data will follow, it needs the comma.

Best Practices

Testing Homebrew

As covered in the FAQ/Known Limitations; the site doesn't present the whole JSON even when formatted correctly, however it is wonderful for a sort of virtual WYSIWYG for blocks of text and sections of displayed text.
Make sure you have a block of code and that its been passed through JSONLint or the like, but doesn't have a defined container (see examples below), and then paste the entries in to left hand side and render. The resulting block on the right side SHOULD be your code, and modifying that left hand source will make real time changes. Once that's setup as you wish, copy that segment back into the JSON, at the point your wishing to expand its content.
"monster": [
"feat": [

Related Features

Did that answer your question(s)?

If not please check the under Support; Troubleshooting or the Known Issues page for further guidance, or go to the Discord community and leave a comment in the issues channel.

If you enjoy the project, please follow this link to see how you can contribute and help make it even better.

Do you have time to take a Survey?