Let’s Learn Ghost on the Jamstack! Livestream Q & A

I recently joined Jason Lengstorf on his Twitch show Learn With Jason. During the livestream we demonstrated the possibilities of using Ghost as a Headless CMS. Check out the full recording of the stream over on the Learn With Jason site.

I had a great time chatting with Jason and the audience. However in all the excitement I didn’t get around to answering all the questions from the live chat. Thankfully with the power of Twitch Chat Reply and an npm script called ‘twitch-chatlog’ I was able to go back in time and pull out all the questions people had during the livestream.

Here’s a somewhat brief Q & A on those questions:

How can I become a Ghost?

The more I think about this question the darker it becomes. I’m not willing to answer.

So Ghost is like WordPress of node?

Ghost is a CMS focused on publishing, built on Node.js. I’d highly recommend checking out our WordPress comparison page, it’ll show you what the differences are and help you decide if Ghost is right for you.

Is he ghosting us?

Definitely not heard this one before… but seriously, sorry if I missed your question the first time round.

What do we do about custom fields, and is there a way to make custom cards?

I attempted to answer this question during the livestream, but I can’t really reply without asking ‘what are you trying to achieve?’. You’ll be surprised what you can do with Ghost. Key value pairs tend to be an easy answer for developers to grab, rather than thinking further into what the final goal is.

Photo by Mae Mu / Unsplash
Can you use Ghost to make a sandwich?

I mean, I guess? Ghost would be a good way to write up sandwich recipes!

Is Ghost a sandwich?

No, it is not…

Ghost is a CMS right?

Yes, it is!

Aren’t we gonna do a from scratch without the starter?

Yes! You totally can, and we did. Check out the repo Jason put up which contains an Eleventy site we put together from scratch during the livestream.

So I could use this with Eleventy?

Heck yea! I mentioned on the livestream I’m trying to rebuild my site with Ghost and Eleventy at the minute. I’m using our Eleventy starter as a base.

So Ghost is mainly focussed on making it easy to create a blog?

Pretty much. Ghost is all about publishing, blogging is a great example of that.

So I wanted to use a video on a page. I put it in a card. Embed card, and then moved it with javascript. Instead of bringing data in to the handlebars template

Sounds like you nailed the use of embed cards, nice job! Cards in Ghost allow you to drop code blocks, YouTube videos, CodePen demos and all sorts of things directly into your content. The custom embed and HTML cards are probably the most appealing to the developers amongst us, allowing you to drop completely custom HTML right in the middle of your posts and pages.

We’re using Ghost in work to power a Gatsby site. It is 😍

Awesome! If you read this post please share it, would love to see how Ghost is being used in the wild 👀

Spooky? Spoopy?

Pretty spooky, really spoopy 👻

Could you show Gatsby/GraphQL pulling stuff from Ghost? 🙏

I think we did cover this in the stream, however if you want some more examples of using GraphQL with Ghost then check out this recipes page in our docs.

I tried WP but it’s so slow :(
Story of my life


What would be the differences/advantages of using Ghost compared to Netlify CMS with Eleventy?

I’d say the key differences are the editing experience and the way data is stored. Ghost provides a strong publishing experience out of the box, while Netlify CMS can provide a really custom editing experience if you’re willing to put the work in. Ghost stores it’s data in a database, while Netlify CMS stores data in the repo files.

I think their advantages over each other would only come through when set against the task at hand. Essentially, you need to work out what tool is best for the job.

Can you expose content from Ghost which is draft, staged and publish? Different API endpoints?

For sure! Only published posts are exposed in the Content API, however the Admin API gives you access to drafted and scheduled posts as well. You can find out more in our API docs.

Does Ghost also do that (provide an API) out of the box? So without Gatsby?
Don’t understand why you would need GraphQL for building static site though?

Ghost has a great API for pulling content, and the JavaScript Content API Client Library makes your content even more accessible. It’s one of the main reasons I was so keen to make the Eleventy starter, because the API fit really well with Eleventy’s main configuration file.

You don’t have to use GraphQL, you can use the JavaScript Content API that I mentioned before. However if you want to plug Ghost into an existing React or Gatsby site then the gatsby-source-ghost source plugin might be the way to go.

So content creators would need Ghost downloaded on their device?
…is there a hosted Ghost service or do authors have to have a self-hosted instance?

I think you’re getting confused with the local install of Ghost we used. Ghost is completely open source, you can go ahead and install it locally without barriers. Doing so will create a local install of the Ghost admin interface and a site running alongside it. However for other people to see your site, and for your deployed Jamstack site to retrieve content from it, you’ll need to have a hosted installation running somewhere on the internet.

For hosting options you could use something like DigitalOcean, they even have a ‘Droplet’ for you to spin up a Ghost installation quickly. While this is probably the cheapest option you do still have to maintain the installation yourself, if you’re like me you won’t enjoy server maintenance.

The alternative is signing up for Ghost(Pro), which is our platform offering. We handle all the hosting and maintenance for you, and provide customer support whenever you need it. Check out our pricing page for a full breakdown on features and benefits. Jason covered the topic of time over money really well during the livestream.

For the preview section of Ghost admin, can we point it to the custom front-end say the GatsbyJS website to show up in the preview of Ghost admin panel?

Yes! I made this handy snippet that will redirect all your pages to your Jamstack counterpart which you can drop into your site footer code injection area within your Ghost admin:

<script type="text/javascript">
    if (location.hostname.includes('ghost.io') && !location.href.includes('ghost.io/p/')) {
        location.hostname = 'my-jamstack-site.com';

This snippet also accounts for previews which will be best shown in the internal Ghost theme layer.

Requesting permission to tweet: “mood while coding”

Extremely relatable, very tweetable.

Zach Leatherman would be proud of you two

I sure hope so 💚

Do you guys have a website where I can go through steps by steps to get started with Ghost?

Best places to check out are our documentation, tutorials and community forum filled with helpful references on using Ghost.

Thank you Jason and Dave! Awesome episode!

Thank you for joining the livestream! Hopefully we’ll get to do this again sometime.

I’m ready yo, where u at? pic.twitter.com/GbRzTuXqnS

— Rafa (@rafahari) April 7, 2020