In general Ghost stores image files in its server. It seems better to utilise external image management services such as Cloudinary in terms of portability of blog services (e.g. this makes easier to migrate the blog to a different blog service). Of course we can use Cloudinary in manual way; we need to upload image files to Cloudinary and attach the URLs to the Ghost blog entry, however, it is quite troublesome. Automatic upload of images and retrieval of URLs when images are directly dragged and dropped to a Ghost entry is highly preferable.

Ghost + Cloudinary Integration

An article is available in Ghost official website. You can use Ghost-Storage-Cloudinary to achieve the functionality to automatically upload images to Cloudinary and attach the relevant URLs once the images are dragged & dropped to the article editor of Ghost. The cover images in each article and the blog top page are also uploaded to and referred from Cloudinary.

Attention before installation

Once Ghost-Storage-Cloudinary is installed, the current internal storage gets unable to be referred. The URLs to the images will be redirected to turn 404. Note that all URLs of existing articles and cover images should be reassigned. This might be a bug in case of installing the module to Ghost 2.x.

Installing Ghost-Storage-Cloudinary

The Github page suggests that the module is not tested on Ghost version 2.x, however, I confirmed that it works on 2.12.0. We have options with git and npm to install the module. I chose npm as it might be slightly better in terms of package control.

Go to the root directory of Ghost and install the module.

$ npm install --production --no-save ghost-storage-cloudinary
$ mv node_modules/ghost-storage-cloudinary current/core/server/adapters/storage

Setting file

Add the following description to config.production.json at the Ghost root directory.

  "storage": {
    "active": "ghost-storage-cloudinary",
    "ghost-storage-cloudinary": {
      "useDatedFolder": false,
      "auth": {
        "cloud_name": "",
        "api_key": "",
        "api_secret": ""
      },
      "upload": {
        "use_filename": true,
        "unique_filename": false,
        "overwrite": true,
        "folder": "blog-images",
        "tags": [
          "blog"
        ]
      },
      "fetch": {
        "quality": "auto",
        "secure": true,
        "cdn_subdomain": true
      }
    }
  }

• Description for auth can be found in the top part of Dashboard in Cloudinary.
• secure in fetch should be true (use https to image URLs). Otherwise cover images in each article or the blog top page cannot be shown.
• upload can be configured as appropriate.

It will be a good idea to restart Ghost once the setting is done. Execute the following command at the Ghost root directory.

$ ghost restert