Tips & Tricks

Create re-usable snippets of content that can be quickly accessed and inserted into any new post.

A Better Method for Embedding YouTube VideosCompared to the current YouTube card in the Ghost editor, the method provided below saves over 500KB of page load. I tested this on my Ghost site using the same video for both embeds, and here is the

Learn about the differences between Cloudflare Stream and YouTube for video hosting and streaming.

Here is a fun little javascript you can use to highlight a block of text in your post. As demonstrated here, the reader can follow along as the text is revealed, as if you are typing on the page in real time.

Put html in your post excerpt and have it output the way you expect using {{{custom_excerpt}}}

Integrate your ghost blog posts on your landing page using the Ghost Content API.

Generate and install all of the standard mobile and and web app icons for your Ghost site, including your favicon.

The external web page below is embedded using David Bradshaw's free Auto-Sizing iFrame script...

Quick and easy managed collections of web links to embed into your posts. eLink.io is one of the many "bookmark managers" that provide a bookmarklet for collecting and saving web pages into categories for publishing on your site.

My curated collection of posts from around the web - random tutorials and how-tos on customizing and extending Ghost, simplified for non-coders.

Display Google Search Results in an iFrame by adding &igu=1 to the end of an URL . . .

Voice and speech synthesis-powered Sticky Notes! Artyom.js is a wrapper of the speechSynthesis and webkitSpeechRecognition APIs to add voice navigation to your websites.

Add speech interactions to your blog posts with these itsy bitsy javascripties! AnnYang is a tiny javascript library that lets your visitors control your site with voice commands. It supports multiple languages, has no dependencies, weighs just 2kb and is free to use. And there are more...

In an earlier post we learned how to add a Table of Contents to our posts and pages. In this post I've wrapped the same TOC inside the HTML5 accordion element from another earlier post. <— Here we combine the two into a collapsible

A Hassle-Free Way to Self-Host Google Fonts for your Ghosty site. 987 fonts to choose from. Copy and paste CSS, and a downloadable .zip to extract into your /fonts/ directory.

Use CSS Positioning to control your layout and the behavior of the elements on your pages. Got 15 minutes for a succinct video intro?

Add Tooltips and Popups to your Ghost posts with Tippy.js, a complete tooltip, popover, dropdown, and menu solution, powered by Popper.js.

Here are two different Ghost blogs embedded into one post . . .

Article History/Revisions in Ghost are only partially implemented. Here is a way to access the 10 revisions that are currently stored in the SQLite database . . .

Add a beautiful, fully functional contact form to your Ghost blog or website without paying for external services.

Play-With-Ghost.com - a playground to explore Ghost by using it . . . Log into the backend (admin area) of a Ghost site. (No worries - you can't break it.)

How to Display the Last Updated Date of Your Posts in Ghost.