You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

overview.md 8.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247
  1. +++
  2. title = "Overview"
  3. weight = 10
  4. +++
  5. Zola uses the [Tera](https://tera.netlify.com) template engine, which is very similar
  6. to Jinja2, Liquid and Twig.
  7. As this documentation will only talk about how templates work in Zola, please read
  8. the [Tera template documentation](https://tera.netlify.com/docs#templates) if you want
  9. to learn more about it first.
  10. All templates live in the `templates` directory. If you are not sure what variables are available in a template,
  11. you can place `{{ __tera_context }}` in the template to print the whole context.
  12. A few variables are available on all templates except RSS and the sitemap:
  13. - `config`: the [configuration](@/documentation/getting-started/configuration.md) without any modifications
  14. - `current_path`: the path (full URL without `base_url`) of the current page, never starting with a `/`
  15. - `current_url`: the full URL for the current page
  16. - `lang`: the language for the current page; `null` if the page/section doesn't have a language set
  17. The 404 template does not get `current_path` and `current_url` (this information cannot be determined).
  18. ## Standard templates
  19. By default, Zola will look for three templates: `index.html`, which is applied
  20. to the site homepage; `section.html`, which is applied to all sections (any HTML
  21. page generated by creating a directory within your `content` directory); and
  22. `page.html`, which is applied to all pages (any HTML page generated by creating an
  23. `.md` file within your `content` directory).
  24. The homepage is always a section (regardless of whether it contains other pages).
  25. Thus, the `index.html` and `section.html` templates both have access to the
  26. section variables. The `page.html` template has access to the page variables.
  27. The page and section variables are described in more detail in the next section.
  28. ## Built-in templates
  29. Zola comes with three built-in templates: `rss.xml`, `sitemap.xml` and
  30. `robots.txt` (each is described in its own section of this documentation).
  31. Additionally, themes can add their own templates, which will be applied if not
  32. overridden. You can override built-in or theme templates by creating a template with
  33. the same name in the correct path. For example, you can override the RSS template by
  34. creating a `templates/rss.xml` file.
  35. ## Custom templates
  36. In addition to the standard `index.html`, `section.html` and `page.html` templates,
  37. you may also create custom templates by creating an `.html` file in the `templates`
  38. directory. These custom templates will not be used by default. Instead, a custom template will _only_ be used if you apply it by setting the `template` front-matter variable to the path for that template (or if you `include` it in another template that is applied). For example, if you created a custom template for your site's About page called `about.html`, you could apply it to your `about.md` page by including the following front matter in your `about.md` page:
  39. ```md
  40. +++
  41. title = "About Us"
  42. template = "about.html"
  43. +++
  44. ```
  45. Custom templates are not required to live at the root of your `templates` directory.
  46. For example, `product_pages/with_pictures.html` is a valid template.
  47. ## Built-in filters
  48. Zola adds a few filters in addition to [those](https://tera.netlify.com/docs/templates/#built-in-filters) already present
  49. in Tera.
  50. ### markdown
  51. Converts the given variable to HTML using Markdown. This doesn't apply any of the
  52. features that Zola adds to Markdown; for example, internal links and shortcodes won't work.
  53. By default, the filter will wrap all text in a paragraph. To disable this behaviour, you can
  54. pass `true` to the inline argument:
  55. ```jinja2
  56. {{ some_text | markdown(inline=true) }}
  57. ```
  58. ### base64_encode
  59. Encode the variable to base64.
  60. ### base64_decode
  61. Decode the variable from base64.
  62. ## Built-in global functions
  63. Zola adds a few global functions to [those in Tera](https://tera.netlify.com/docs/templates/#built-in-functions)
  64. to make it easier to develop complex sites.
  65. ### `get_page`
  66. Takes a path to an `.md` file and returns the associated page.
  67. ```jinja2
  68. {% set page = get_page(path="blog/page2.md") %}
  69. ```
  70. ### `get_section`
  71. Takes a path to an `_index.md` file and returns the associated section.
  72. ```jinja2
  73. {% set section = get_section(path="blog/_index.md") %}
  74. ```
  75. If you only need the metadata of the section, you can pass `metadata_only=true` to the function:
  76. ```jinja2
  77. {% set section = get_section(path="blog/_index.md", metadata_only=true) %}
  78. ```
  79. ### ` get_url`
  80. Gets the permalink for the given path.
  81. If the path starts with `@/`, it will be treated as an internal
  82. link like the ones used in Markdown, starting from the root `content` directory.
  83. ```jinja2
  84. {% set url = get_url(path="@/blog/_index.md") %}
  85. ```
  86. This can also be used to get the permalinks for static assets, for example if
  87. we want to link to the file that is located at `static/css/app.css`:
  88. ```jinja2
  89. {{/* get_url(path="css/app.css") */}}
  90. ```
  91. By default, assets will not have a trailing slash. You can force one by passing `trailing_slash=true` to the `get_url` function.
  92. An example is:
  93. ```jinja2
  94. {{/* get_url(path="css/app.css", trailing_slash=true) */}}
  95. ```
  96. In the case of non-internal links, you can also add a cachebust of the format `?t=1290192` at the end of a URL
  97. by passing `cachebust=true` to the `get_url` function.
  98. ### `get_image_metadata`
  99. Gets metadata for an image. Currently, the only supported keys are `width` and `height`.
  100. ```jinja2
  101. {% set meta = get_image_metadata(path="...") %}
  102. Our image is {{ meta.width }}x{{ meta.height }}
  103. ```
  104. ### `get_taxonomy_url`
  105. Gets the permalink for the taxonomy item found.
  106. ```jinja2
  107. {% set url = get_taxonomy_url(kind="categories", name=page.taxonomies.category) %}
  108. ```
  109. `name` will almost always come from a variable but in case you want to do it manually,
  110. the value should be the same as the one in the front matter, not the slugified version.
  111. ### `get_taxonomy`
  112. Gets the whole taxonomy of a specific kind.
  113. ```jinja2
  114. {% set categories = get_taxonomy(kind="categories") %}
  115. ```
  116. ### `load_data`
  117. Loads data from a file or URL. Supported file types include *toml*, *json* and *csv*.
  118. Any other file type will be loaded as plain text.
  119. The `path` argument specifies the path to the data file relative to your base directory, where your `config.toml` is.
  120. As a security precaution, if this file is outside the main site directory, your site will fail to build.
  121. ```jinja2
  122. {% set data = load_data(path="content/blog/story/data.toml") %}
  123. ```
  124. The optional `format` argument allows you to specify and override which data type is contained
  125. within the file specified in the `path` argument. Valid entries are `toml`, `json`, `csv`
  126. or `plain`. If the `format` argument isn't specified, then the path extension is used.
  127. ```jinja2
  128. {% set data = load_data(path="content/blog/story/data.txt", format="json") %}
  129. ```
  130. Use the `plain` format for when your file has a toml/json/csv extension but you want to load it as plain text.
  131. For *toml* and *json*, the data is loaded into a structure matching the original data file;
  132. however, for *csv* there is no native notion of such a structure. Instead, the data is separated
  133. into a data structure containing *headers* and *records*. See the example below to see
  134. how this works.
  135. In the template:
  136. ```jinja2
  137. {% set data = load_data(path="content/blog/story/data.csv") %}
  138. ```
  139. In the *content/blog/story/data.csv* file:
  140. ```csv
  141. Number, Title
  142. 1,Gutenberg
  143. 2,Printing
  144. ```
  145. The equivalent json value of the parsed data would be stored in the `data` variable in the
  146. template:
  147. ```json
  148. {
  149. "headers": ["Number", "Title"],
  150. "records": [
  151. ["1", "Gutenberg"],
  152. ["2", "Printing"]
  153. ],
  154. }
  155. ```
  156. #### Remote content
  157. Instead of using a file, you can load data from a remote URL. This can be done by specifying a `url` parameter
  158. to `load_data` rather than `path`.
  159. ```jinja2
  160. {% set response = load_data(url="https://api.github.com/repos/getzola/zola") %}
  161. {{ response }}
  162. ```
  163. By default, the response body will be returned with no parsing. This can be changed by using the `format` argument
  164. as below.
  165. ```jinja2
  166. {% set response = load_data(url="https://api.github.com/repos/getzola/zola", format="json") %}
  167. {{ response }}
  168. ```
  169. #### Data caching
  170. Data file loading and remote requests are cached in memory during the build, so multiple requests aren't made
  171. to the same endpoint.
  172. URLs are cached based on the URL, and data files are cached based on the file modified time.
  173. The format is also taken into account when caching, so a request will be sent twice if it's loaded with two
  174. different formats.
  175. ### `trans`
  176. Gets the translation of the given `key`, for the `default_language` or the `lang`uage given
  177. ```jinja2
  178. {{/* trans(key="title") */}}
  179. {{/* trans(key="title", lang="fr") */}}
  180. ```
  181. ### `resize_image`
  182. Resizes an image file.
  183. Pease refer to [_Content / Image Processing_](@/documentation/content/image-processing/index.md) for complete documentation.