Home
Softono
chromate

chromate

Open source MIT EJS
47
Stars
5
Forks
0
Issues
1
Watchers
3 years
Last Commit

About chromate

Chromate is a lightweight, responsive Hexo theme designed specifically for podcasters and general bloggers. Built on the Bulma CSS framework, it ensures fast loading and a seamless experience across all devices while supporting dark mode detection. Its standout feature is comprehensive podcast integration with minimal configuration required. Users can easily create podcast episodes by defining metadata such as cover art, authors, duration, media files, and optional chapter markers. The theme automatically generates an immersive audio player with a built-in timeline and reference list within the article. It also differentiates content on the homepage by displaying custom call-to-action buttons like Listen Now for audio content. Additionally, Chromate automates RSS feed generation for podcasts when the necessary plugin is installed, simplifying subscription management. The theme remains simple and avoids heavy third-party dependencies, making it ideal for creators seeking a clean, performance-focused platform t

Platforms

Web Self-hosted

Languages

EJS

中文版本

Theme Chromate

The Chromate theme is a new Hexo theme with support for Podcasts.

It has the following feature:

  • Simple and Lightweight: There are no redundant setting items, no references to a large number of third-party libraries, which ensures that it can be loaded and displayed as soon as possible.
  • Responsive: The theme is built on the Bulma CSS framework, which ensures that it can be displayed normally and beautifully on most devices.
  • Full Support for Podcasts: Without too much configuration, you can easily publish a Podcast (details below 👇).
  • Dark mode support: Dark mode browsing on most of browsers/operating systems.

Usage

Podcast Preview

Take a look at the comments in the sample configuration file _config.yaml and fill in them for using Chromate.

For general Bloggers

Nothing special, just write the article as usual:

hexo new post you-post-name-here

For adding a thumbnail to your post, add this to your post file header:

thumbnail: 'Thumbnail-Image-Link'

Additionally, just DO NOT use podcast in post configuration fields!

For Podcasters

Add these fields in your post configuration area to define a Podcast type post:

podcast:
  subtitle: A test Podcast EP  # Subtitle of your EP
  authors: ['Doge-Gui', 'Cool Guy']  # Authors
  cover: https://cdn.pixabay.com/photo/2018/03/28/19/21/easter-3270234_1280.jpg  # Cover image will shown in web-audio-player
  duration: 64  # Continuous time
  media:
    url: https://audionautix.com/Music/BackToTheWood.mp3  # Media link
    size: 1020453  # Media size in byte
    type: audio/mpeg  # Media type
  chapters:  # Chapters info for auto generating timeline. [Optional]
    - ['First Chapter', 13]  
    - ['Second Chapter', 30]
    - ['Third Chapter', 45]
    - ['Forth Chapter', 60]
  references:  # References info for auto generating references. [Optional]
    - ['Post Thumbnail', 'https://pixabay.com/zh/illustrations/sunrise-ocean-ship-sun-sunset-5863751/']
    - ['Podcast Cover', 'https://pixabay.com/zh/illustrations/easter-easter-bunny-rabbit-ears-3270234/']
    - ['Back To The Woods', 'https://audionautix.com/free-music/country']

Please DO NOT modify these fields name.

Then you can get:

  1. Different homepage guide buttons

    For common types of post, you can see the Continue Reading guide button on the homepage; for a Podcast, Listen Now will be displayed.

  2. Automatically generated audio player

    For Podcast post, you only need to fill in the Meta meta information according to the format, and a player will be automatically generated in the article (Special thanks to Shikwasa!).

    If you completed chapters field, the audio player will also shown with Chapters List :)

  3. Rendering of meta-information inner article

    After you fill in the Meta information, you can use the following tags to call the automatically rendered author information, citation information, and timeline:

    • Timeline

        {% timeline %}
    • References

        {% references %}
    • Authors

        {% authors %}
  4. Automatically generated RSS subscription

    We know that RSS is important for podcasts, but configuring them manually is a boring thing, so in Chromate, you only need to fill in the configuration file, and the RSS subscription will be automatically generated.

    Important: If you want to open support for auto generating rss with podcasts, please install a plugin manually under your Hexo project folder:

     npm install podcast --save

Thanks

The theme uses the following third-party resources:

During the production of the theme, the source code of the following themes was referenced: