Modifying content width of the Sphinx theme 'Read the Docs'

Question

I am using 'Read the Docs' Sphinx theme for my documentation. In the original theme, given below

http://read-the-docs.readthedocs.org/en/latest/theme.html

the content or main layout width is designed to be mobile friendly. However, for my project I would like this to be a bit more wide. I do not know HTML and hence would appreciate if any one could give me some clues to increase the content (layout) width.

Answer 1

Another option is to create a stylesheet in source/_static with just the css you want, e.g.

.wy-nav-content {     max-width: none; } 

or

.wy-nav-content {     max-width: 1200px !important; } 

Make sure the directory is referenced in source/conf.py - I believe by default there's a line to do this, i.e.

# Add any paths that contain custom static files (such as style sheets) here, # relative to this directory. They are copied after the builtin static files, # so a file named "default.css" will overwrite the builtin "default.css". html_static_path = ['_static'] 

Then create a custom layout in source/_templates/layout.html and do something like this to include your stylesheet

{% extends "!layout.html" %} {% block extrahead %}     <link href="{{ pathto("_static/style.css", True) }}" rel="stylesheet" type="text/css"> {% endblock %} 

Assuming you called your stylesheet style.css

Answer 2

In case someone is searching for a simpler answer... combining the ideas from https://samnicholls.net/2016/06/15/how-to-sphinx-readthedocs/ and the above suggestions, I found the easiest way of getting a custom window-width is the following:

1. In conf.py, add a function that adds a custom stylesheet:

   def setup(app):     app.add_css_file('my_theme.css') 

2. In conf.py, state/adjust:

   html_static_path = ['_static']  

3. Create a _static folder/directory if it doesn't exist.

4. Create a file called my_theme.css in the _static folder that contains the lines:

   .wy-nav-content {     max-width: 1200px !important; }