Skip to content

Enhancement: Style Ghost comment system to match Wonder Cabinet theme #4

@MarkOnFire

Description

@MarkOnFire

Description

The Ghost native comment system ({{comments}}) renders with its default styling, which doesn't match the Wonder Cabinet brand identity (dark background, Jost/EB Garamond typography, green accent colors, etc.).

Goal

Style the comment system to feel cohesive with the rest of the theme, including:

  • Colors: Dark background (--wc-black), cream text (--wc-cream), green accents (--wc-green)
  • Typography: Jost for UI elements/headings, EB Garamond for comment body text
  • Buttons: Match the bracket button aesthetic or at minimum use brand colors
  • Form inputs: Dark-themed input fields consistent with the theme

Constraints

Ghost's comment system renders inside an iframe, which limits direct CSS control. Possible approaches:

  • Ghost Admin > Comment settings: Limited built-in color/accent options
  • Custom CSS via Ghost's comment theming API: Ghost supports some comment theme customization via data-* attributes on the {{comments}} helper
  • Override via package.json custom settings: Define accent colors that Ghost applies to comments

Research Needed

  • What level of customization does Ghost currently support for its native comment iframe?
  • Can accent color, background, and typography be controlled?
  • Are there data- attributes or comment theme options available?

Labels

enhancement, theme

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions