Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

New Sphinx tutorial, part II #9355

Merged
merged 31 commits into from
Jul 6, 2021
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
31 commits
Select commit Hold shift + click to select a range
1cbaf7f
Minor style fixes
astrojuanlu Jun 15, 2021
167828f
Add section about exporting to other formats
astrojuanlu Jun 15, 2021
dc5dc61
Turn plain image into figure
astrojuanlu Jun 16, 2021
1e49218
Add tutorial section about extensions and themes
astrojuanlu Jun 16, 2021
2058acc
Add local table of contents
astrojuanlu Jun 16, 2021
57b0a1b
Add section about the toctree
astrojuanlu Jun 16, 2021
e022872
Add section about cross-references
astrojuanlu Jun 16, 2021
5a057d3
Actually use new theme
astrojuanlu Jun 16, 2021
fb23605
Apply style suggestions from code review
astrojuanlu Jun 21, 2021
6f71c7b
Use absolute links for Sphinx documentation references
astrojuanlu Jun 21, 2021
e75f31a
Add link to third-party sphinx-themes
astrojuanlu Jun 21, 2021
d08c367
Avoid reference to earlier content
astrojuanlu Jun 21, 2021
3fcaa17
Move reference to list of Pygments lexers
astrojuanlu Jun 21, 2021
8377a55
Simplify out-of-toctree warning
astrojuanlu Jun 21, 2021
0581a17
Clarify this is about HTML themes
astrojuanlu Jun 21, 2021
3571426
Add text representation of the document structure
astrojuanlu Jun 21, 2021
e865c52
Add filenames as captions for relevant code blocks
astrojuanlu Jun 21, 2021
106346a
Make section title more goal-oriented
astrojuanlu Jun 21, 2021
a3478eb
Update doc/tutorial/index.rst
astrojuanlu Jun 21, 2021
5f41044
Tone down LaTeX info to "note"
astrojuanlu Jun 22, 2021
c9d2a73
Rename to root document
astrojuanlu Jun 22, 2021
15fe52d
Separate extensions and themes more clearly
astrojuanlu Jun 22, 2021
013e67f
Clarify what happens if no title is used in the :ref:
astrojuanlu Jun 22, 2021
1383157
Keep old name for root document in the glossary
astrojuanlu Jul 5, 2021
d5f452a
Remove redundant local table of contents
astrojuanlu Jul 5, 2021
74e565f
Consistent use of "build documentation"
astrojuanlu Jul 5, 2021
50bd1c3
Remove unnecessary label
astrojuanlu Jul 5, 2021
f303a4a
Consistent use of "rst" for syntax highlight
astrojuanlu Jul 5, 2021
6f9bc6e
Use "builtin" for extensions label as it is done for themes
astrojuanlu Jul 5, 2021
cb846a3
Add link to docutils docs
astrojuanlu Jul 5, 2021
b9da157
Merge branch '4.x' into new-tutorial-part-ii
astrojuanlu Jul 5, 2021
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
Binary file added doc/_static/tutorial/lumache-furo.png
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions doc/glossary.rst
Expand Up @@ -76,6 +76,9 @@ Glossary
master document
astrojuanlu marked this conversation as resolved.
Show resolved Hide resolved
The document that contains the root :rst:dir:`toctree` directive.

root document
Same as :term:`master document`.

object
The basic building block of Sphinx documentation. Every "object
directive" (e.g. :rst:dir:`function` or :rst:dir:`object`) creates such a
Expand Down
2 changes: 1 addition & 1 deletion doc/templating.rst
Expand Up @@ -115,7 +115,7 @@ The following blocks exist in the ``layout.html`` template:
``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 master
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`.
Expand Down
276 changes: 268 additions & 8 deletions doc/tutorial/index.rst
Expand Up @@ -36,7 +36,8 @@ Setting up your project and development environment
In a new directory, create a file called ``README.rst`` with the following
content.

.. code-block:: rest
.. code-block:: rst
:caption: README.rst

Lumache
=======
Expand Down Expand Up @@ -124,7 +125,7 @@ The purpose of each of these files is:
as some extra configuration keys.

``source/index.rst``
The :term:`master document` of the project, which serves as welcome page and
The :term:`root document` of the project, which serves as welcome page and
contains the root of the "table of contents tree" (or *toctree*).

Thanks to this bootstrapping step, you already have everything needed to render
Expand All @@ -134,23 +135,32 @@ the documentation as HTML for the first time. To do that, run this command:

(.venv) $ sphinx-build -b html docs/source/ docs/build/html

And finally, open `docs/build/html/index.html` in your browser. You should see
And finally, open ``docs/build/html/index.html`` in your browser. You should see
something like this:

.. image:: /_static/tutorial/lumache-first-light.png
.. figure:: /_static/tutorial/lumache-first-light.png
:width: 80%
:align: center
:alt: Freshly created documentation of Lumache

Freshly created documentation of Lumache

There we go! You created your first HTML documentation using Sphinx.

Making some tweaks to the index
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
First steps to document your project using Sphinx
-------------------------------------------------

Building your HTML documentation
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

The ``index.rst`` file that ``sphinx-quickstart`` created has some content
already, and it gets rendered as the front page of our HTML documentation. It
already, and it gets rendered as the front page of your HTML documentation. It
is written in reStructuredText, a powerful markup language.

Modify the file as follows:

.. code-block:: rest
.. code-block:: rst
:caption: docs/source/index.rst

Welcome to Lumache's documentation!
===================================
Expand Down Expand Up @@ -184,6 +194,256 @@ as before, or leverage the convenience script as follows:
After running this command, you will see that ``index.html`` reflects the new
changes!

Building your documentation in other formats
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Sphinx supports a variety of formats apart from HTML, including PDF, EPUB,
:ref:`and more <builders>`. For example, to build your documentation
in EPUB format, run this command from the ``docs`` directory:

.. code-block:: console

(.venv) $ make epub
astrojuanlu marked this conversation as resolved.
Show resolved Hide resolved

After that, you will see the files corresponding to the e-book under
``docs/build/epub/``. You can either open ``Lumache.epub`` with an
EPUB-compatible e-book viewer, like `Calibre <https://calibre-ebook.com/>`_,
or preview ``index.xhtml`` on a web browser.

.. note::

To quickly display a complete list of possible output formats, plus some
extra useful commands, you can run :code:`make help`.

Each output format has some specific configuration options that you can tune,
:ref:`including EPUB <epub-options>`. For instance, the default value of
:confval:`epub_show_urls` is ``inline``, which means that, by default, URLs are
shown right after the corresponding link, in parentheses. You can change that
behavior by adding the following code at the end of your ``conf.py``:

.. code-block:: python

# EPUB options
epub_show_urls = 'footnote'

With this configuration value, and after running ``make epub`` again, you will
notice that URLs appear now as footnotes, which avoids cluttering the text.
Sweet!

.. note::

Generating a PDF using Sphinx can be done running ``make latexpdf``,
provided that the system has a working :math:`\LaTeX` installation,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This breaks PDF production, as \(\LaTeX\) mark-up is invalid. \LaTeX can not be used in math mode.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Woops, sorry. Let's continue the conversation in #9475 and #9476

as explained in the documentation of :class:`sphinx.builders.latex.LaTeXBuilder`.
Although this is perfectly feasible, such installations are often big,
and in general LaTeX requires careful configuration in some cases,
so PDF generation is out of scope for this tutorial.

More Sphinx customization
-------------------------

There are two main ways to customize your documentation beyond what is possible
with core Sphinx: extensions and themes.

astrojuanlu marked this conversation as resolved.
Show resolved Hide resolved
Enabling a built-in extension
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

In addition to these configuration values, you can customize Sphinx even more
by using :doc:`extensions </usage/extensions/index>`. Sphinx ships several
:ref:`builtin ones <builtin-extensions>`, and there are many more
:ref:`maintained by the community <third-party-extensions>`.

For example, to enable the :mod:`sphinx.ext.duration` extension,
locate the ``extensions`` list in your ``conf.py`` and add one element as
follows:

.. code-block:: python
:caption: docs/source/conf.py

# Add any Sphinx extension module names here, as strings. They can be
# extensions coming with Sphinx (named 'sphinx.ext.*') or your custom
# ones.
extensions = [
'sphinx.ext.duration',
]

After that, every time you generate your documentation, you will see a short
durations report at the end of the console output, like this one:

.. code-block:: console

(.venv) $ make html
...
The HTML pages are in build/html.

====================== slowest reading durations =======================
0.042 temp/source/index
astrojuanlu marked this conversation as resolved.
Show resolved Hide resolved

Using a third-party HTML theme
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Themes, on the other hand, are a way to customize the appearance of your
documentation. Sphinx has several :ref:`builtin themes <builtin-themes>`, and
there are also `third-party ones <https://sphinx-themes.org/>`_.

For example, to use the `Furo <https://pradyunsg.me/furo/>`_ third-party theme
in your HTML documentation, first you will need to install it with ``pip`` in
your Python virtual environment, like this:

.. code-block:: console

(.venv) $ pip install furo

And then, locate the ``html_theme`` variable on your ``conf.py`` and replace
its value as follows:

.. code-block:: python
:caption: docs/source/conf.py

# The theme to use for HTML and HTML Help pages. See the documentation for
# a list of builtin themes.
#
html_theme = 'furo'

With this change, you will notice that your HTML documentation has now a new
appearance:

.. figure:: /_static/tutorial/lumache-furo.png
:width: 80%
:align: center
:alt: HTML documentation of Lumache with the Furo theme

HTML documentation of Lumache with the Furo theme

Narrative documentation in Sphinx
---------------------------------

Structuring your documentation across multiple pages
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

The file ``index.rst`` created by ``sphinx-quickstart`` is the :term:`root
document`, whose main function is to serve as a welcome page and to contain the
astrojuanlu marked this conversation as resolved.
Show resolved Hide resolved
root of the "table of contents tree" (or *toctree*). Sphinx allows you to
assemble a project from different files, which is helpful when the project
grows.

As an example, create a new file ``docs/source/usage.rst`` (next to
``index.rst``) with these contents:

.. code-block:: rst
:caption: docs/source/usage.rst

Usage
astrojuanlu marked this conversation as resolved.
Show resolved Hide resolved
=====

Installation
------------

To use Lumache, first install it using pip:

.. code-block:: console

(.venv) $ pip install lumache

This new file contains two :ref:`section <rst-sections>` headers, normal
paragraph text, and a :rst:dir:`code-block` directive that renders
a block of content as source code, with appropriate syntax highlighting
(in this case, generic ``console`` text).

The structure of the document is determined by the succession of heading
styles, which means that, by using ``---`` for the "Installation" section
after ``===`` for the "Usage" section, you have declared "Installation" to
be a *subsection* of "Usage".

To complete the process, add a ``toctree`` :ref:`directive <rst-directives>` at
the end of ``index.rst`` including the document you just created, as follows:

.. code-block:: rst
:caption: docs/source/index.rst

Contents
--------

.. toctree::

usage

This step inserts that document in the root of the *toctree*, so now it belongs
to the structure of your project, which so far looks like this:

.. code-block:: text

index
└── usage

If you build the HTML documentation running ``make html``, you will see
that the ``toctree`` gets rendered as a list of hyperlinks, and this allows you
to navigate to the new page you just created. Neat!

.. warning::

Documents outside a *toctree* will result in ``WARNING: document isn't
included in any toctree`` messages during the build process, and will be
unreachable for users.

Adding cross-references
~~~~~~~~~~~~~~~~~~~~~~~

One powerful feature of Sphinx is the ability to seamlessly add
:ref:`cross-references <xref-syntax>` to specific parts of the documentation:
a document, a section, a figure, a code object, etc. This tutorial is full of
them!

To add a cross-reference, write this sentence right after the
introduction paragraph in ``index.rst``:

.. code-block:: rst
:caption: docs/source/index.rst

Check out the :doc:`usage` section for further information.

The :rst:role:`doc` role you used automatically references a specific document
in the project, in this case the ``usage.rst`` you created earlier.

Alternatively, you can also add a cross-reference to an arbitrary part of the
project. For that, you need to use the :rst:role:`ref` role, and add an
explicit *label* that acts as `a target`__.

__ https://docutils.sourceforge.io/docs/ref/rst/restructuredtext.html#hyperlink-targets
astrojuanlu marked this conversation as resolved.
Show resolved Hide resolved

For example, to reference the "Installation" subsection, add a label right
before the heading, as follows:

.. code-block:: rst
:caption: docs/source/usage.rst
:emphasize-lines: 4

astrojuanlu marked this conversation as resolved.
Show resolved Hide resolved
Usage
=====

.. _installation:

Installation
------------

...

And make the sentence you added in ``index.rst`` look like this:

.. code-block:: rst
:caption: docs/source/index.rst

Check out the :doc:`usage` section for further information, including how to
:ref:`install <installation>` the project.

Notice a trick here: the ``install`` part specifies how the link will look like
(we want it to be a specific word, so the sentence makes sense), whereas the
``<installation>`` part refers to the actual label we want to add a
cross-reference to. If you do not include an explicit title, hence using
``:ref:`installation```, the section title will be used (in this case,
``Installation``). Both the ``:doc:`` and the ``:ref:`` roles will be rendered
as hyperlinks in the HTML documentation.
astrojuanlu marked this conversation as resolved.
Show resolved Hide resolved

Where to go from here
---------------------

Expand Down
2 changes: 1 addition & 1 deletion doc/usage/advanced/setuptools.rst
Expand Up @@ -164,7 +164,7 @@ Options for setuptools integration

.. setuptools-confval:: link-index

A boolean that ensures index.html will be linked to the master doc. Default
A boolean that ensures index.html will be linked to the root doc. Default
is false.

This can also be set by passing the `-i` flag to ``setup.py``:
Expand Down
2 changes: 1 addition & 1 deletion doc/usage/builders/index.rst
Expand Up @@ -51,7 +51,7 @@ The builder's "name" must be given to the **-b** command-line option of

This is an HTML builder that combines the whole project in one output file.
(Obviously this only works with smaller projects.) The file is named like
the master document. No indices will be generated.
the root document. No indices will be generated.

.. autoattribute:: name

Expand Down
4 changes: 4 additions & 0 deletions doc/usage/extensions/index.rst
Expand Up @@ -10,6 +10,8 @@ This chapter describes the extensions bundled with Sphinx. For the API
documentation on writing your own extension, refer to :ref:`dev-extensions`.


.. _builtin-extensions:

Built-in extensions
-------------------

Expand Down Expand Up @@ -38,6 +40,8 @@ These extensions are built in and can be activated by respective entries in the
viewcode


.. _third-party-extensions:

Third-party extensions
----------------------

Expand Down