Creating my first HTML template

To create our first HTML template we have to go inside “Documents” menu option and click on “Templates” menu item. On this view we should click on “New Template” button displayed on the top right corner of the screen. Doing it, a new view is shown where we have to select between HTML or PDF format to create a new template:

  • HTML
  • PDF

In this case we will click on HTML format option and another view will be shown to the user, in this case we have to choose between one of options provided:

  • From scratch: On the HTML editor will appear the default HTML structure so we will have the possibility of typing our own code or copy/paste from another resource that we have already done.
  • Tutorial: The platform is providing us a default valid template already done in HTML for doing easier this task. It also gives us an idea of how you can create yours.

In this case we are going to create our HTML from scratch. Clicking on that option, our HTML editor is opened.

Note: HTML editor theme shown is based on the one selected in our profile.

As we can see on the following picture, this view is split in two parts, the one on the left is for the HTML editor and on the right we have our HTML preview in real time; and it also performs W3C validation. So it is very useful when we are typing HTML code that we can see in real time how is going our design and if there is any kind of error/warning in our HTML code.

Now we can start to work on our HTML editor.

On the following image, we can see that we have included our HTML code and we have a preview of our design on the right side.

Now we are going to save our HTML code. For that we will click on “Save” button, a popup is opening where we have to provide a title and a description for our HTML template.

We will enter a title and the description is optional.

Once the title is filled in, clicking the “Save” button our HTML design will be saved if everything went correctly.