Learn how to spin up a site using Ghost as a headless CMS and build a completely custom front-end with the static site generator Hexo.
hexo server
and navigating to http://localhost:4000/
in a web browser.
More information on setting up and creating a Hexo site can be found on the official Hexo site.
scripts
folder at the root of the project directory, for example ./scripts/ghost.js
. Any script placed in the scripts folder acts like a Hexo script plugin, you can find out more about the Plugins API in the Hexo documentation.
Next, install the official JavaScript Ghost Content API helper using:
ghost.js
Hexo script:
url
value to the URL of the Ghost site. For Ghost(Pro) customers, this is the Ghost URL ending in .ghost.io, and for people using the self-hosted version of Ghost, it’s the same URL used to view the admin panel.
Create a custom integration within Ghost Admin to generate a key and change the key
value.
api.posts.browse()
endpoint:
hexo.post.create()
function. The instance of hexo
is already globally available inside of Hexo script files.
async
function. Here’s a full example:
hexo server
in the command line and navigate to http://localhost:4000/
in a web browser.
hexo.extend.generator.register
, which is how scripts inside of a Hexo can generate files alongside the build process.
generator
extension in Hexo that was used in the pages example above. To prevent URL collisions these author pages are being created under an /authors/
path.
posts.browse()
API options have been changed to include tags and authors which will be attached to each post object when it is returned. More information on the include
API option can be found in our Content API Endpoints documentation.
author.slug
includes /authors/
in the string so it correlates with the previous author pages example. Note as well that some manipulation has been performed on tags so it matches the expected format for Hexo (comma separated tags).