Launching Soon: This feature is coming soon. Keep an eye out for this exciting update in TWICE Admin! For release details, visit our Updates Page.
This article explains how to edit and customize documents in TWICE Admin, giving you full control over the layout and content of your printed documents, such as order confirmations.
Accessing the Document Editor
To begin editing any document in your TWICE Admin:
Navigate to Settings > Store Setup > Documents.
You will see a preview of the document you're editing.
Click Edit in the top-right corner to enter the edit mode.
Edit Mode Overview
When you enter Edit Mode, the screen is split into two sections:
Left Side: Contains two tabs:
Source: Displays the HTML and Handlebars code for the document. This is where you’ll make your changes.
Test Data: Provides sample data to help you see how your changes will appear with real order data.
Right Side: Shows a live preview of the document, which updates instantly as you edit the source code.
Note: Editing is not available on mobile. You'll need to access the document editor from a desktop or laptop.
Editing Documents: HTML and Handlebars
To make changes to a document, you’ll need to use HTML and Handlebars, a templating language. You can refer to external HTML and Handlebars documentation for more details.
Here are a few quick examples of common customizations:
1. Changing Font Size
To increase the font size of a specific element, such as a customer name, locate the HTML in the Source tab and add a style attribute like this:
<span style="font-size: 20px">
{{orderData.responsiblePerson.firstName}} {{orderData.responsiblePerson.lastName}}</span>
2. Making Text Bold
To bold a section of text, wrap the text in <strong> tags:
<strong>Contact information</strong>
3. Adding a New Line of Text
To add an extra line of text, simply insert a new line within the HTML structure:
<p>Remember to mark the order as started in TWICE!</p>
Non-Editable Elements
Certain elements of some documents cannot be edited. For example:
The Barcode and the Order Number at the bottom of the Order Confirmation
Saving Changes and Reverting to Default
Once you've made your edits:
Click Save in the top-right corner to apply the changes.
If you want to undo your customizations and return to the original layout, click Revert to Default.