TOC on Source theme

Hello there!

So, I really don’t know much about code but followed the tutorial for creating a TOC:

but then I noticed that it messed up with the “publication-info sidebar” in Homepage. I’m using Source Theme and need some help to configure a proper TOC in my blog posts.

Can anyone help!
Thanks in advance!

Add .gh-content to the styles of the TOC in default.hbs

.gh-content .gh-sidebar {
   position: absolute; 
   top: 0;
   bottom: 0;
   margin-top: 4vmin;
   grid-column: wide-start / main-start; /* Place the TOC to the left of the content */
}

Thank you!
I will try and see how it goes!

Hello…
It didn’t work.

Sidebar now has disappeared from homepage even with “Show publication info sidebar” on.

Any advice?

Thanks in advance

Share the style tag code at the default.hbs file please

Obtener Outlook para iOS

And your site url

Obtener Outlook para iOS

Oh wait!
I added .gh-content to the “@media” inside the style of the TOC and now it seems to work.

It was what you meant?

Thank you!

You can change “gh-sidebar” to “toc-siderbar” in all the code you added to fix this.

You can also check this guide for detailed info.

Thanks, Raki. Somehow, the TOC sidebar didn’t move to the side using the code in the guide you provided. I’ll try some tweaking to see if I can fix it.

Thanks Raki!

I tried once again and it went ok this time!

It worked!

Thank you very much for your concern!

1 Like