Create and publish flaring fast blogs with this Jamify blogging system. Powered by the React framework Next.js and content fed by headless Ghost, you'll get a production ready hybrid static & server-rendered website that you can easily distribute globally. At the same time your content creators can continue to work with the Ghost authoring system they are used to.
Β
Play with the Demo to get a first impression.
Β
Ghost CMS integration
- Supports Ghost `v3` and `v4`
Ghost Casper look & feel
- Infinite scroll
- Fully responsive
- Sticky navigation headers
- Hover on author avatar
- Styled 404 page
- Preview Section in posts
- Sitemap
- RSS feed
- SEO optimized
Extened Casper Styles β¨
- Dark Mode
- Featured posts pinned on top
- Customizable navigation headers
Images with Next/Images π
- Feature and inline images
- Auto-optimized images
- No content shifts due to consistent placeholders
Advanced Routing
- Auto-detects custom paths
- Configurable collections
Developer friendly
- MIT licenced
- Truly open-source
- Easy to contribute
- Made typesafe with TypeScript
Integrated Plugins
- Member Subscriptions
- Commenting with Commento or Disqus
- Syntax highlighting with PrismJS
- Table Of Contents
- Contact Page with built-in notification service
NextJS Features
- Incremental Regeneration
- Support for Preview
Β
Scores calculated with Lighthouse 6.4.0.
Β
git clone https://github.com/styxlab/next-cms-ghost.git
cd next-cms-ghost
yarn
# Development
yarn dev
# Production
yarn build
Β
The IMAGE_DOMAINS
environment variable must contain a comma separated list of all domains that you use for in-sourcing images. For example:
IMAGE_DOMAINS=res.cloudinary.com,yoursource.imgix.net
Image optimization is automatically turned off when deploying to Netlify, because it is currently on supported on Netlify.
Β
The SITE_URL
environment variable should be set to the public facing URL of your site, in most cases to your custom domain.
Key | Value (example) |
---|---|
SITE_URL | https://www.your-blog.org |
If you don't specify SITE_URL
, it will get populated according to the following defaults:
Platform | System Value | Conditions |
---|---|---|
Vercel | VERCEL_URL | Automatically expose System Environment Variables must be checked |
Netlify | URL |
In all other cases SITE_URL
is set to http://localhost:3000
.
Β
All content is sourced from a Ghost CMS. Choose the method according to your build scenario.
Create a new text file .env.local
in the project root folder:
CMS_GHOST_API_URL=http://localhost:2368
CMS_GHOST_API_KEY=9fccdb0e4ea5b572e2e5b92942
If you build your project with a cloud provider, the best option is to provide the keys with environment variables:
Key | Value (example) |
---|---|
CMS_GHOST_API_URL | https://your-ghost-cms.org |
CMS_GHOST_API_KEY | 9fccdb0e4ea5b572e2e5b92942 |
Β
For best results, deploying to Vercel is recommended. As an alternative, you can also deploy to Netlify.
Β
For best SEO results it is strongly recommended to disable the default Ghost Handlebars theme front-end by selecting the Make this site private flag within your Ghost admin settings.
Β
Please report all bugs and issues at next-cms-ghost/issues.
Β
PRs are welcome! Consider contributing to this project if you want to make a better web.
Special thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!
Β
This project is not affiliated with NextJS or Ghost.
Β
Copyright (c) 2020 styxlab - Released under the MIT license.