Hyde is a brazen two-column theme that pairs a prominent sidebar with uncomplicated content. It's based on Poole, the Jekyll butler. Both created by Mark Otto. In some places Font Awesome was used for icons.

This is the Bolt CMS adaption of the theme.

• Static Demo
• Options
  • Sidebar menu
  • Reverse layout
  • Themes
  • Sticky sidebar content
• Features
  • Favicon
  • Custom CSS
  • Change Labels for pager
  • Optional display of teaserimage in main article
  • Galleries
  • GPX tracks
  • Code highlighting
  • Copyright notice
  • Optional publishing of date and taxonomies
  • Latest posts template
  • Archive template
  • Prevent listing
  • Maintenance text
  • Password Protection Extension
• Example ContentType definition
• License

A static demo of the theme can be found here.

Please make sure strict_variables: false is set/uncommented in your config.yml if you get Twig Exceptions.

Hyde for Bolt includes some customizable options, typically applied via theme.yml file.

The main menu is used for the sidebar, you can adjust it in the config://menu.yml file.

You can show a very basic search-box as any item in the menu, to enable it add an entry with class: menusearch to your menu, the label will be used as placeholder for the searchbox. A menu.yml can look like this:

main:
    - label: Home
      title: Welcome page
      path: homepage
      class: first
    - label: Posts
      path: posts
    - label: Entries
      path: entries
    - label: Search...
      class: menusearch

You can show a copyright notice for your site at the bottom of the sidebar, to enable it set show_copyright_in_sidebar: true in theme.yml.

Hyde for Bolt's page orientation can be reversed by setting reverse_layout: true in theme.yml.

Hyde for Bolt ships with eight optional themes based on the base16 color scheme. Apply a theme to change the color scheme (mostly applies to sidebar and links).

To use a theme, uncomment the related line in theme.yml to set the color_theme variable to the right value.

By default Hyde for Bolt ships with a sidebar that affixes it's content to the bottom of the sidebar. You can optionally disable this by setting sticky_sidebar: false in theme.yml.

Just add a favicon.png with at least size of 180px*180px at the top level of your files-folder and it will be used as favicon as well as apple-touch-icon, otherwise the themes default favicon will be used.

You can upload your own CSS-file to change some small things. The file has to be named custom.css and be placed in the top level of your files-directory.

An example use of the custom.css is to change or add the prefix of taxonomy-links in the header-section of record-pages. By default tags will be prefixed with a hash #, categories will be prefixed with an @.
Each taxonomy-link is being supplemented by its taxonomy-name as class name, so to change the prefix of all tags to ♥ you could add the following to your custom.css:

span.taxonomies a.tags::before{
	content: '♥' !important;
}

The labels for Newer and Older Buttons in Listings can be changed in theme.yml.

By adding the field show_image_above_body with type: checkbox to your ContentType you can regulate if the teaser image will be shown on top of the article/entry. Normally the teaser image (field image) is only used for listings.

Hyde for Bolt supports galleries - to use them just add a field gallery with type: imagelist to your ContentType. PhotoSwipe is used as lightbox for the gallery images.

Captions can be shown optionally, to manage this behavior add a field show_gallery_captions with type: checkbox to your ContentType.

If you regularly publish gpx tracks with your posts, you can add a field gpx with type: file to your ContentType. You also have to extend accept_file_types in config.yml to accept gpx-files in order to be able to upload your tracks. If a nonempty field gpx is found in your record a map is drawn right below the content (and above a gallery, if there is one).

The map is created using leaflet and leaflet-gpx and uses maptiles from the Open Street Map Project, some symbols from Font Awesome are used in the footer to indicate distance, duration and elevations of your track.

Records with gpx-tracks are emphasized by a map symbol in listings and the record-page itself.

Code blocks are highlighted using highlight.js, the theme used for highlighting can be defined in your config.yml via the parameter highlight_theme (use only lowercase, eg: highlight_theme: dracula), see the highlight.js demo page for previews of the different themes.

If you regularly use content which needs a copyright notice, just add a field copyright with type: html or type:markdown to your ContentType. The notice will be added below your content, and below the gallery (if there is one).

You can define for which ContentTypes the publishing date will be hidden by adding hide_publish_date: true to your ContentTypes values in config://contenttypes.yml. Typically you don't want to show the publishdate for pages.

Display of taxonomies can also be controlled via ContentType definition. If you dont want taxonomy tags to be shown, just add hidden_taxonomy: [ tags ] to your ContentType definition. Hereby it is possible to use some taxonomies internally but not showing them to your visitors. By default tags will be prefixed with a hash #, categories will be prefixed with an @ - this can be changed by using a custom.css, see above.

Both rules apply for listings as well as the display of the documents itself.

You can use the template latest.twig (see Bolt Docs) to include lists of the last three entries of each of your ContentTypes. Please note that ContentTypes with hide_in_listings: true will not appear in the list of the latest entries (see below). Also viewless must not be set to true.
The lists will be shown below the normal content (title, body/content) of the record whose template is set to latest.twig.

Similar to the latest template (see above) there also exists an archive.twig template which can be used to list all records of all ContentTypes. Again note that ContentTypes with hide_in_listings: true will not appear in the list and viewless must not be set to true.

You can prevent records of a certain ContentTypes from showing in listings and in in the latest template and archive template (see above) by adding hide_in_listings: true to this ContentType.
This can be useful for ContentTypes that should not be listable (e.g. pages). Unfortunately there seems to be no build-in parameter to forbid listings for a certain ContentType.

To set an individual title and content of your Maintenance-Site, just create block/maintenance (it has to have exactly this slug) and set title and content there.

The theme supports the PasswordProtect extension by Bob den Otter.
To use it, just add the following new field to the fields of the ContentType you want to protect:

use_password_protection:
            type: checkbox
            default: false
            label: 'Use the password protection provided by the PasswordProtect extension'
            variant: inline

Now you are able to decide which records you want to password protect.

Please note you have to provide a redirect page in the configuration of the extension.
You have to create this page on your own, but you can use the login.twig template provided by of this theme.

Password protected records are emphasized by a lock symbol in listings and the record-page itself.

An example ContentType-definition in your contenttypes.yml could be something like:

pages:
    name: Pages
    singular_name: Page
    fields:
        title:
            type: text
            class: large
            group: content
        slug:
            type: slug
            uses: title
        subtitle:
            type: markdown
            height: 100px
            group: content
        image:
            type: image
        teaser:
            type: markdown
            height: 150px
        body:
            type: html
            height: 300px
        template:
            type: templateselect
            filter: '*.twig'
    taxonomy: [ groups ]
    hidden_taxonomy: [ groups ]
    hide_publish_date: true
    viewless: false
    searchable: false
    recordsperpage: 10
    hide_publish_date: true
    hide_in_listings: true

posts:
    name: Posts
    singular_name: Post
    slug: posts
    singular_slug: post
    fields:
        title:
            type: text
            class: large
            group: content
        slug:
            type: slug
            uses: title
        body:
            type: markdown
            height: 300px
        image:
            type: image
            group: content
        show_image_above_body:
            type: checkbox
            default: false
            label: "Shall the teaserimage be shown above the content?"
            group: content
        use_password_protection:
            type: checkbox
            default: false
            label: 'Use the password protection provided by the PasswordProtect extension'
            variant: inline

        gallery:
            type: imagelist
            extensions: [ gif, jpg, png ]
            group: content
        show_gallery_captions:
            type: checkbox
            default: false
            label: 'Show captions for gallery'
            variant: inline

        copyright:
            type: markdown
            group: content

        gpx:
            type: file
            extensions: [ gpx ]
            group: content
            label: 'GPX track related to the post'
    relations:
        posts:
            multiple: true
            order: title
            label: Select related other posts
    taxonomy: [ groups, categories, tags ]
    hidden_taxonomy: [ groups ]
    default_status: published
    sort: -datepublish
    recordsperpage: 5

Open sourced under the MIT license.

<3