When you are working on an Invoice or Contract template, you might want to preview the result during development of the form.
This article will show you some tips during the development of templates.
To preview the output of your templates you need the following things.
Create a test event and enter random details in the event. Fill out a deal, link a contact, enter a location, etc. Name the event so it is clear that it is a test event. You can delete the event when you are done.
Work with multiple browser tabs within Google Chrome.
Permissions within ABOSS to the Office section.
Warning! Any changes made in a template can cause the template to malfunction if the codes are not written properly. Always create a duplicate of a template when you are making changes to the liquid code! Change templates at your own risk.
When you have created the test event, you can create or edit the templates.
The Invoice and Contract templates can be found under the Office section. Create a new one or edit an existing one.
Save changes
When you want to test changes you made to the template you can save the template by clicking the save button at the top of the screen.
Open a second browser window
The next step is to keep this browser window open! Open a second tab in the browser.
Navigate to ABOSS in the 'New Tab' and open your test event. Create a new Invoice or Contract, depending on which template you are editing.
Select your template
Select the template that you are working on on the Invoice or Contract.
Enter the optional details to complete the invoice.
Note: make sure you don't enter an invoice or contract number form the range! Type in 'Test' as an Invoice or Contract number to prevent missing numbers in your administration.
Click on 'Preview PDF' to view the result of your template. A new browser window will open, showing you the PDF file.
Edit and Preview new changes
You will now have three browser tabs open and you can easily switch between them. Keep these two browser tabs open: The template editor and the PDF file.
To Edit and Preview again, simply switch between tabs. Edit the template again and save it.
Open the PDF browser tab and hit refresh. The new adjustments will update in the PDF. Repeat these steps until you are satisfied with the result.
Template error
When there is something wrong in the code of your template, you will get a syntax error.
In most cases this happens when there is an 'if' statement that is incomplete or if there is a variable in the form that is not written correctly.
To solve the error, check the template for incomplete or 'wrong' code. Here are some examples of code that could cause an error.
Below is an incorrect 'if' statement displayed. We start the statement, but we forgot to tell the system to close the statement
{% if event.fee > 0 %}
{{ event.fee }}The correct code would be:
{% if event.fee > 0 %}
{{ event.fee }}
{% endif %}Incomplete variables will also cause an error.
{{ contact.contact_name }You see that the last '}' is missing here.
Find some more common mistakes in this article.
Contact support if you get stuck on this or need additional help.