Export Ghost Site as Static HTML files

Is it possible to export a ghost site as static HTML files, would it work if I used the localhost on my machine and built the site locally (if I can export HTML files) and push to a static site hosted e.g. GithubPages?

Thanks in advance

Hey @Aiyush-G :wave:
Rather than trying to export the static HTML files you could use an automation deployment workflow using Netlify. By forking this repo, linking your Ghost installation and adding the repo to Netlify you can host static files in the same way you were on GitHub Pages, but the static files would be automatically redeployed whenever you make a change in your Ghost content with the use of webhooks.

:bulb: Pro tip: You can use the “Deploy to Netlify” button in the readme of that repo to fast-track yourself to deploying your static site on Netlify :blush:

Hi @DavidDarnes ,

Thanks, while researching I came across eleventy (my blog is currently on Jekyll) and would like to port to Eleventy (hopefully I can figure this out, but any tutorials would be very helpful) can eleventy be hosted on GitHub Pages.

Kind Regards

Aiyush

1 Like

I’d recommend checking out our Eleventy documentation for more info. Eleventy can be hosted on GitHub Pages, however I’d recommend using Netlify so you can benefit from the automation tooling

@DavidDarnes Ok, thanks for the help, I have one last question: for the ghost CMS given the admin api, would it be possible for someone like myself to completely rebuild the admin panel. Or is it possible to remove ghost branding from the current admin panel?

Thanks
Aiyush

The admin UI has very minimal branding towards Ghost, and any branding you do see I would personal not think is worth creating a completely custom UI to avoid :sweat_smile:.

However we do have our Admin API, which lets you interact with Ghost from another application. It’s a very powerful API which you can read more about in our documentation here:

Hi David,

Yeah :joy: that makes sense, I have noticed that you have a blog where you use eleventy with the ghosts headless css functionality, one thing that I don’t fully understand is its’ inheritance. What I mean by ‘inheritance’ is that does the theming come from ghost or from eleventy and in the docs where can I find the correct syntax to help me. E.g. for posts in site.posts <— Jekyll Equivilant for eleventy.

Ag

All styles / theming / front-end comes from the Eleventy application. Eleventy is pulling the content from Ghost using the Content API with JavaScript. In the Eleventy starter you’ll see I’m pulling the content in with .eleventy.js and then using template code to reference the data, with nunjucks variables like {{ site.title }}. These’s correspond with the Ghost Content API Endpoints shown here:

I’d highly recommend reading up on the Ghost Content API itself, as well as the Eleventy starter repo we have and the Eleventy docs itself.

Hope this helps!

Yes, that helps, I will be sure to fully read the resources that you have kindly provided them with me. I have been playing around with the Ghost admin panel, I notice in the editor (when you create a new post) you have the ‘primary’ options and have the option to integrate services such as codepen etc… Would it be possible to create your own ‘blocks’ in HTML e.g. if I have a a HTML template for two columns would it be possible to use this in the ghost editing workspace without having to use the custom HTML feature?

Thanks
Aiyush

If you’re using Eleventy you can use the HTML card to insert special shortcodes which can then be picked up by filtering in the .eleventy.js file :blush:

Is there anywhere that I can read up more on this? I don’t quite understand it yet :grinning:

Thanks
Aiyush

ps. your support has been great :smiley: :smiley: :smiley:

1 Like

Check these out: