Skip to main content

Create a dynamic template

To create a dynamic project in Vev you first need to create a template and a template schema.

info

A project in Vev can only be updated through the API if it was created with a template.

Template API mode​

To generate the template schema go to the Vev Template Editor and into the API mode.

useEditorState

Now you can start adding content you want to be dynamic for each section in your template. This will generate a schema which can be used to update the project through the API later. You can create as many projects and pages as you want from the same template. You must create a project from a template to be able to update it dynamically.

info

When you add dynamic content, you need to define a human-readable key for it, so you can send in the correct content for each field later.

useEditorState

Your section schema will look something like this. Each section will have its unique _type, and each field will have a unique key which is the name that the field was created with.

useEditorState

This is an example of a section schema:

{
  "_type": "header",
  "--background-color": "string",
  "text": "string",
  "image": "string",
}

The values can be of property text, number, boolean or html.

info

Remember to publish the template to be able to use it from the API.

Page data​

The page data you send into the API, is always an array of sections. It will look something like this:

{
  "id": "project-id",
  "title": "My new project",
  "pages": {
    "id": "page-id",
    "title": "First page",
    "data": [{
      "id": "section-id-1",
      "_type": "headerSection",
      "--background-color": "string",
      "text": "My first page!",
      "image": "http://url-to-image",
    }, {
      "id": "section-id-2",
      "_type": "textSection",
      "text": "<h1>My new project</h1>"",
    }]
  }
},
info

Add your "id" to the project, page and section to be able to update .