Hydra / jekyll-theme-hydra
Marketing site template for Jekyll. Browse through a live demo. Increase the web presence of your brand with this configurable theme.
Hydra was made by CloudCannon, the Cloud CMS for Jekyll.
Find more templates, themes and step-by-step Jekyll tutorials at CloudCannon Academy.
Put your layouts in _layouts
, your includes in _includes
, your sass files in _sass
and any other assets in assets
.
To experiment with this code, add some sample content and run bundle exec jekyll serve
– this directory is setup just like a Jekyll site!
Features
- Contact form
- Pre-built pages
- Pre-styled components
- Blog with pagination
- Post category pages
- Disqus comments for posts
- Staff and author system
- Configurable footer
- Optimised for editing in CloudCannon
- RSS/Atom feed
- SEO tags
- Google Analytics
Installation
Include the gem in your Jekyll site's Gemfile
:
gem 'jekyll-theme-hydra'
Hydra's default layout depends on the jekyll-seo-tag
gem. Add in the relevant section. Example:
group :jekyll_plugins do
# ...
gem 'jekyll-seo-tag', '2.6.1'
# ...
end
And add this line to your Jekyll site's _config.yml
:
theme: jekyll-theme-hydra
And then execute:
$ bundle
Or install it yourself as:
$ gem install jekyll-theme-hydra
Basic setup
- Add your site and author details in
_config.yml
. - Add your Google Analytics and Disqus keys to
_config.yml
. - Get a workflow going to see your site's output (with CloudCannon or Jekyll locally).
Usage / Editing
Hydra is already optimised for adding, updating and removing pages, staff, advice, company details and footer elements in CloudCannon.
Posts
- Add, update or remove a post in the Posts collection.
- The Staff Author field links to members in the Staff collection.
- Documentation pages are organised in the navigation by category, with URLs based on the path inside the
_docs
folder. - Change the defaults when new posts are created in
_posts/_defaults.md
.
Contact Form
- Preconfigured to work with CloudCannon, but easily changed to another provider (e.g. FormSpree).
- Sends email to the address listed in company details.
Staff
- Reused around the site to save multiple editing locations.
- Add
excluded_in_search: true
to any documentation page's front matter to exclude that page in the search results.
Navigation
- Exposed as a data file to give clients better access.
- Set in the Data / Navigation section.
Footer
- Exposed as a data file to give clients better access.
- Set in the Data / Footer section.
Contributing
Bug reports and pull requests are welcome on GitHub at https://github.com/[USERNAME]/hello. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the Contributor Covenant code of conduct.
Development
Hydra was built with Jekyll version 3.3.1, but should support newer versions as well.
Install the dependencies with Bundler:
$ bundle install
Run jekyll
commands through Bundler to ensure you're using the right versions:
$ bundle exec jekyll serve
Your theme is setup just like a normal Jekyll site! To test your theme, run bundle exec jekyll serve
and open your browser at http://localhost:4000
. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal.
When your theme is released, only the files in _layouts
, _includes
, _sass
and assets
tracked with Git will be bundled.
To add a custom directory to your theme-gem, please edit the regexp in jekyll-theme-hydra.gemspec
accordingly.
License
The theme is available as open source under the terms of the MIT License.