Custom Article Templates

Guild Exclusive

This is a Grandmaster+ feature. To get access, Join the Worldbuilder's Guild!

Custom templates are a useful feature to streamline your article creation process and completely customise the way your articles are displayed. Read this guide to learn how to use them properly and avoid headaches down the road. In general, there are two main uses for custom templates. You can add custom content, tags and CSS to any article created with that template. This requires no technical knowledge and is the most common use of the templates.
The second use case is to change the template used to generate the article from the content you have added to the article. This requires some technical knowledge of how to edit TWIG, HTML and CSS to bring your vision to the screen of your readers.
This article covers each of the tabs found in the Studio and what you can do there.

Manage Templates

The Creator's Studio: Article Templates is the place to manage your templates. The list displays their title, base article template, and the edit button. The templates are sorted by title in lexicographic order and can be filtered using the search bar.
To create a new custom article template, use the form on the right. Enter the name, description (optional) and parent article template, then press Create Template.

The prose template cannot be chosen from this list. This is intended as the template has a different structure and cannot be customized the way other templates can.

To delete a custom article template, open the editing interface and press the Delete button at the bottom of the right sidebar. Make sure you have the correct template to delete, as they cannot be restored. Deleting an article template will not affect the functionality of existing articles created with that template!

Edit Templates

Templates are edited using four different forms, each covering a different aspect of the template. Each form is located on a different tab.

Structure

This tab allows you to add content to the generic fields of articles created with this template. Not all fields in the templates are editable. It is possible to add content to the Vignette / Free Form, Sidebar: Top, Sidebar: Content Panel Top, Sidebar: Content Panel Bottom, Sidebar: Bottom, Footnotes, Full Width Footer and Tags fields. Other fields are not available.

This content will be added to an article that is being created. Existing articles are not affected by changes made to content within the custom template.
When creating an article with the Quick Ink Well (the purple button) it overwrites the changes in the vignette and tags field of the template. Making it seem like the template is not applied. To avoid this, create articles using the buttons on the dashboard.

Presentation

The options for this template allow you to customise how the template appears in the user interface and in the world map.

• The name of your template determines the text that describes the template of an article. This text appears in the type filter selection, in various searches, is used for placeholder template links, and appears in the metadata section. In many cases, the name is changed to lower case and spaces are removed. It is recommended to use only ASCII characters and spaces for the name of a template.
• The Description is only visible in the template list. Use this field to describe what this template is for. Fill it in if you have a lot of similar templates or are collaborating with other people.
• The icon decorates the Create Article button in the dashboard of your world.

CSS

This tab allows you to fill the article's CSS fields with common CSS and additional CSS classes. This is useful if you want to give an article of this template type a special theme or layout.

• CSS Class: You can add one or more additional CSS classes to the article. This will appear in the Additional CSS Classes field of the article.
• Display CSS: Add complete CSS rules to this field. Each rule will only be applied to each article created with this template. The rules will be stored in the Article CSS field.

If you add CSS to a custom template, that CSS will be copied into the article CSS when an article is created. This means that subsequent changes to the CSS will not affect existing articles.

Advanced

This tab allows you to edit the rendering template of the article itself. This rendering template is used to convert the content you add to your article into the view that readers will see. By editing this template, you can break your articles that use this template. This will result in articles not displaying correctly or returning a 404 Not Found error. Do not tinker with this on templates you use for published articles! However, if you do break it, you can always fix it, so do not be afraid to experiment and test things out!
The HTML Structure is where the HTML / TWIG code goes. You can get started by copying and pasting the original template from the sidebar into this box. Make sure it works before you change anything. Once you have the default view of the template, you can start changing things.
A few things to keep in mind when editing these TWIG templates:

.
• Creating a full template requires some technical know-how with CSS, HTML & TWIG to really get your vision on screen, but making some minor changes can be relatively easy to get started!
• The TWIG templates provided are not always up to date. If you find a problem, make a bug report, so the team can update them.
• Using the templates requires some maintenance, as the team makes changes to their templates from time to time. These updates will not be available to you until you integrate them with your own changes!
• However, if you don't do this maintenance, your stuff shouldn't break, as the team is careful not to make breaking changes! At the same time, there is no guarantee that your templates will never break.
• The templates use a security filter. This filter is not fully documented, but largely corresponds to the general CSS filter described here. If something is in your code but doesn't appear when you view the article, it's probably been removed by the security filter.
• Changes to the template are also applied to existing articles. This also means that if you break something, your existing articles will break too!
• There is a channel on the Discord to ask questions about this: #twig-help. Be sure to use these resources if you get stuck!
• The World Anvil presentation uses Bootstrap 3 or Bootstrap 5 for the presentation. You can switch the bootstrap version in the styling settings of your world. For new worlds the default is 5 since 2022!

Use Templates

The templates are used either by creating a new article using the template or by switching an existing article template to the custom template. You can always switch any article to a suitable custom article template! You can change the template of an article in the right column under Special Actions.
To use a template in a particular world, you must attach the template to that world. Once attached, the template will be available on the dashboard and in the template dropdowns. Removing a template from a world will not affect existing articles, they will continue to work. Deleting the template will revert all articles of that template to the original World Anvil template! This means that they will not break if you do this.
In summary, custom article templates are a bit of a hassle to use, but they are very powerful and give you complete control over how your world looks!

Content

1. Manage Templates
2. Edit Templates
3. Use Templates

Navigation