summaryrefslogtreecommitdiffstats
path: root/doc/development/templating.rst
blob: 73ae6e55e147140f52c952fcc3e56246c4cadee6 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
.. highlight:: html+jinja

.. _templating:

==========
Templating
==========

Sphinx uses the `Jinja <https://jinja.palletsprojects.com/>`_ templating engine
for its HTML templates.  Jinja is a text-based engine, inspired by Django
templates, so anyone having used Django will already be familiar with it. It
also has excellent documentation for those who need to make themselves familiar
with it.


Do I need to use Sphinx's templates to produce HTML?
----------------------------------------------------

No.  You have several other options:

* You can write a :class:`~sphinx.application.TemplateBridge` subclass that
  calls your template engine of choice, and set the :confval:`template_bridge`
  configuration value accordingly.

* You can :ref:`write a custom builder <writing-builders>` that derives from
  :class:`~sphinx.builders.html.StandaloneHTMLBuilder` and calls your template
  engine of choice.

* You can use the :class:`~sphinxcontrib.serializinghtml.PickleHTMLBuilder` that
  produces pickle files with the page contents, and postprocess them using a
  custom tool, or use them in your Web application.


Jinja/Sphinx Templating Primer
------------------------------

The default templating language in Sphinx is Jinja.  It's Django/Smarty inspired
and easy to understand.  The most important concept in Jinja is :dfn:`template
inheritance`, which means that you can overwrite only specific blocks within a
template, customizing it while also keeping the changes at a minimum.

To customize the output of your documentation you can override all the templates
(both the layout templates and the child templates) by adding files with the
same name as the original filename into the template directory of the structure
the Sphinx quickstart generated for you.

Sphinx will look for templates in the folders of :confval:`templates_path`
first, and if it can't find the template it's looking for there, it falls back
to the selected theme's templates.

A template contains **variables**, which are replaced with values when the
template is evaluated, **tags**, which control the logic of the template and
**blocks** which are used for template inheritance.

Sphinx's *basic* theme provides base templates with a couple of blocks it will
fill with data.  These are located in the :file:`themes/basic` subdirectory of
the Sphinx installation directory, and used by all builtin Sphinx themes.
Templates with the same name in the :confval:`templates_path` override templates
supplied by the selected theme.

For example, to add a new link to the template area containing related links all
you have to do is to add a new template called ``layout.html`` with the
following contents::

    {% extends "!layout.html" %}
    {% block rootrellink %}
        <li><a href="https://project.invalid/">Project Homepage</a> &raquo;</li>
        {{ super() }}
    {% endblock %}

By prefixing the name of the overridden template with an exclamation mark,
Sphinx will load the layout template from the underlying HTML theme.

.. important::
   If you override a block, call ``{{ super() }}`` somewhere to render the
   block's original content in the extended template -- unless you don't want
   that content to show up.


Working with the builtin templates
----------------------------------

The builtin **basic** theme supplies the templates that all builtin Sphinx
themes are based on.  It has the following elements you can override or use:

Blocks
~~~~~~

The following blocks exist in the ``layout.html`` template:

``doctype``
    The doctype of the output format.  By default this is XHTML 1.0 Transitional
    as this is the closest to what Sphinx and Docutils generate and it's a good
    idea not to change it unless you want to switch to HTML 5 or a different but
    compatible XHTML doctype.

``linktags``
    This block adds a couple of ``<link>`` tags to the head section of the
    template.

``extrahead``
    This block is empty by default and can be used to add extra contents into
    the ``<head>`` tag of the generated HTML file.  This is the right place to
    add references to JavaScript or extra CSS files.

``relbar1``, ``relbar2``
    This block contains the *relation bar*, the list of related links (the
    parent documents on the left, and the links to index, modules etc. on the
    right).  ``relbar1`` appears before the document, ``relbar2`` after the
    document.  By default, both blocks are filled; to show the relbar only
    before the document, you would override `relbar2` like this::

       {% block relbar2 %}{% endblock %}

``rootrellink``, ``relbaritems``
    Inside the relbar there are three sections: The ``rootrellink``, the links
    from the documentation and the custom ``relbaritems``.  The ``rootrellink``
    is a block that by default contains a list item pointing to the root
    document by default, the ``relbaritems`` is an empty block.  If you
    override them to add extra links into the bar make sure that they are list
    items and end with the :data:`reldelim1`.

``document``
    The contents of the document itself.  It contains the block "body" where
    the individual content is put by subtemplates like ``page.html``.

    .. note::
        In order for the built-in JavaScript search to show a page preview on
        the results page, the document or body content should be wrapped in an
        HTML element containing the ``role="main"`` attribute. For example::

            <div role="main">
              {% block document %}{% endblock %}
            </div>

``sidebar1``, ``sidebar2``
    A possible location for a sidebar.  ``sidebar1`` appears before the document
    and is empty by default, ``sidebar2`` after the document and contains the
    default sidebar.  If you want to swap the sidebar location override this and
    call the ``sidebar`` helper::

        {% block sidebar1 %}{{ sidebar() }}{% endblock %}
        {% block sidebar2 %}{% endblock %}

    (The ``sidebar2`` location for the sidebar is needed by the ``sphinxdoc.css``
    stylesheet, for example.)

``sidebarlogo``
    The logo location within the sidebar.  Override this if you want to place
    some content at the top of the sidebar.

``footer``
    The block for the footer div.  If you want a custom footer or markup before
    or after it, override this one.

The following four blocks are *only* used for pages that do not have assigned a
list of custom sidebars in the :confval:`html_sidebars` config value.  Their use
is deprecated in favor of separate sidebar templates, which can be included via
:confval:`html_sidebars`.

``sidebartoc``
    The table of contents within the sidebar.

    .. deprecated:: 1.0

``sidebarrel``
    The relation links (previous, next document) within the sidebar.

    .. deprecated:: 1.0

``sidebarsourcelink``
    The "Show source" link within the sidebar (normally only shown if this is
    enabled by :confval:`html_show_sourcelink`).

    .. deprecated:: 1.0

``sidebarsearch``
    The search box within the sidebar.  Override this if you want to place some
    content at the bottom of the sidebar.

    .. deprecated:: 1.0


Configuration Variables
~~~~~~~~~~~~~~~~~~~~~~~

Inside templates you can set a couple of variables used by the layout template
using the ``{% set %}`` tag:

.. data:: reldelim1

   The delimiter for the items on the left side of the related bar.  This
   defaults to ``' &raquo;'`` Each item in the related bar ends with the value
   of this variable.

.. data:: reldelim2

   The delimiter for the items on the right side of the related bar.  This
   defaults to ``' |'``.  Each item except of the last one in the related bar
   ends with the value of this variable.

Overriding works like this::

   {% extends "!layout.html" %}
   {% set reldelim1 = ' &gt;' %}

.. data:: script_files

   Add additional script files here, like this::

      {% set script_files = script_files + ["_static/myscript.js"] %}

   .. deprecated:: 1.8.0

      Please use ``.Sphinx.add_js_file()`` instead.

Helper Functions
~~~~~~~~~~~~~~~~

Sphinx provides various Jinja functions as helpers in the template.  You can use
them to generate links or output multiply used elements.

.. function:: pathto(document)

   Return the path to a Sphinx document as a URL.  Use this to refer to built
   documents.

.. function:: pathto(file, 1)
   :no-index:

   Return the path to a *file* which is a filename relative to the root of the
   generated output.  Use this to refer to static files.

.. function:: hasdoc(document)

   Check if a document with the name *document* exists.

.. function:: sidebar()

   Return the rendered sidebar.

.. function:: relbar()

   Return the rendered relation bar.

.. function:: warning(message)

   Emit a warning message.

Global Variables
~~~~~~~~~~~~~~~~

These global variables are available in every template and are safe to use.
There are more, but most of them are an implementation detail and might change
in the future.

.. data:: builder

   The name of the builder (e.g. ``html`` or ``htmlhelp``).

.. data:: copyright

   The value of :confval:`copyright`.

.. data:: docstitle

   The title of the documentation (the value of :confval:`html_title`), except
   when the "single-file" builder is used, when it is set to ``None``.

.. data:: embedded

   True if the built HTML is meant to be embedded in some viewing application
   that handles navigation, not the web browser, such as for HTML help or Qt
   help formats.  In this case, the sidebar is not included.

.. data:: favicon_url

   The relative path to the HTML favicon image from the current document, or
   URL to the favicon, or ``''``.

   .. versionadded:: 4.0

.. data:: file_suffix

   The value of the builder's :attr:`~.SerializingHTMLBuilder.out_suffix`
   attribute, i.e. the file name extension that the output files will get.  For
   a standard HTML builder, this is usually ``.html``.

.. data:: has_source

   True if the reST document sources are copied (if :confval:`html_copy_source`
   is ``True``).

.. data:: language

   The value of :confval:`language`.

.. data:: last_updated

   The build date.

.. data:: logo_url

   The relative path to the HTML logo image from the current document, or URL
   to the logo, or ``''``.

   .. versionadded:: 4.0

.. data:: master_doc

   Same as :data:`root_doc`.

   .. versionchanged:: 4.0

      Renamed to ``root_doc``.

.. data:: root_doc

   The value of :confval:`root_doc`, for usage with :func:`pathto`.

   .. versionchanged:: 4.0

      Renamed from ``master_doc``.

.. data:: pagename

   The "page name" of the current file, i.e. either the document name if the
   file is generated from a reST source, or the equivalent hierarchical name
   relative to the output directory
   (``[directory/]filename_without_extension``).

.. data:: project

   The value of :confval:`project`.

.. data:: release

   The value of :confval:`release`.

.. data:: rellinks

   A list of links to put at the left side of the relbar, next to "next" and
   "prev".  This usually contains links to the general index and other indices,
   such as the Python module index.  If you add something yourself, it must be a
   tuple ``(pagename, link title, accesskey, link text)``.

.. data:: shorttitle

   The value of :confval:`html_short_title`.

.. data:: show_source

   True if :confval:`html_show_sourcelink` is ``True``.

.. data:: sphinx_version

   The version of Sphinx used to build represented as a string for example "3.5.1".

.. data:: sphinx_version_tuple

   The version of Sphinx used to build represented as a tuple of five elements.
   For Sphinx version 3.5.1 beta 3 this would be ``(3, 5, 1, 'beta', 3)``.
   The fourth element can be one of: ``alpha``, ``beta``, ``rc``, ``final``.
   ``final`` always has 0 as the last element.

   .. versionadded:: 4.2

.. data:: docutils_version_info

   The version of Docutils used to build represented as a tuple of five elements.
   For Docutils version 0.16.1 beta 2 this would be ``(0, 16, 1, 'beta', 2)``.
   The fourth element can be one of: ``alpha``, ``beta``, ``candidate``, ``final``.
   ``final`` always has 0 as the last element.

   .. versionadded:: 5.0.2

.. data:: styles

   A list of the names of the main stylesheets as given by the theme or
   :confval:`html_style`.

   .. versionadded:: 5.1

.. data:: title

   The title of the current document, as used in the ``<title>`` tag.

.. data:: use_opensearch

   The value of :confval:`html_use_opensearch`.

.. data:: version

   The value of :confval:`version`.


In addition to these values, there are also all **theme options** available
(prefixed by ``theme_``), as well as the values given by the user in
:confval:`html_context`.

In documents that are created from source files (as opposed to
automatically-generated files like the module index, or documents that already
are in HTML form), these variables are also available:

.. data:: body

   A string containing the content of the page in HTML form as produced by the
   HTML builder, before the theme is applied.

.. data:: display_toc

   A boolean that is True if the toc contains more than one entry.

.. data:: meta

   Document metadata (a dictionary), see :ref:`metadata`.

.. data:: metatags

   A string containing the page's HTML :dudir:`meta` tags.

.. data:: next

   The next document for the navigation.  This variable is either false or has
   two attributes `link` and `title`.  The title contains HTML markup.  For
   example, to generate a link to the next page, you can use this snippet::

      {% if next %}
      <a href="{{ next.link|e }}">{{ next.title }}</a>
      {% endif %}

.. data:: page_source_suffix

   The suffix of the file that was rendered. Since we support a list of
   :confval:`source_suffix`, this will allow you to properly link to the
   original source file.

.. data:: parents

   A list of parent documents for navigation, structured like the :data:`next`
   item.

.. data:: prev

   Like :data:`next`, but for the previous page.

.. data:: sourcename

   The name of the copied source file for the current document.  This is only
   nonempty if the :confval:`html_copy_source` value is ``True``.
   This has empty value on creating automatically-generated files.

.. data:: toc

   The local table of contents for the current page, rendered as HTML bullet
   lists.

.. data:: toctree

   A callable yielding the global TOC tree containing the current page, rendered
   as HTML bullet lists.  Optional keyword arguments:

   ``collapse``
     If true, all TOC entries that are not ancestors of the current page are
     collapsed.
     ``True`` by default.

   ``maxdepth``
     The maximum depth of the tree. Set it to ``-1`` to allow unlimited depth.
     Defaults to the max depth selected in the toctree directive.

   ``titles_only``
     If true, put only top-level document titles in the tree.
     ``False`` by default.

   ``includehidden``
     If true, the ToC tree will also contain hidden entries.
     ``False`` by default.