Sphinx Bootstrap Theme

Overview

Sphinx Bootstrap Theme

This Sphinx theme integrates the Bootstrap CSS / JavaScript framework with various layout options, hierarchical menu navigation, and mobile-friendly responsive design. It is configurable, extensible, and can use any number of different Bootswatch CSS themes.

Introduction and Demos

The theme is introduced and discussed in the following posts:

Examples of the theme in use for some public projects:

The theme demo website also includes an examples page for some useful illustrations of getting Sphinx to play nicely with Bootstrap (also take a look at the examples source for the underlying reStructuredText).

Installation

Installation from PyPI is fairly straightforward:

  1. Install the package:

    $ pip install sphinx_bootstrap_theme
    
  2. Edit the "conf.py" configuration file to point to the bootstrap theme:

    # At the top.
    import sphinx_bootstrap_theme
    
    # ...
    
    # Activate the theme.
    html_theme = 'bootstrap'
    html_theme_path = sphinx_bootstrap_theme.get_html_theme_path()
    

Customization

The theme can be customized in varying ways (some a little more work than others).

Theme Options

The theme provides many built-in options that can be configured by editing your "conf.py" file:

# (Optional) Logo. Should be small enough to fit the navbar (ideally 24x24).
# Path should be relative to the ``_static`` files directory.
html_logo = "my_logo.png"

# Theme options are theme-specific and customize the look and feel of a
# theme further.
html_theme_options = {
    # Navigation bar title. (Default: ``project`` value)
    'navbar_title': "Demo",

    # Tab name for entire site. (Default: "Site")
    'navbar_site_name': "Site",

    # A list of tuples containing pages or urls to link to.
    # Valid tuples should be in the following forms:
    #    (name, page)                 # a link to a page
    #    (name, "/aa/bb", 1)          # a link to an arbitrary relative url
    #    (name, "http://example.com", True) # arbitrary absolute url
    # Note the "1" or "True" value above as the third argument to indicate
    # an arbitrary url.
    'navbar_links': [
        ("Examples", "examples"),
        ("Link", "http://example.com", True),
    ],

    # Render the next and previous page links in navbar. (Default: true)
    'navbar_sidebarrel': True,

    # Render the current pages TOC in the navbar. (Default: true)
    'navbar_pagenav': True,

    # Tab name for the current pages TOC. (Default: "Page")
    'navbar_pagenav_name': "Page",

    # Global TOC depth for "site" navbar tab. (Default: 1)
    # Switching to -1 shows all levels.
    'globaltoc_depth': 2,

    # Include hidden TOCs in Site navbar?
    #
    # Note: If this is "false", you cannot have mixed ``:hidden:`` and
    # non-hidden ``toctree`` directives in the same page, or else the build
    # will break.
    #
    # Values: "true" (default) or "false"
    'globaltoc_includehidden': "true",

    # HTML navbar class (Default: "navbar") to attach to <div> element.
    # For black navbar, do "navbar navbar-inverse"
    'navbar_class': "navbar navbar-inverse",

    # Fix navigation bar to top of page?
    # Values: "true" (default) or "false"
    'navbar_fixed_top': "true",

    # Location of link to source.
    # Options are "nav" (default), "footer" or anything else to exclude.
    'source_link_position': "nav",

    # Bootswatch (http://bootswatch.com/) theme.
    #
    # Options are nothing (default) or the name of a valid theme
    # such as "cosmo" or "sandstone".
    #
    # The set of valid themes depend on the version of Bootstrap
    # that's used (the next config option).
    #
    # Currently, the supported themes are:
    # - Bootstrap 2: https://bootswatch.com/2
    # - Bootstrap 3: https://bootswatch.com/3
    'bootswatch_theme': "united",

    # Choose Bootstrap version.
    # Values: "3" (default) or "2" (in quotes)
    'bootstrap_version': "3",
}

Note for the navigation bar title that if you don't specify a theme option of navbar_title that the "conf.py" project string will be used. We don't use the html_title or html_short_title values because by default those both contain version strings, which the navigation bar treats differently.

Bootstrap Versions

The theme supports Bootstrap v2.3.2 and v3.3.7 via the bootstrap_version theme option (of "2" or "3"). Some notes regarding version differences:

  • Bootstrap 3 has dropped support for sub-menus, so while supported by this theme, they will not show up in site or page menus.
  • Internally, "navbar.html" is the Sphinx template used for Bootstrap v3 and "navbar-2.html" is the template used for v2.
  • If you are unsure what to choose, choose Bootstrap 3. If you experience some form of compatibility issues, then try and use Bootstrap 2.

Extending "layout.html"

As a more "hands on" approach to customization, you can override any template in this Sphinx theme or any others. A good candidate for changes is "layout.html", which provides most of the look and feel. First, take a look at the "layout.html" file that the theme provides, and figure out what you need to override. As a side note, we have some theme-specific enhancements, such as the navbarextra template block for additional content in the navbar.

Then, create your own "_templates" directory and "layout.html" file (assuming you build from a "source" directory):

$ mkdir source/_templates
$ touch source/_templates/layout.html

Then, configure your "conf.py":

templates_path = ['_templates']

Finally, edit your override file "source/_templates/layout.html":

{# Import the theme's layout. #}
{% extends "!layout.html" %}

{# Add some extra stuff before and use existing with 'super()' call. #}
{% block footer %}
  <h2>My footer of awesomeness.</h2>
  {{ super() }}
{% endblock %}

Adding Custom CSS

Alternately, you could add your own custom static media directory with a CSS file to override a style, which in the demo would be something like:

$ mkdir source/_static
$ touch source/_static/my-styles.css

In the new file "source/_static/my-styles.css", add any appropriate styling, e.g. a bold background color:

footer {
  background-color: red;
}

Then, in "conf.py", edit this line:

html_static_path = ["_static"]

From there it depends on which version of Sphinx you are using:

Sphinx <= 1.5

You will need the override template "source/_templates/layout.html" file configured as above, but with the following code:

{# Import the theme's layout. #}
{% extends "!layout.html" %}

{# Custom CSS overrides #}
{% set css_files = css_files + ['_static/my-styles.css'] %}

Note

See Issue #159 for more information.

Sphinx >= 1.6.1

Add a setup function in "conf.py" with stylesheet paths added relative to the static path:

def setup(app):
    app.add_stylesheet("my-styles.css") # also can be a full URL
    # app.add_stylesheet("ANOTHER.css")
    # app.add_stylesheet("AND_ANOTHER.css")

Tip

Sphinx automatically calls your setup function defined in "conf.py" during the build process for you. There is no need to, nor should you, call this function directly in your code.

Theme Notes

Sphinx

The theme places the global TOC, local TOC, navigation (prev, next) and source links all in the top Bootstrap navigation bar, along with the Sphinx search bar on the left side.

The global (site-wide) table of contents is the "Site" navigation dropdown, which is a configurable level rendering of the toctree for the entire site. The local (page-level) table of contents is the "Page" navigation dropdown, which is a multi-level rendering of the current page's toc.

Bootstrap

The theme offers Bootstrap v2.x and v3.x, both of which rely on jQuery v.1.9.x. As the jQuery that Bootstrap wants can radically depart from the jQuery Sphinx internal libraries use, the library from this theme is integrated via noConflict() as $jqTheme.

You can override any static JS/CSS files by dropping different versions in your Sphinx "_static" directory.

Contributing

Contributions to this project are most welcome. Please make sure that the demo site builds cleanly, and looks like what you want. We suggest using pipenv to build this project:

$ cd sphinx-bootstrap-theme
$ pipenv install --dev

Before working in this project directory, do:

$ pipenv shell

Next, build the demo:

$ fab clean && fab demo

Then, view the site in the development server:

$ fab demo_server

Also, if you are adding a new type of styling or Sphinx or Bootstrap construct, please add a usage example to the "Examples" page.

Note: If you are in Python 3, Fabric isn't available, so we have a very rough Makefile in its place. Try:

$ make clean && make demo

Then, view the site in the development server:

$ make demo_server

Licenses

Sphinx Bootstrap Theme is licensed under the MIT license.

Bootstrap v2 is licensed under the Apache license 2.0.

Bootstrap v3.1.0+ is licensed under the MIT license.

Owner
Ryan Roemer
Software geek, former patent attorney, & co-founder of @FormidableLabs. Curator of @SeaNode.
Ryan Roemer
Your Project with Great Documentation.

Read Latest Documentation - Browse GitHub Code Repository The only thing worse than documentation never written, is documentation written but never di

Timothy Edmund Crosley 809 Dec 28, 2022
Xanadu Quantum Codebook is an experimental, exercise-based introduction to quantum computing using PennyLane.

Xanadu Quantum Codebook The Xanadu Quantum Codebook is an experimental, exercise-based introduction to quantum computing using PennyLane. This reposit

Xanadu 43 Dec 09, 2022
A simple flask application to collect annotations for the Turing Change Point Dataset, a benchmark dataset for change point detection algorithms

AnnotateChange Welcome to the repository of the "AnnotateChange" application. This application was created to collect annotations of time series data

The Alan Turing Institute 16 Jul 21, 2022
Example Python code for running the mango-explorer marketmaker

🥭 Mango Explorer 📖 Introduction This guide will show you how to load and run a customisable marketmaker that runs on Mango Markets using the mango-e

Blockworks Foundation 2 Apr 11, 2022
JMESPath is a query language for JSON.

JMESPath JMESPath (pronounced "james path") allows you to declaratively specify how to extract elements from a JSON document. For example, given this

1.7k Dec 31, 2022
📚 Papers & tech blogs by companies sharing their work on data science & machine learning in production.

applied-ml Curated papers, articles, and blogs on data science & machine learning in production. ⚙️ Figuring out how to implement your ML project? Lea

Eugene Yan 22.1k Jan 03, 2023
Spin-off Notice: the modules and functions used by our research notebooks have been refactored into another repository

Fecon235 - Notebooks for financial economics. Keywords: Jupyter notebook pandas Federal Reserve FRED Ferbus GDP CPI PCE inflation unemployment wage income debt Case-Shiller housing asset portfolio eq

Adriano 825 Dec 27, 2022
Automatic links from code examples to reference documentation

sphinx-codeautolink Automatic links from Python code examples to reference documentation at the flick of a switch! sphinx-codeautolink analyses the co

Felix Hildén 41 Dec 17, 2022
EasyMultiClipboard - Python script written to handle more than 1 string in clipboard

EasyMultiClipboard - Python script written to handle more than 1 string in clipboard

WVlab 1 Jun 18, 2022
The purpose of this project is to share knowledge on how awesome Streamlit is and can be

Awesome Streamlit The fastest way to build Awesome Tools and Apps! Powered by Python! The purpose of this project is to share knowledge on how Awesome

Marc Skov Madsen 1.5k Jan 07, 2023
An open source utility for creating publication quality LaTex figures generated from OpenFOAM data files.

foamTEX An open source utility for creating publication quality LaTex figures generated from OpenFOAM data files. Explore the docs » Report Bug · Requ

1 Dec 19, 2021
Python Tool to Easily Generate Multiple Documents

Python Tool to Easily Generate Multiple Documents Running the script doesn't require internet Max Generation is set to 10k to avoid lagging/crashing R

2 Apr 27, 2022
In this Github repository I will share my freqtrade files with you. I want to help people with this repository who don't know Freqtrade so much yet.

My Freqtrade stuff In this Github repository I will share my freqtrade files with you. I want to help people with this repository who don't know Freqt

Simon Kebekus 104 Dec 31, 2022
BakTst_Org is a backtesting system for quantitative transactions.

BakTst_Org 中文reademe:传送门 Introduction: BakTst_Org is a prototype of the backtesting system used for BTC quantitative trading. This readme is mainly di

18 May 08, 2021
:blue_book: Automatic documentation from sources, for MkDocs.

mkdocstrings Automatic documentation from sources, for MkDocs. Features - Python handler - Requirements - Installation - Quick usage Features Language

1.1k Jan 04, 2023
python package sphinx template

python-package-sphinx-template python-package-sphinx-template

Soumil Nitin Shah 2 Dec 26, 2022
python wrapper for simple-icons

simpleicons Use a wide-range of icons derived from the simple-icons repo in python. Go to their website for a full list of icons. The slug version mus

Sachin Raja 14 Nov 07, 2022
Python syntax highlighted Markdown doctest.

phmdoctest 1.3.0 Introduction Python syntax highlighted Markdown doctest Command line program and Python library to test Python syntax highlighted cod

Mark Taylor 16 Aug 09, 2022
Members: Thomas Longuevergne Program: Network Security Course: 1DV501 Date of submission: 2021-11-02

Mini-project report Members: Thomas Longuevergne Program: Network Security Course: 1DV501 Date of submission: 2021-11-02 Introduction This project was

1 Nov 08, 2021
The source code that powers readthedocs.org

Welcome to Read the Docs Purpose Read the Docs hosts documentation for the open source community. It supports Sphinx docs written with reStructuredTex

Read the Docs 7.4k Dec 25, 2022