diff --git a/docs/components/custom-css.md b/docs/components/custom-css.md
index af48628e8..e6a1f084e 100644
--- a/docs/components/custom-css.md
+++ b/docs/components/custom-css.md
@@ -13,7 +13,24 @@ h1 {
 ```
 
 You also need these two lines in your `conf.py` file
+
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_static_path = ["_static"]
 html_css_files = ["custom.css"]
 ```
+
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+Not needed for Jupyter Book.
+
+````
+
+`````
diff --git a/docs/components/download.md b/docs/components/download.md
index 152a86ef3..e60c5f12d 100644
--- a/docs/components/download.md
+++ b/docs/components/download.md
@@ -4,6 +4,11 @@
 You can add a button allowing users to download the currently viewed page in several formats: `raw source`, `pdf` or `ipynb` if one was generated as part of the build.
 To include this button, use the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
     ...
@@ -12,6 +17,23 @@ html_theme_options = {
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        html_theme_options:
+            use_download_button: true
+```
+
+````
+
+`````
+
+
 ```{note}
 This theme over-rides the Sphinx default for `html_sourcelink_suffix` to be `''` instead of `.txt`.
 This is because most users of this theme want to download source files of the pages themselves, which do not begin with `.txt`.
diff --git a/docs/components/source-files.md b/docs/components/source-files.md
index 32ca6a576..07d5a273c 100644
--- a/docs/components/source-files.md
+++ b/docs/components/source-files.md
@@ -12,14 +12,35 @@ You need to define a **source repository** for this functionality to work.
 This is the online space where your code / documentation is hosted.
 In each case, they require the following configuration to exist:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
-    ...
-    "repository_url": "https://{your-provider}/{org}/{repo}",
-    ...
+    "repository_url": "https://github.com/{your-docs-url}",
+    "use_repository_button": True,
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+html:
+    use_repository_button: true
+
+repository:
+    url: "https://github.com/{your-docs-url}"
+```
+
+````
+
+`````
+
 Three providers are supported:
 
 - **GitHub**: For example, `https://github.com/executablebooks/sphinx-book-theme`.
@@ -34,15 +55,37 @@ In each case, we **assume the final two URL items are the `org/repo` pair**.
 
 If your provider URL is more complex (e.g., if you're self-hosting your provider), you can manually specify the provider with the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
-    ...
     "repository_provider": "gitlab"  # or "github", "bitbucket",
     "repository_url": "selfhostedgh.mycompany.org/user/repo",
-    ...
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+repository:
+    url: "selfhostedgh.mycompany.org/user/repo"
+
+sphinx:
+    config:
+        html_theme_options:
+            repository_provider: "gitlab"  # or "github", "bitbucket"
+```
+
+````
+
+`````
+
 Once this is provided, you may add source buttons by following the following sections.
 
 (source-buttons:source)=
@@ -51,49 +94,119 @@ Once this is provided, you may add source buttons by following the following sec
 Show the raw source of the page on the provider you've proivded.
 To add a button to the page source, first [configure your source repository](source-buttons:repository) and then add:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
-    ...
     "use_source_button": True,
-    ...
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        html_theme_options:
+            use_source_button: true
+```
+
+````
+
+`````
+
 Then configure the **repository branch** to use for your source.
 By default it is `main`, but if you'd like to change this, use the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
-    ...
     "repository_branch": "{your-branch}",
-    ...
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+repository:
+    branch: "{your-branch}"
+```
+
+````
+
+`````
+
 Finally, **configure the relative path to your documentation**.
 By default, this is the root of the repository, but if your documentation is hosted in a sub-folder, use the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
-    ...
     "path_to_docs": "{path-relative-to-site-root}",
-    ...
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+repository:
+    path_to_book: "{path-relative-to-site-root}"
+```
+
+````
+
+`````
+
 ## Add a button to suggest edits
 
 Allow users to edit the page text directly on the provider and submit a pull request to update the documentation.
 To add a button to edit the page, first [configure your source repository](source-buttons:repository) and then add:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
-    ...
     "use_edit_page_button": True,
-    ...
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+html:
+    use_edit_page_button: true
+```
+
+````
+
+`````
+
 Then follow the [branch and relative path instructions in the source file section](source-buttons:source).
 
 
@@ -102,23 +215,57 @@ Then follow the [branch and relative path instructions in the source file sectio
 
 To add a link to your repository, add the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
-    ...
     "use_repository_button": True,
-    ...
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+html:
+    use_repository_button: true
+```
+
+````
+
+`````
+
 ## Add a button to open issues
 
 To add a button to open an issue about the current page, use the following
 configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
-    ...
     "use_issues_button": True,
-    ...
 }
 ```
+
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+html:
+    use_issues_button: true
+```
+
+````
+
+`````
diff --git a/docs/content/launch.md b/docs/content/launch.md
index 8c851c344..dce50ac29 100644
--- a/docs/content/launch.md
+++ b/docs/content/launch.md
@@ -8,6 +8,11 @@ that runs in the cloud, or by making your page interactive using Thebe.
 To use either Binder or JupyterHub links, you'll first need to configure your
 documentation's repository url:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
     ...
@@ -18,6 +23,22 @@ html_theme_options = {
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+repository:
+    url: "https://github.com/{your-docs-url}"
+    branch: "{your-branch}"
+    path_to_book: "{path-relative-to-site-root}"
+```
+
+````
+
+`````
+
 ```{margin} Paired ipynb files
 
 If you're using [Jupytext](https://jupytext.readthedocs.io/en/latest/) to
@@ -30,6 +51,11 @@ file instead of the text file.
 
 To add Binder links to your page, add the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
     ...
@@ -40,24 +66,61 @@ html_theme_options = {
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+launch_buttons:
+    binderhub_url: "https://{your-binderhub-url}"
+```
+
+````
+
+`````
+
 ## JupyterHub
 
 To add JupyterHub links to your page, add the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
     ...
     "launch_buttons": {
         "jupyterhub_url": "https://{your-binderhub-url}"
-    },
     ...
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+launch_buttons:
+    jupyterhub_url: "https://{your-binderhub-url}"
+```
+
+````
+
+`````
+
 ## Google Colab
 
 To add Google Colab links to your page, add the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
     ...
@@ -67,10 +130,30 @@ html_theme_options = {
     ...
 }
 ```
+
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+launch_buttons:
+    colab_url: "https://colab.research.google.com"
+```
+
+````
+
+`````
+
 ## Deepnote
 
 To add [Deepnote](https://deepnote.com) links to your page, add the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
     ...
@@ -81,6 +164,20 @@ html_theme_options = {
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+launch_buttons:
+    deepnote_url: "https://deepnote.com"
+```
+
+````
+
+`````
+
 ```{warning}
 This will create a new Deepnote project every time you click the launch button.
 ```
@@ -99,6 +196,11 @@ You can use the Sphinx extension
 live code functionality to your documentation. You can install `sphinx-thebe` from `pip`,
 then activate it by putting it in your `conf.py` extensions list:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 extensions = [
     ...
@@ -107,9 +209,28 @@ extensions = [
 ]
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+execute:
+    execute_notebooks: auto
+```
+
+````
+
+`````
+
 If you'd like to activate UI elements for `sphinx-thebe` in the `sphinx-book-theme`,
 add the following theme configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
     ...
@@ -120,11 +241,30 @@ html_theme_options = {
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+launch_buttons:
+    thebe: True
+```
+
+````
+
+`````
+
 This will add a custom launch button and some UI elements will be added for Thebe.
 
 If you also specify a `repository_url` with your theme configuration, `sphinx-thebe`
 will use this repository for its environment:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
     ...
@@ -133,6 +273,20 @@ html_theme_options = {
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+repository:
+    url: "https://github.com/{your-docs-url}"
+```
+
+````
+
+`````
+
 ```{tip}
 You can also manually customize Thebe with the `thebe_config` dictionary.
 This will over-ride any configuration that is pulled from your `html_theme_options`
@@ -144,6 +298,11 @@ documentation for what you can configure.
 
 To configure a relative path to your documentation, add the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
     ...
@@ -152,11 +311,30 @@ html_theme_options = {
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+repository:
+    path_to_book: "{path-relative-to-repo-root}"
+```
+
+````
+
+`````
+
 ## Control the user interface that is opened
 
 You can control the interface that is opened when somebody clicks on a launch button.
 To do so, add the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
     ...
@@ -166,3 +344,17 @@ html_theme_options = {
     ...
 }
 ```
+
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+launch_buttons:
+    notebook_interface: jupyterlab
+```
+
+````
+
+`````
diff --git a/docs/sections/footer-content.md b/docs/sections/footer-content.md
index f958e61af..ff8d28112 100644
--- a/docs/sections/footer-content.md
+++ b/docs/sections/footer-content.md
@@ -12,15 +12,33 @@ By default, the content footer has the following items:
 (content-footer:extra-footer)=
 ## Add extra HTML to your content footer
 
-You may add custom HTML to the content footer via `conf.py`.
+You may add custom HTML to the content footer via your configuration file.
 This is a shortcut in case you wish to avoid defining your own HTML template.
 
 To do so, use the `extra_footer` configuration and provide any HTML that you wish.
 For example:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
-    ...
     "extra_footer": "<div>hi there!</div>",
 }
 ```
+
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+html:
+    extra_footer: "<div>hi there!</div>"
+```
+
+````
+
+`````
diff --git a/docs/sections/footer.md b/docs/sections/footer.md
index 84cebb3fd..79b2fa9af 100644
--- a/docs/sections/footer.md
+++ b/docs/sections/footer.md
@@ -12,10 +12,33 @@ However, there are two configuration points where you can add items to your foot
 For example, the configuration below assumes there is a template at `_templates/test.html`.
 It adds the `_templates` folder to Sphinx's templates path, and adds the template to both the start and end section of the footer.
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 templates_path = ["_templates"]
 html_theme_options = {
-  "footer_start": ["test.html"],
-  "footer_end": ["test.html"]
+    "footer-start": ["test.html"],
+    "footer-end": ["test.html"],
 }
 ```
+
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        templates_path: ["_templates"]
+        html_theme_options:
+            footer-start: ["test.html"]
+            footer-end: ["test.html"]
+```
+
+````
+
+`````
diff --git a/docs/sections/header.md b/docs/sections/header.md
index c637a6335..e1366638a 100644
--- a/docs/sections/header.md
+++ b/docs/sections/header.md
@@ -26,14 +26,38 @@ For example, you can add a button to the header like so:
 
 Make sure that `_templates` is [on your templates path](https://www.sphinx-doc.org/en/master/usage/configuration.html#confval-templates_path).
 
-**Add the following to `conf.py`**:
+**Add the following to configuration file.**:
+
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
 
 ```python
+templates_path = ["_templates"]
+
 html_theme_options = {
-  "navbar_end": ["mybutton.html"]
+    "navbar_end": ["mybutton.html"]
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        templates_path: ["_templates"]
+        html_theme_options:
+            navbar_end: ["mybutton.html"]
+```
+
+````
+
+`````
+
 Your header should now be visible, and the `mybutton.html` content should now show up in the upper-right.
 
 :::{admonition} Override the entire header
diff --git a/docs/sections/sidebar-primary.md b/docs/sections/sidebar-primary.md
index 80e679244..749e7094f 100644
--- a/docs/sections/sidebar-primary.md
+++ b/docs/sections/sidebar-primary.md
@@ -9,24 +9,66 @@ This page describes ways that you can control and customize the primary sidebar.
 
 You can control what kind of content goes underneath the logo and name of your website in the top left.
 
-To do so, use the `html_sidebars` variable in your `conf.py` file. This takes a dictionary of filename patterns as keys, and a list of sidebar elements as values. Any files that match a key will have the corresponding sidebar elements placed in that page's sidebar.
+To do so, use the `html_sidebars` variable in your configuration file. This takes a dictionary of filename patterns as keys, and a list of sidebar elements as values. Any files that match a key will have the corresponding sidebar elements placed in that page's sidebar.
 
 For example, the following configuration would include *only the footer* on pages under the `posts/` folder:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_sidebars = {
     "posts/*": ["sbt-sidebar-nav.html"]
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        html_sidebars:
+            "posts/*": ["sbt-sidebar-nav.html"]
+```
+
+````
+
+`````
+
 You can also use `**` to apply a set of sidebars to **all** pages of your book. For example:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_sidebars = {
     "**": ["sbt-sidebar-nav.html"]
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        html_sidebars:
+            "**": ["sbt-sidebar-nav.html"]
+```
+
+````
+
+`````
+
 See the [Sphinx HTML sidebars documentation](https://www.sphinx-doc.org/en/master/usage/configuration.html#confval-html_sidebars) for more information.
 
 ### Default sidebar elements
@@ -51,28 +93,66 @@ By default, your table of contents will begin with the first file that you add t
 
 To add the landing page of your site to the table of contents, use the following configuration:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
-    ...
     "home_page_in_toc": True
-    ...
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        html_theme_options:
+            home_page_in_toc: true
+```
+
+````
+
+`````
+
 (sidebar:show-navbar-depth)=
 ## Control the depth of the left sidebar lists to expand
 
 You can control the level of toc items in the left sidebar to remain expanded,
-using the following configuration in `conf.py`:
+using the following configuration:
+
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
 
 ```python
 html_theme_options = {
-    ...
     "show_navbar_depth": <level>,
-    ...
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        html_theme_options:
+            show_navbar_depth: <level>
+```
+
+````
+
+`````
+
 The default value is `1`, which shows only top-level sections of the documentation (and is used in this documentation).
 
 (sidebar:max-navbar-depth)=
@@ -80,30 +160,68 @@ The default value is `1`, which shows only top-level sections of the documentati
 ## Control the maximum depth of the left sidebar lists
 
 You can control the level of toc items included in the left sidebar,
-using the following configuration in `conf.py`:
+using the following configuration:
+
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
 
 ```python
 html_theme_options = {
-    ...
     "max_navbar_depth": <level>,
-    ...
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        html_theme_options:
+            max_navbar_depth: <level>
+```
+
+````
+
+`````
+
 The default value is `4`.
 
 (sidebar:collapse-navbar)=
 ## Turn off expandable left sidebar lists
 
 You can turn off the sidebar expanding,
-using the following configuration in `conf.py`:
+using the following configuration:
+
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
 
 ```python
 html_theme_options = {
-    ...
     "collapse_navbar": True,
-    ...
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        html_theme_options:
+            collapse_navbar: true
+```
+
+````
+
+`````
+
 The default value is `False`, which allows the navbar to be expanded.
diff --git a/docs/sections/sidebar-secondary.md b/docs/sections/sidebar-secondary.md
index 495af2b91..5fa9beb15 100644
--- a/docs/sections/sidebar-secondary.md
+++ b/docs/sections/sidebar-secondary.md
@@ -8,12 +8,33 @@ This page describes ways to control and customize the secondary sidebar.
 
 You can rename the title of the in-page table of contents, in the right sidebar:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
     "toc_title": "{your-title}"
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        html_theme_options:
+            toc_title: "{your-title}"
+```
+
+````
+
+`````
+
 The default value of the title is `Contents`.
 
 ## Show more levels of the in-page TOC by default
@@ -22,10 +43,31 @@ Normally only the 2nd-level headers of a page are shown in the within-page table
 
 You can show deeper levels by default by using the following configuration, indicating how many levels should be displayed:
 
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
 ```python
 html_theme_options = {
-  "show_toc_level": 2
+    "show_toc_level": 2
 }
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        html_theme_options:
+            show_toc_level: 2
+```
+
+````
+
+`````
+
 All headings up to and including the level specified will now be shown regardless of what is displayed on the page.
diff --git a/docs/tutorials/get-started.md b/docs/tutorials/get-started.md
index f6ecf7ddd..902a3e429 100644
--- a/docs/tutorials/get-started.md
+++ b/docs/tutorials/get-started.md
@@ -29,14 +29,33 @@ First install `sphinx-book-theme` with `pip`:
 pip install sphinx-book-theme
 ```
 
-then, activate the theme in your Sphinx configuration (`conf.py`):
+Then, activate the theme in your Sphinx configuration (`conf.py` or
+`_config.yml` if you're using [Jupyter Book](https://jupyterbook.org/)):
 
-```
-...
+`````{tab-set}
+
+````{tab-item} conf.py
+:sync: conf.py
+
+```python
 html_theme = "sphinx_book_theme"
-...
 ```
 
+````
+
+````{tab-item} _config.yml
+:sync: _config.yml
+
+```yaml
+sphinx:
+    config:
+        html_theme: sphinx_book_theme
+```
+
+````
+
+`````
+
 This will activate the Sphinx Book Theme for your documentation.
 
 :::{note}