Special Content blocks

Special Content blocks#

Note

This page contains only excerpts from my frequently used syntax. For the full documentation, please see {book}theme.


Quotations and epigraphs#


Default markdown quotes#

Here’s my quote, it’s pretty neat. I wonder how many lines I can create with a single stream-of-consciousness quote. I could try to add a list of ideas to talk about. I suppose I could just keep going on forever, but I’ll stop here.


markdown#
    ```{margin} **margin note content**
    your margin content
    ```
    
    Default markdown quotes
    
    > your quotes
    > your quotes
    > your quotes

Epigraph with attribution#

Here’s my quote, it’s pretty neat. I wonder how many lines I can create with a single stream-of-consciousness quote. I could try to add a list of ideas to talk about. I suppose I could just keep going on forever, but I’ll stop here.

—Jo the Jovyan, the jupyter book docs


markdown#
    ```{epigraph}
    Here's my quote, it's pretty neat.
    I wonder how many lines I can create with
    a single stream-of-consciousness quote.
    I could try to add a list of ideas to talk about.
    I suppose I could just keep going on forever,
    but I'll stop here.
    
    -- Jo the Jovyan, *[the jupyter book docs](https://jupyterbook.org)*
    ```

Text with footnote on side#

Lorem ipsum dolor sit amet, consetetur sadipscing 1And here’s my sidenote content. elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.


markdown#
    Lorem ipsum dolor sit amet, consetetur sadipscing [^sn2] elitr.
    
    [^sn2]: And here's my sidenote content.

CSS classes for custom margin content#


Margin Note#

Note

This note will be in the margin!

This works for most elements on the page, but in general this works best for “parent containers” that are the top-most element of a bundle of content. For example, you can also put the whole figure in the margin if you like. Here is a figure with a caption below. We’ll add a note below to create some vertical space to see better.


markdown#
    :::{note}
    :class: margin
    This note will be in the margin!
    :::
    
    Lorem ipsum dolor sit amet, consetetur sadipscing And here’s my sidenote content. elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Content examples in the margin#

Margin content can include all kinds of things, such as code blocks:

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.


markdown#
    ````{margin} Code blocks in margins
    ```python
    print("here is some python")
    ```
    `````
    
    Lorem ipsum dolor sit amet, consetetur

Full-width content#

Full-width content extends into the right margin, making it stand out against the rest of your book’s content. To add full-width content to your page, add the class full-width to any of the elements in your documentation. For example, you can add a full-width tag to a note element like this:

Note

This content will be full-width


markdown#
    ```{note}
    :class: full-width
    This content will be full-width
    ```

Data Elements#

Code blocks#

python code highlighting#
print("A code block with a caption.")

SQL code highlighting#
SELECT *
FROM AnyTable


markdown#
    ```{code-block} sql
    :caption: SQL
    
    {code-block} python
    {code-block}
    ```
Contents