This is the multi-page printable view of this section. Click here to print.
Docsy tests
1 - Alerts
Alerts
Shortcode alerts
A simple primary alert.
A simple secondary alert.
A simple success alert.
A simple danger alert.
A simple warning alert.
A simple info alert.
A simple light alert.
A simple dark alert.
A nota bene alert.
Illustrating use of custom classes via the color parameter.
Blockquote alerts
A simple primary alert.
A simple secondary alert.
A simple success alert.
A simple danger alert.
A simple warning alert.
A simple info alert.
A simple light alert.
A simple dark alert.
A nota bene alert.
Illustrating the use of element attributes.
2 - blocks/cover
2.1 - Height auto with td-below-navbar
Docsy is a theme for the Hugo static site generator that’s specifically designed for technical documentation sets. Our aim is to help you get a working documentation site up and running as easily as possible, so you can concentrate on creating great content for your users.
See Docsy in action!
As well as our example site, there’s a growing number of projects using Docsy for their doc sites.
Contributions welcome!
We do a Pull Request contributions workflow on GitHub. New users are always welcome!
2.2 - Height full with td-below-navbar
Docsy is a theme for the Hugo static site generator that’s specifically designed for technical documentation sets. Our aim is to help you get a working documentation site up and running as easily as possible, so you can concentrate on creating great content for your users.
See Docsy in action!
As well as our example site, there’s a growing number of projects using Docsy for their doc sites.
Contributions welcome!
We do a Pull Request contributions workflow on GitHub. New users are always welcome!
2.3 - Height min with td-below-navbar and dark navbar
Docsy is a theme for the Hugo static site generator that’s specifically designed for technical documentation sets. Our aim is to help you get a working documentation site up and running as easily as possible, so you can concentrate on creating great content for your users.
See Docsy in action!
As well as our example site, there’s a growing number of projects using Docsy for their doc sites.
Contributions welcome!
We do a Pull Request contributions workflow on GitHub. New users are always welcome!
3 - Layouts
3.1 - No left sidebar
This page uses the no-left-sidebar layout. The left (section) sidebar is hidden; only the right-hand table of contents is shown, and the main container is centered.
To use this layout on any docs page, add to your front matter:
body_class: td-no-left-sidebar
Why use this layout?
A common use case is to allow top-level pages to use the docs layout but for which it doesn’t make sense to have a left sidebar since it usually will show all pages of type docs in the site. This is usually not the desired page design.
Layout behavior
- Left sidebar: Hidden.
- Main content: Full width of the content area, centered on large screens.
- Right ToC: Visible as usual on medium-and-up viewports.
Sample sections (for ToC)
Here are some headings so the right-hand ToC is populated and you can see how the layout behaves with scroll.
Subsection one
Some body text. The no-left-sidebar layout is defined in the theme’s extra SCSS (assets/scss/td/extra/_main-container.scss).
Subsection two
More sample content. Resize the window to see how the layout responds at different breakpoints.
Subsection three
On small screens the ToC is hidden by default; on md and up it appears on the right with the content centered beside it.