Hexo-Theme-LostStar

中文 | English

A concise Hexo theme, inherited from ParticleX and Particle.

Features

• Clean, minimalist design
• Built with EJS templates
• Font Awesome 6 icons
• Code highlighting via Highlight.js
• Math rendering via KaTeX
• Image preview (lightbox)
• Article encryption (AES)
• Local search
• Multiple comment systems: Giscus, Gitalk, Waline, Twikoo
• Polyfill.io for browser compatibility

Installation

Clone this repository into your Hexo themes directory:

cd your-hexo-site
git clone https://github.com/thatnghiep-dev/hexo-theme-loststar.git themes/loststar

Then set the theme in your site's _config.yml:

theme: loststar

Disable Built-in Code Highlighting

LostStar uses Highlight.js for code highlighting. You must disable Hexo's built-in highlighter.

For Hexo < 7.0:

highlight:
  enable: false
prismjs:
  enable: false

For Hexo >= 7.0:

syntax_highlighter:
highlight:
  enable: false
prismjs:
  enable: false

If you use Pandoc as the renderer, also add no-highlight to your Pandoc arguments.

Disable Yearly/Monthly Archives

To keep the archive page clean, disable yearly and monthly grouping:

archive_generator:
  enabled: true
  per_page: 0
  yearly: false
  monthly: false
  daily: false

Then run hexo clean to clear the cache.

Configuration

All configuration is done in the theme's _config.yml file (located at themes/loststar/_config.yml).

Basic

Option	Default	Description
avatar	/images/avatar.jpg	Path to your avatar image
background	[/images/background.jpg]	List of background images for the home page
loading	/images/loading.gif	Loading animation image
colors	["#ffa2c4", "#00bcd4", "#03a9f4", "#00a596", "#ff7d73"]	Colors used for categories and tags

Navigation Menu

The theme uses Font Awesome 6 icons. Each menu item has a name (icon name), theme (icon style), and link.

menu:
  Home:
    name: house
    theme: solid
    link: /
  About:
    name: id-card
    theme: solid
    link: /about
  Archives:
    name: box-archive
    theme: solid
    link: /archives
  Categories:
    name: bookmark
    theme: solid
    link: /categories
  Tags:
    name: tags
    theme: solid
    link: /tags

Sidebar Card

card:
  enable: true
  description: |
    Your description here
    Supports multiple lines
  iconLinks:
    # name: link
  friendLinks:
    # name: link

Option	Default	Description
card.enable	true	Show or hide the sidebar card
card.description	-	Multi-line description text (supports Markdown)
card.iconLinks	-	Social media / icon links (key-value pairs)
card.friendLinks	-	Friend site links (key-value pairs)

Footer

footer:
  since: 2022
  ICP:
    enable: false
    code:
    link:

Option	Default	Description
footer.since	2022	Starting year for the copyright notice
footer.ICP.enable	false	Show ICP filing info (for China-hosted sites)
footer.ICP.code	-	ICP filing number
footer.ICP.link	-	Link to ICP verification page

Features

Polyfill

polyfill:
  enable: true
  features:
    - default

Provides cross-browser compatibility via Polyfill.io.

Code Highlighting

highlight:
  enable: true
  style: github

Powered by Highlight.js. Browse available styles at the Highlight.js demo page.

Math Rendering

math:
  enable: false

Enables KaTeX for rendering LaTeX math formulas.

Image Preview

preview:
  enable: true

Click on images in articles to view them in a lightbox overlay.

Article Encryption

crypto:
  enable: false

Requires the hexo-helper-crypto plugin. Add a secret field in your post's front-matter to encrypt it:

---
title: My Secret Post
secret: your-password-here
---

Search

search:
  enable: false

Enables local search in the archives page. Currently searches by post title only.

Comments

LostStar supports 4 comment systems. Enable only one at a time.

Giscus

Uses GitHub Discussions as a comment backend.

giscus:
  enable: false
  src: https://giscus.app/client.js
  repo:
  repoID:
  category:
  categoryID:
  mapping: pathname
  strict: 0
  reactionsEnabled: 1
  emitMetadata: 0
  inputPosition: bottom
  theme: preferred_color_scheme
  lang:

Visit giscus.app to generate your configuration.

Gitalk

Uses GitHub Issues as a comment backend.

gitalk:
  enable: false
  clientID:
  clientSecret:
  repo:
  owner:
  admin:
  language:
  proxy:

Note: Gitalk requires a CORS proxy. See the Gitalk documentation for setup details.

Waline

A simple, safe comment system with a backend.

waline:
  enable: false
  serverURL:
  locale:
  commentCount: true
  pageview: false
  emoji:
    - https://unpkg.com/@waline/emojis@1.2.0/weibo
    - https://unpkg.com/@waline/emojis@1.2.0/alus
    - https://unpkg.com/@waline/emojis@1.2.0/bilibili
    - https://unpkg.com/@waline/emojis@1.2.0/qq
    - https://unpkg.com/@waline/emojis@1.2.0/tieba
    - https://unpkg.com/@waline/emojis@1.2.0/tw-emoji
  meta:
    - nick
    - mail
    - link
  requiredMeta:
    - nick
  lang:
  wordLimit: 0
  login: enable
  pageSize: 10

See Waline documentation for server setup.

Twikoo

A simple, safe, free comment system.

twikoo:
  enable: false
  envID:
  region:
  path: location.pathname
  lang:

See Twikoo documentation for deployment.

Writing Tips

Post Excerpt

Use <!-- more --> in your post to define where the excerpt ends on the home page:

This is the excerpt shown on the home page.

<!-- more -->

This content is only visible in the full post.

Alternatively, set description in the post's front-matter:

---
title: My Post
description: This text will be used as the excerpt.
---

Pinned Posts

Add pinned: true to a post's front-matter to pin it to the top of the home page:

---
title: Important Announcement
pinned: true
---

Encrypted Posts

With crypto.enable: true in the theme config, add secret to a post's front-matter:

---
title: Private Post
secret: my-password
---

Readers must enter the password to view the content.

Credits

This theme is based on ParticleX by Argvchs, which itself is a modernized version of the original Particle theme by korilin. Both upstream projects are licensed under MIT.

License

MIT