Migrating from Wordpress to Ghost

I've been wondering for a long time now to switch to Ghost despite two previous failed free trials. The third time is the good one. I literaly spent half a day looking for all the tips and tricks I could use to customize Ghost as I wish.

In this article, expect to find:

• Why I chose to migrate from Wordpress to Ghost
• Exporting Wordpress data
• How I customised the Casper default theme
• Migrating from OVH hosting to Ghost (Pro)
• Conclusion

Why I chose to migrate from Wordpress to Ghost

The truth is: Wordpress was very convenient for me. I used the official Twenty twenty theme and a few plugins: Yoast SEO, MailPoet, Twentig and one for my GTM container. It may seems a lot actually! PageSpeed insights gave me 99/100 for the desktop version and 79/100 for the mobile one. Not that bad considering that I didn't bother optimising anything :-) Page speed was not the reason why I wanted to migrate to Ghost neither something that I care about for my 50 pages personal blog.

I wanted something more straight to the point in terms of content editing and most above all, get rid of all the useless options in the admin panel as well as the plugins. As stated in my previous article, I always wonder why SEO features are not native in Wordpress as they are in other CMS. The Gutenberg editor was a smart move in terms of content editing and it would have been perfect to integrate SEO features as well.

Ghost is in fact, the perfect opposite to Wordpress: smooth, plugin-less, focused on content editing, natively integrated for newsletters and memberships. Plus, Ghost is a non-profit organisation and is part of the Stripe Climate to accelerate carbon removal. This article has a carbon footprint and even if it is yet small, I find it cool to support this initiative.

These are the reasons why I chose to migrate from Wordpress to Ghost.

Ghost doesn't come free unless you self-host it. The first plan called Starter is $9/month and works up to 500 members. I know I won't make Merci Larry profitable but in the first place, I didn't want to pay for something I could benefit from free using Wordpress (except for the $40 annual hosting fee to OVH). Still, Ghost had me with its marketing and I now prefer to pay $9/month and be more comfortable with the easiness that comes with it.

Ghost offers a free 14 days trial for you to make the best use of the platform before deciding to switch. You can test everything with no exception neither limitations. During the trial and until you go with a plan, your website will be hosted on yourwebsite[.]ghost[.]io.

Exporting Wordpress data

Ghost has a super detailed resource to help with the migration so I won't cover the step by step part of it. You can also benefit from the concierge service if you go with the creator plan or above; so you will have someone from Ghost to assist you during the migration.

I found it easy to export my data from Wordpress and then importing it. I didn't convert my categories into tags before the export so I had to recreate them in Ghost but I only have 28 posts and my about page so not a big deal. The thing is, when Ghost imports your pages and posts, it integrates a custom HTML to embark your content and images. It means that where you could benefit for the modern stack of Ghost versus Wordpress, you don't because the import process doesn't erase the code of Wordpress to replace it with the Ghost one. As of today, I'm still wondering if I will have the courage to edit one by one my 28 posts to override the custom HTML and benefit from the modern stack (Node.JS) and everything that comes with it.

How I customised the Casper default theme

As for all CMS, Ghost offers a wide variety of themes. Some official, some free and some paid. I decided to go with the default theme named Casper. During my two precedent trials of Ghost (I canceled the free trials two times before the third one was the good one), I was frustrated with the lack of theme customisation.

Ghost is what I like to call a straight to the point CMS; not only in terms on content editing but for everything you can get access to in the admin panel. When you get familiar with it, it's first confusing because you're not used to such minimalist operating and you can easily get lost ... despite the fact that there are ton less of options than on Wordpress!

This time, I found what I was looking for: code injection! So I was able to customise the Casper theme as I wish: a black background homepage with a white background for posts to have a more comfortable reading.

I first emailed the support as I didn't understand why the default dark theme is actually gray (it's what's expected from the theme actually). And I found all my answers in the forum; super helpful and active (and it's cool to see that forums are still that active!).

Here's the code injection I currently use:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/prism/1.28.0/themes/prism-tomorrow.min.css" integrity="sha512-vswe+cgvic/XBoF1OcM/TeJ2FW0OofqAVdCZiEYkd6dwGXthvkSFWOoGGJgS2CW70VK5dQM5Oh+7ne47s74VTg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link href='https://fonts.googleapis.com/css2?family=Inter:wght@300;700&display=swap' rel='stylesheet'>

<style>
:root {
--color-darkmode: #000000;
}
body,
.page-template .site-main, 
.post-template .site-main,
.article-title .site-main {
  background-color: #FFFFFF;
  color: #000000;
  font-family: 'Inter', sans-serif;
}
html.dark-mode .article-title {
  color: #000000;
    }
html.dark-mode .gh-content>[id] {
  color: #000000;
    }
html.dark-mode .article-byline-meta .author-name a {
  color: #000000;
    }
html.dark-mode a {
  color: #000000;
    }
html.dark-mode .gh-content a:not(.kg-btn):not(.kg-nft-card-container):not(.kg-product-card-button):not(.kg-header-card-button) {
  color: #000000;
    }
section,
    .gh-content>p,
    .gh-content>ul,
    .gh-content .kg-callout-card .kg-callout-text {
  font-family: 'Inter', sans-serif;
  font-size: 1.8rem;
  line-height: 1.4;
  color: #000000;
  font-weight: 400;
    }
html.dark-mode a {
    color: #FFFFFF;
}
</style>

As stated by Ghost support:

For other changes, e.g. layout changes / design for example, this would require editing your theme files directly. To edit your theme code, the theme would need to be downloaded from within Ghost Admin, in the Settings > Design area. Once downloaded, it can be unzipped locally, and the files edited using an HTML editor. When you've finished making your changes, the theme would need to be zipped back up for upload to the site.

I then added a few lines for Google Analytics tracking but I'm looking for a free alternative. I'm not a fan of GA4 and to be honest, I don't need 98% of the information as I just want to track the number of visits, the countries where they come from and my most popular pages.

Migrating from OVH hosting to Ghost

Unfortunately, this is the part I lacked the most information of. OVH is not seen as a big hosting provider by Ghost so there is not step by step tutorial. Plus, I didn't find any information on the internet so I help this paragraph will be helpful to those in the same situation than me!

1. Once logged in your OVH console, head to your domain names and select the right one.
2. Select DNS zone.
3. From there, I deleted everything so make sure to be comfortable doing this. Merci Larry returned a 500 status code for an hour before I figured it out.
4. Delete all the entries related to your current hosting. In my case, it was my OVH shared hosting.
5. Create a new CNAME entry like this www[.]yourwebsite[.com] and the target yourwebsite[.]ghost[.]io
6. Create a new A entry for host yourwebsite[.com] and target 178.128.137.126.
7. Head back to Ghost, click on Ghost (Pro) and then on Domain.
8. Enter your custom domain: www[.]yourwebsite[.]com
9. Click on Activate and wait a few minutes.
10. Then click on Continue and you're all set! Your domain name is now setup on Ghost!

To be honest, it was a pain in the ass to deal with this part and far from being my favorite one. I considered switching to another domain name provider as OVH lacks support, documentation and a useless forum (when you read topics where people argue at each other, you know you won't find your answer).

Conclusion

After less that one day of use, I like it a lot. I need to customise some more things and get used to Ghost obsviously. I will also probably be writing some feature requests in the Ghost forum as I can't even see (neither modify!) both the robots.txt and sitemap.xml from the admin panel. I would also like to be able to use more headings than H1 and H2 as I like to write subsections of chapters. Also, I would like to be able to noindex certain pages and as far as I know, there is no such option yet.

If you like to write, if you like clean design, if you want to be part of carbon removal and if you want to be part of a growing community; then I believe Ghost is a good fit for you.

EDIT August 13th: Ghost told me that we can actually use code injection for specific pages or posts if we want to noindex them. We can also use Markdown to specify other heading tags than H1 and H2.