Theme Installation

Follow the steps below to upload the theme:

  1. Log in to your publication admin section at yoursite.com/ghost/
  2. Go to Settings > Design ( yoursite.com/ghost/#/settings/design/ )
  3. Click Change theme and then click Upload theme and select the flora.zip file.
  4. After the upload is complete click Activate

Routes Setup

⚠️
For the theme to function properly you must upload the routes.yaml file.

Follow the steps below to upload the routes.yaml file (The file is located inside the zip)

  1. Log in to your publication admin section at yoursite.com/ghost/
  2. Go to Settings > Labs.
  3. Click on Upload routes YAML button and select the file from the root directory of the theme.
Ghost routes.yaml

The routing file defines the following custom routes and collections:

  • / - the homepage (index.hbs)
  • /authors/ - custom template to show all authors
  • /tags/ - custom template to show all tags
  • /archive/ - custom template to show all post on Archive page

Custom Settings

The theme comes with custom design settings that are accessible from the Ghost Admin panel. To view and edit these settings, go to Settings > Design ( yoursite.com/ghost/#/settings/design/)

Custom settings are defined in the package.json file. These settings are placed under two categories:

  1. Site-wide settings
  2. Post settings

Site-wide settings

  • Tag slugs to show in dropdown: Tag sllugs to show under the 'Topics' dropdown menu in header. To hide the 'Topics' dropdown leave this field blank. Add comma separated slugs of tags. Maximum of 5 tags.
Topics dropdown
Ghost Admin setting to choose the tags under this dropdown
⚠️
Use tag slugs and not names. Add slugs in comma-separated without any spaces.
  • Show all topics in header dropdown: If enabled an additional dropdown item, All Topics, will be added in Topics menu which will link to /tags page. You can also upload an icon to show for 'All Topics' dropdown menu item, as explained in the next point.
  • All topics thumbnail: An image which will be used as the icon for the All Topics item in Topics dropdown.
All Topics menu item
Configuration setting for All Topic menu item
  • Use tag accent color in blog cards: If enabled, color of the primary tag will be used as background for the post card. Else, the site accent color will be used.

With accent and without accent blog cards.

Ghost Admin setting
😍
To make your site colorful, keep it enabled. Choose a cohesive color palette for your tags.
🚨
If a color is not present for a tag, then any post with that tag as primary tag, will use the site accent color
  • Heading font & Body font: Select the font used for headings and body content across the website. Around 50 fonts are available to choose from. You can also use custom fonts provided by Ghost.
Custom fonts provided by Flora
Fonts provided by Ghost

Post settings

  • Enable image lightbox: If enabled, lightbox will be enabled for all images inside a post.
  • Open external links in new tab: If enabled, external links will be opened in a new tab.
  • Enable code syntax highlight: If enabled, prism.js library will be loaded. If you do not plan to add any code, then keep this turned off.

Custom Pages

As explained in the routes setup, the theme comes with a couple of custom pages, to activate these pages, there are some actions you have to take.

⚠️
Uploading the routes.yaml file is a key requirement for these custom pages.

To create a Page:

  1. Log in to your publication admin section at yoursite.com/ghost/
  2. Go to Pages ( yoursite.com/ghost/#/pages/ )
  3. Click New page and set the Title and Page URL
  4. Finally, click Publish

Ensure the slug of the custom pages are:

  1. Archive Page: archive
  2. Tags Page: tags
  3. Authors Page: authors

Once you add these pages, please add suitable meta title and description for them.

If you add any excerpt, then it will be visible as a sub heading below the title of that page.

Excerpt for Archive Page
Excerpt visible in the Archive page

Contact Us

If you have any queries, feel free to contact us.