Themes

Themes

The Themes resource is the primary way our system stores the Site themes that generally control the header, footer and CSS styles that can be reused and assigned to many Sites.
Warning: the Themes resource is currently only supported within the Site Builder and internally within the platform. If you are integrating this endpoint be aware that your published themes will be fully backwards compatible, but the specific fields and methods may change in the future.

Theme Model

Theme object

The theme object contains the following fields
Attribute
Type
Description
id
integer
unique id of the theme
active
boolean
Boolean to show this theme to users within the Site Builder
name
string
Unique slug for the theme. Can only contain lowercase letters, numbers and dashes
display_name
string
Theme name that is shown within the Site Builder
parent_id
integer
ID of the parent theme that this theme is extending
render_mode
string
The render mode to be used to render this theme. Choices are legacy or mastertheme
extra_css
string
The CSS used to render this theme
footer_code
string
Extra HTML to add to all the site/theme pages right before the ending </body> tag
footer_template
object
HTML content that will be rendered at the bottom of the page body
header_code
string
Extra HTML to add to all the site/theme pages right before the ending </head> tag
header_template
object
HTML content that will be rendered at the top of the page body
module_templates
list
List of module templates that can be used to override the default HTML used for rendering of various modules
theme_html
string
The main wrapper HTML used to render the theme when using the legacy theme rendering mode
site_override
object
Site override configuration for master themes. Contains a lookup of languages to site_id to be used for overriding content. See site override options for more details
site_override_objects
list
List of site elements that should be overridden by the extended Site ID. See site override options for more details
preview_url
string
Hostname that is used to load the auto-generated thumbnail image used to display the theme in the Site Builder
added
timestamp
Date and time theme was created
modified
timestamp
Date and time theme was modified
user_id
integer
Reference id to the User that created this theme

Example object:

1
{
2
"active":true,
3
"added": "2019-04-25T16:14:06",
4
"display_name": "Custom Theme",
5
"extra_css": "body { background-color: red }",
6
"footer_code": "<script type=\"text/javascript\" src=\"...",
7
"footer_template": {
8
"added": "2019-04-25T16:59:52",
9
"content": "<footer>...</footer>",
10
"id": 123,
11
"modified": "2019-04-25T17:02:17",
12
"type": "footer"
13
},
14
"footer_template_id": 123,
15
"header_code": "<link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,500,600,700,700i|Montserrat:300,400,500,600,700\" rel=\"stylesheet\">",
16
"header_template": {
17
"added": "2019-04-25T16:59:52",
18
"content": "<header id=\"header\"></header>",
19
"id":124,
20
"modified": "2019-04-25T17:02:17",
21
"type": "header"
22
},
23
"header_template_id":124,
24
"id":11,
25
"module_templates": [
26
27
],
28
"name": "custom-api-theme",
29
"parent_id": null,
30
"preview_url": "example.somedomain.com",
31
"render_mode": "legacy",
32
"resource_uri": "/api/v2/themes/11/",
33
"site_override":{
34
"en":174635
35
},
36
"site_override_objects": [
37
"linklists",
38
"pages",
39
"theme_settings",
40
"extra_css",
41
"header_code",
42
"footer_code",
43
"logo_fallback",
44
"plugins"
45
],
46
"style_css": "/* Blank style */",
47
"theme_html": "<!doctype html>\n<html>\n<head>\n <title>{{ page.title }}</title>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale = 1.0, maximum-scale=1.0, user-scalable=no\">\n {% block framework %}\n {% endblock %}\n {% include \"themes/header_content.html\" %}\n</head>\n<body>\n\n{% include \"themes/prebody_content.html\" %}\n\n{% if header_template %}\n{{ header_template|safe }}\n{% endif %}\n\n{% include \"themes/layout_content.html\" %}\n\n{% if footer_template %}\n{{ footer_template|safe }}\n{% endif %}\n\n{% include \"themes/footer_content.html\" %}\n\n</body>\n</html>"
48
}
Copied!

Site Override Options

These configuration options are use to enable a Theme to override the content of any Site that is assigned that Theme. This is called a "master theme" within our platform and can be used to extend pages, page content, theme settings, plugins, etc from one central site_id

site_override

The below configuration would use the content identified in site_override_objects when rendering the site if that site's language is set to en
1
"site_override":{
2
"en": 174635
3
}
Copied!

site_override_objects

The below configuration would denote that most content of the Site should be pulled from the site_override Site. This includes pages, the content on those pages, the navigation list (if applicable), and any plugins enabled.
1
"site_override_objects": [
2
"linklists",
3
"pages",
4
"plugins"
5
]
Copied!

Create a theme

POST /api/v2/themes/

Required fields

Attribute
display_name
theme_html

Example request to create a custom theme

1
{
2
"active":true,
3
"display_name": "Custom Theme",
4
"extra_css": "body { background-color: red }",
5
"footer_code": "<script type=\"text/javascript\" src=\"https://cdnjs.cloudflare.com/ajax/libs/bootstrap-lightbox/0.7.0/bootstrap-lightbox.min.js\">",
6
"footer_template": {
7
"content": "<footer>Footer content</footer>"
8
},
9
"header_code": "<link href=\"https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,500,600,700,700i|Montserrat:300,400,500,600,700\" rel=\"stylesheet\">",
10
"header_template": {
11
"content": "<header id=\"header\">Header content</header>"
12
},
13
"render_mode": "legacy",
14
"style_css": "/* Blank style */",
15
"theme_html": "<!doctype html>\n<html>\n<head>\n <title>{{ page.title }}</title>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale = 1.0, maximum-scale=1.0, user-scalable=no\">\n {% block framework %}\n {% endblock %}\n {% include \"themes/header_content.html\" %}\n</head>\n<body>\n\n{% include \"themes/prebody_content.html\" %}\n\n{% if header_template %}\n{{ header_template|safe }}\n{% endif %}\n\n{% include \"themes/layout_content.html\" %}\n\n{% if footer_template %}\n{{ footer_template|safe }}\n{% endif %}\n\n{% include \"themes/footer_content.html\" %}\n\n</body>\n</html>"
16
}
Copied!

Updating a theme

PUT /api/v2/themes/:id/
Last modified 2yr ago