# Table of Contents Solo Theme

**URL:** <https://forum.ghost.org/t/table-of-contents-solo-theme/36728>\
**Category:** Developer help\
**Created:** [February 28, 2023, 7:02am UTC](https://forum.ghost.org/t/table-of-contents-solo-theme/36728 "2023-02-28T07:02:51Z")\
**Posts on this page:** 1\
**Showing post:** 5

<div class="post-metadata">

**Author:** ![dano9258](https://avatars.discourse-cdn.com/v4/letter/d/ce73a5/32.png) [@dano9258](https://forum.ghost.org/u/dano9258)\
**Post date:** [February 28, 2023, 6:59pm UTC](https://forum.ghost.org/t/table-of-contents-solo-theme/36728/5 "2023-02-28T18:59:06Z")

</div>

I was playing around with this tutorial:

> [@Table of Contents Tutorial for Casper Version 4 - Simplified](https://forum.ghost.org/t/table-of-contents-tutorial-for-casper-version-4-simplified/22584/3):
>
> Also I think somebody else will probably respond, but if they don’t, I’ll have a go at building this and then share the code with you. I’m certainly not the most experienced or skilled developer here but I have implemented exactly this on a non-Ghost website before and I can’t imagine it will be much more difficult.

But I went back to the [Ghost.org](http://Ghost.org) tutorial and implemented that. I’m glad I figured out the H4 thing which is below for anyone else who is having that issue.

```auto
<script>
    tocbot.init({
        // Where to render the table of contents.
        tocSelector: '.gh-toc',
        // Where to grab the headings to build the table of contents.
        contentSelector: '.gh-content',
        // Which headings to grab inside of the contentSelector element.
        headingSelector: 'h2, h3',
        // Ensure correct positioning
        hasInnerContainers: true,
    });
</script>

```

Now I just need it pushed below the author metadata somehow, or shown to the right of the article (preferred).

---

_[View the full topic](https://forum.ghost.org/t/table-of-contents-solo-theme/36728)._
