Nikko

Nikko is a Premium Ghost Theme with a modern, stylish and clean design, it's an ideal template to build a newsletter and membership-focused website, whether your switching from another platform like Substack or starting from scratch. It was designed with attention to detail, providing a nice user experience with the focus being on the content.

Nikko is easy-to-use and provides a lot of options to customize and adjust to your liking and to match the style of your brand. The documentation provides all the information you need to start with the customization.

Custom Theme settings

Fast & Lightweight

Nikko was built with performance and user experience in mind, with a minimal theme size, images are lazy-loaded taking advantage of the built-in image optimization in Ghost, the theme has a great performance score, as well as valid HTML structure:

• valid HTML
• properly sized images
• defer offscreen images
• minify CSS
• minify JavaScript
• remove unused CSS
• avoids enormous network payloads
• avoids an excessive DOM size
• JavaScript execution time
• All text remains visible during Webfont loads

Speed scores:

• PageSpeed Insights – 99 points for desktop (with membership enabled)
• Pingdom - 92 score, performance grade "A"
• Ghost GScan – 100/100 points

Accessibility & SEO

Nikko is validated against Web Content Accessibility Guideline (WCAG) passing all relevant rules. Keyboard navigation throughout the theme is assured and color contrast recommendations are respected. Accessibility checks

Ghost itself is excellent with SEO, Nikko was tested using Lighthouse passing all tests and making sure it is SEO friendly so you can focus on creating content.

Hero subscription section

Nikko comes with a hero section on the homepage that is actually a call to action to Subscribe, this section is not displayed to signed-in members. By default, this section uses the `@site.description` as the main text but it can be changed.

Dark & Light color scheme

Nikko comes with a dark and light theme built-in, and by default, it detects the user preference, then also provides an option to switch the theme with a button in the header.

You can adjust the colors from code injection with a couple of lines of code, you will be able to adapt all the colors, like brand, text, background, and much more.

You also have the possibility to disable the theme toggle button completely.

Ghost Membership & Subscriptions

The theme comes with unique pages in support of the membership feature:

• custom sign up page
• custom sign in page
• custom user account page
• custom membership page

You can also use the Ghost Portal feature, in case you prefer that and you can find specific instructions on how to do that in the docs.

Payment testing To test the membership features you use any of the following test card numbers.

Progressive Web App

Your site can work as a Progressive Web App, this is something built into Nikko. This allows your website to be installed by anyone, anywhere, on any device, making it accessible even offline.

You can find more info in the documentation regarding the steps needed to enable this, also to find out more check out this tutorial: Ghost as a PWA.

Search

When you click on the search icon in the header the overlay containing the search form comes up and the search is performed as you type, by default on the title and the primary tag, but you can enable the search for the post contents as well.

Enabling the search requires creating a Content API key and provide that in the theme-config file. Details can be found in the theme documentation.

Home pages

Nikko comes with the following home page layouts:

Default home page

• home page with hero CTA for subscription
• hero CTA with full background and message in the overlay (image is the site cover image)
• a two-column layout formed by posts and sidebar
• a list of authors and tags
• file: index.hbs

Home alternative 2

• Personal profile style
• hero CTA for subscription
• content from a custom page (using internal tag #profile) with custom elements
• a list of tags
• file: index2.hbs

Home alternative 3

• home page with featured posts slider section
• a 3 column post-card layout
• a list of authors and tags
• file: index3.hbs

Home alternative 4

• home page with a newsletter overlay (which appears only for non-subscribers and when closed it will not appear anymore for users)
• featured posts slider section
• a simple one-column layout formed by posts
• a list of tags
• file: index4.hbs

Additionally, you can further customize the layouts by editing the templates. You can also combine the different parts you like from these templates.

You can find instructions in the documentation on how to set up different home pages.

Custom Posts

Nikko comes with the following post layouts you can choose in the Ghost Admin:

• default: simple post layout
• post with full image: simple post layout with a full-width image (width of the container)
• post with background image: post layout with background image and post title in an overlay
• post with sidebar: post layout with a sidebar
• post with table of contents: post layout with table of contents

Additionally, you can mix and match the different layouts to create new ones, for example, you can create a post layout with a sidebar and table of contents or you can create a new post layout with a background header and sidebar, and others as well.

Custom Pages

We have also included some other custom pages as well:

• Archive Page - an archive of all posts grouped by the year
• Tags Page - listing tags used sorted by the one with the most posts
• Authors Page - listing authors

Supported Ghost features

• Ghost 5.x compatibility - with all features that come with Ghost 5.0
• Translation ready - the following languages being included:
  • German
  • French
  • Spanish
  • Italian
  • Portuguese
  • Turkish
• Members & subscriptions - to help you monetize your content or build a community Nikko comes with full support for the member's feature
• Post - image, custom excerpt, multi-author, and featured flag in postcards and post hero as well
• Page - static pages with or without images
• Author - support for avatar, bio, location, website, and social accounts
• Tag - feature image and description
• Postcard - with tags, post visibility, multi authors, read time and date
• Koenig editor
  • Markdown card
  • Bookmark card
  • Gallery card
  • Image card with normal, wide, and full width
  • GIF card
  • Button card
  • NTF embed
  • Callout card
  • Toggle card
  • Alternative quote
  • Product card
  • Audio card
  • Video card
  • File card
  • Header card
  • Check out all the Elements
• Secondary navigation

Additional features

• home page subscription CTA - The home page has a hero section with subscription CTA for regular users, and this section is not displayed to signed-in users. On the alternative home pages, you have a different variation of this section, one with a more personal style of layout and another one with a full overlay.
• featured-slider - another option to have on the homepage is a slider with the featured posts, you can see this in action on home page 3
• Lazy loading images - for performance reasons as well as user experience it's important to not load all the images when the page is loaded but instead load each image as it enters the viewport.
• image lightbox - when you click on images in posts an image lightbox gallery is displayed with all images from that post, this can be enabled or disabled from the theme-config file.
• post access CTA - If the post is for members only, there will be a call to action for subscription in case the user does not have access to the post.
• Fully Responsive - Nikko was designed with a mobile-first approach and it works great on all display sizes, be it mobile, tablet, or desktop.
• Syntax Highlighting - Nikko comes with Prism for syntax highlighting. Being already built-in you don't have to worry about adding it to the theme. To achieve better performance and to only load the script when needed an internal tag can be used on post level (#syntax-highlight)
• Related Posts - you can suggest relevant articles to your readers, making them more likely to stay on your website. Posts will be shown checking for common tags within posts.
• Comments - the native Ghost comments are integrated, but you can easily add other comment systems to your theme. Cove and Disqus are integrated by default. You just have to make sure you provide either your Cove ID or Disqus shortname in the theme-config file and you are good to go.

Documentation