We’ve had templates for some time, but they’ve always been this precarious beast. We are pleased to announce that you can now assign your templates to a specific lily.
At the time of this writing, templates are built out of HTML with data placeholders sprinkled in. We will eventually create a visual editor for templates. If this feature is important to you, you can vote on the feature here: https://hoppa.io/suggestions/visual-editor-for-templates/
Templates are specific to a project (pond). There are currently no global templates.
To create a template, select a project (pond) you want to edit.
In the header, you will see a dropdown from Templates.
Click on Create Template to create a new template.
You will be presented with an editor.
- Select the project that this template should associated with. It will default to the current project.
- Next, give your template a name to help you identify it.
- Last modify the HTML to your liking.
Templates pull in the Materialize framework by default (http://materializecss.com/). You can check that out for ideas on how to structure your code and what is possible.
Templates also use what is called Mustache syntax to show data placeholders. These data placeholders as specified by two curly brackets on each side of the name of the variable.
For the data junkies, our Mustache conforms to the mustache spec: http://mustache.github.io/mustache.5.html
Here’s some more info: https://mustache.github.io/#demo
Handlebars is mostly compatible and offers some good tutorials, but we do stick with the mustache spec, so not all examples will work: http://handlebarsjs.com/
We do allow the <style> tag so you can add classes to your elements and further style them with CSS.
After you have created your template, click SAVE.
Your project now has a new template.
- Click on the name to edit the template.
- Will duplicate your template into the same pond. Edit the template and change the pond to move it to another pond.
- Will delete your template.
If you just want a pretty template and don’t care to learn CSS or HTML or Mustache, let us know. We have some talented designers who can assist you.