What would help is having something to react to. Starting from zero is hard. Reacting to a draft is fast. “Move this before that” is way easier than “what should I say?”

That’s the workflow I want to show you. I use Claude Code + Marp to think through presentations. Claude helps me brainstorm the story, gives me a first draft to react to, and then I iterate, either through “conversation” or by editing the Markdown directly. The whole thing is a text file. 🎉

(I used a deck to think through this post. You can find it here.)

We'll cover:

1. The Workflow

   • Brainstorm

   • React

   • Iterate

   • Export

   • Editable PPTX

2. Get Started in 5 Minutes

   • 1. Install Marp CLI

   • 2. Install the skill (via skills.sh)

   • Run it

   • Iterate

3. Use Case: This Very Article

4. Under the Hood

   • Marp: Markdown to Slides

   • The Skill File

   • Section Dividers

   • Breadcrumb Navigation

5. Wrapping Up

The Workflow

The process has four stages: Brainstorm, React, Iterate, Export. Let me walk through each one.

Brainstorm

You kick things off with a slash command (I will provide you with this command later):

/create-marp-deck API rate limiting

Claude starts by interviewing you, asks about the goal, audience, key points, any data you want to include. This partforces you to articulate the story before a single slide exists.

~/projects/my-app $ claude
> /create-marp-deck API rate limiting
─────────────────────────────────────────────

Claude: What's this presentation about? What should the audience
        walk away knowing?

User:   How our rate limiting works, which algorithm we chose and
        why, and what they need to know to configure it for their
        services.

Claude: Who's the audience?

User:   Platform engineering team — they know our stack but haven't
        seen the rate limiting internals.

Claude: What are the key points or sections you want to cover?

User:   1. Why we need rate limiting (the incident last month)
        2. Token bucket vs sliding window — our decision
        3. How to configure it per-service
        4. Monitoring dashboard walkthrough

Think of it as a lightweight brainstorm: you talk through what you’re trying to say, and Claude helps you structure it.

React

Once you’ve aligned on the structure, Claude generates the full Marp Markdown file and exports it. You get a solid first draft you can react to and reshape.

That title slide came from this Markdown:

<!-- _class: lead title-slide -->

# API Rate Limiting
## A Technical Deep Dive

**Team**: Platform Engineering
**Date**: February 2026

Is it perfect? Probably not. But now you have something concrete, with sections, structure, and a story, that you can push around. That’s so much faster than starting from a blank canvas.

When you go through the slides, you feel if the story is coherent and clear.

Iterate

While reviewing the draft, it'll inevitably spark ideas: “oh, I should add a comparison table here,” “this section is too dense, maybe split it into two,” “move this summary up to the top.”

One way to make such edits is to ask Claude Code to do that:

"Slide 6 is too dense. Split the algorithm comparison into
two slides, one for token bucket, one for sliding window."

> Slide 6 is too dense. Split the algorithm comparison into two
  slides — one for token bucket, one for sliding window.

Claude: I'll split slide 6 into two separate slides, one per algorithm.

  Edit presentations/api-rate-limiting.md
  ───────────────────────────────────────
  - # Algorithm Comparison
  - | Feature | Token Bucket | Sliding Window |
  + # Token Bucket
  + Tokens refill at a steady rate...
  + ---
  + # Sliding Window
  + Track exact timestamp of every request...

> Add a "Why we chose token bucket" callout to that first slide

Claude: Added a blockquote callout explaining the decision.

  Edit presentations/api-rate-limiting.md
  ───────────────────────────────────────
  + > We chose token bucket because it handles bursty traffic
  + > from our mobile clients without penalizing steady callers

You can also edit in VS Code with the Marp extension for live preview. Open the .md file, hit Ctrl+Shift+V, and you get the source on the left with rendered slides on the right. Claude Code edits the file, VS Code detects the change, and the preview updates automatically. (I keep both open side by side and it just works.)

Export

When you’re done, you get three files:

• .md – the source (version-controlled, diffable)

• .html – open in any browser, share via Slack

• .pptx – open in PowerPoint, present anywhere

$ marp --no-stdin deck.md -o deck.html
[  INFO ] Converting 1 markdown...
[  INFO ] deck.md => deck.html

$ marp --no-stdin --pptx deck.md -o deck.pptx
[  INFO ] Converting 1 markdown...
[  INFO ] deck.md => deck.pptx

$ ls presentations/
api-rate-limiting.md
api-rate-limiting.html   ✓ open in browser, share via Slack
api-rate-limiting.pptx   ✓ open in PowerPoint, present anywhere

The skill runs the export commands automatically after generating the deck. A 15-slide deck converts in about 2 seconds.

Editable PPTX

The standard PPTX export renders each slide as an image  –  pixel-perfect, but you can’t edit the text in PowerPoint or Google Slides. If you need editable text, Marp has a --pptx-editable flag that uses LibreOffice under the hood to produce real text boxes.

The catch: LibreOffice creates text boxes that are too narrow, so text wraps and overlaps. The skill includes a python-pptx post-processing script that automatically widens the text boxes to fix this. Just ask for “editable PPTX” and the skill handles the rest  –  the LibreOffice conversion, the text box fix, everything.

Get Started in 5 Minutes

OK, are you ready? Here’s everything you need:

1. Install Marp CLI:

• npm install -g @marp-team/marp-cli

2. Install the skill (via skills.sh):

• npx skills add Omerr/claude-skills

This works with Claude Code, Cursor, GitHub Copilot, and other AI agents. You can also install manually  ( see the repo for details).

3. Run it:

• /create-marp-deck your topic here

4. Iterate:

React to the draft, refine through conversation or VS Code, and export.

That’s it. Four steps. Fork the repo and customize the conventions to match your style.

Use Case: This Very Article

Want to see this workflow in practice? You’re looking at it.

I wrote this article by first creating a slide deck using exactly the process I described above. I ran /create-marp-deck, answered the interview questions, got a first draft, and iterated until the story felt right. You can see the deck here.

Why start with slides? Because a deck forces you to be concise and to go through the story. If the story doesn’t flow across 15 slides, it won’t flow across 1,500 words either. The deck became my outline, and once I had a coherent structure there, writing the article was much easier.

So if you’re ever staring at a blank doc thinking “I should write a blog post about X,” try making a deck first. You might be surprised how much faster the writing goes when the story is already figured out. 😎

Under the Hood

If you’re curious about what makes this work, read on. If not, you’re all set. 🙌🏻

Marp: Markdown to Slides

Marp (Markdown Presentation Ecosystem) converts .md files into slides. Your deck starts with frontmatter:

---
marp: true
theme: default
paginate: true
size: 16:9
---

Four lines and you have widescreen, paginated slides. Slide breaks are just --- in the Markdown. Your presentation is a text file: version-controlled, diffable, and AI-editable.

The Skill File

You could just ask Claude Code to “make me a Marp presentation” every time. But you’d spend half the conversation explaining your preferred format, color palette, and slide structure.

Instead, I created a Claude Code skill (see it here), a reusable set of instructions that Claude follows whenever you invoke it. It has two parts:

1. An interview phase that gathers context before generating anything (the 5 questions from the brainstorm step)

2. A generation phase with the full Marp conventions: CSS palette, slide structure, breadcrumb pattern, formatting rules, and export commands

The full skill is about 200 lines. That sounds like a lot, but you write it once and then every deck you create follows the same polished conventions automatically.

Section Dividers

Each section of the deck gets its own gradient background. So when you’re presenting, the audience intuitively knows when you’ve moved to a new topic:

Applied via CSS classes in the skill:

<!-- _class: lead part-problem -->
# Part 1: The Problem

Breadcrumb Navigation

This is my favorite part of the whole setup.

Every content slide has a breadcrumb header at the top that shows where you are in the deck:

See that header? “The Problem > Algorithms > Implementation”, with “Algorithms” highlighted in blue.

In Marp, this is done with a simple HTML comment:

<!-- header: "The Problem > **Algorithms** > Implementation" -->

The **bold** text renders in blue (via CSS header strong { color: #2563eb; }), while the rest stays gray. You set it once per section and it persists until you change it.

How often have you sat through a presentation wondering “wait, where are we?” 🤔

Wrapping Up

The hard part of presentations is telling a coherent story. Get yourself a first draft to react to, iterate until it flows, and export. That’s it.

If you want to try it: npm install -g @marp-team/marp-cli, run npx skills add Omerr/claude-skills, and then /create-marp-deck. You'll have a deck in minutes and a workflow you can reuse for every presentation after that.

About the Author

Omer Rosenbaum is the author of the Brief YouTube Channel. He’s also a cyber training expert and founder of Checkpoint Security Academy. He’s the author of Product-Led Research, Gitting Things Done (in English) and Computer Networks (in Hebrew). You can find him on Twitter.

We just posted a course on the freeCodeCamp.org YouTube channel that will teach you the fundamentals of technical writing and help you understand its importance in various fields. The course will guide you through techniques to make your writing more concrete and practical. By the end of this course, you’ll have the skills and confidence to communicate complex information clearly and professionally. Chumki Biswas created this course.

Here are the sections in this course:

• Introduction

• What is Technical Writing?

• How to Frame a Definition?

• Using 'Class' Categories to Frame Definitions

• How to Make Definitions More Concrete?

• Describing an Object

• Special Notices

• Writing User Instructions

• Describing a Process

• How to Write a Formal Report - Types of Reports

• How to Write a Formal Report - The Main Body

• How to Write a Formal Report - The Prefatory Part

Watch the full course on the freeCodeCamp.org YouTube channel (1-hour watch).

Many of our contributors already have Hashnode accounts and publish there regularly on their personal blogs. But if you're new to Hashnode, this guide will help you get started.

And if you're already familiar with Hashnode, read on anyway – there will be some important tips you'll need to know to write and submit drafts for freeCodeCamp's Hashnode publication.

Here's what we'll cover:

1. How to set up your Hashnode account

2. How to submit drafts to the freeCodeCamp editorial team

3. How to use the Hashnode editor

4. Text formatting in the Hashnode editor

5. Other writing tips – freeCodeCamp's publication style guide

How to Set up Your Hashnode Account

To start writing on freeCodeCamp's publication, you'll need a Hashnode account. If you don't already have one, you can sign up for one for free at hashnode.com.

Once you have an account, send us your username at editorial@freecodecamp.org and we'll invite you to the publication.

You'll see a notification in your Hashnode profile once we do that:

You'll also see the freeCodeCamp publication listed as one of your available publications.

Then you can share drafts with us when you're ready.

Something to keep in mind: if you have a different Hashnode profile/username from what you had on Ghost, the URL for your author profile will change. We'll eventually have redirects in place, but this will take some time.

In the meantime, we just want you to be aware of this in case you've listed this URL on your personal portfolio, résumé, and so on. We appreciate your patience as we get those redirects set up.

How to Submit Drafts to the Editorial Team

When you set up your account and sign into Hashnode, you'll see the home screen. Click on "Write", and you'll be taken to this page:

Go ahead and write your draft (or paste it in from whatever other editor you use. If you do this, make sure you check that all formatting, code blocks, and so on render correctly. You'll also need to delete and directly upload any images you want to share, as this is the best way to assure they'll render correctly in the published version of the article).

When your draft is ready to submit, you'll click the "Publish" button in the upper right. Then you'll see the option to choose which publication – you should see both your own blog and freeCodeCamp's publication. Select freeCodeCamp's publication.

Hashnode will ask you if you want to switch, and if you do, it'll refresh the page, switching to freeCodeCamp's publication.

Then you'll see a "Submit Article" button in the upper right. Click that.

But there's a key (required) second step: you then also need to copy the draft URL and send it to editorial@freecodecamp.org. Make sure you send the draft URL and not the preview URL – this will make it much easier for us to get to your draft (as we can just click into it, rather than searching through the Hashnode interface).

You'll need to do this – that is, email us the draft URL – so that we can establish an email chain in case we need to share any feedback and make any edit requests before publishing.

Note: you must email the draft to the editorial team for us to review it (as well as submitting it via Hashnode's "Submit Article" button). You can't just click the submit button (or just email it) – both steps are required.

How to Use the Hashnode Editor

Hashnode's editor is pretty straightforward to use – and isn't all that different from the Ghost editor.

Here's what the page looks like when you get ready to write:

When you write a draft in Hashnode, you'll need to:

1. Send us your photo for the cover image (if you'd like your photo included. If not, no worries - our designer will create a cover without your photo). Note that you just need to do this the first time you submit a draft. After that, we'll have the photo saved. If you ever want to change the photo we use for the covers, just send us a new one and we'll update it in our spreadsheet.

2. Add an article title (we don't use subtitles in freeCodeCamp's publication, so you can ignore that)

And then you can start writing.

Once you've finished your article, make sure you click the "Publish" button. You'll see this menu (you'll be able to scroll down for more options, which I'll talk about below):

Then you'll need to:

1. Select the freeCodeCamp publication ("Select a blog")

2. Check your article slug and make sure it's nice and clear/concise (like javascript-array-tutorial or learn-python-by-building-projects)

3. Create a table of contents. Note that the auto-generate ToC feature in Hashnode won't work for our publication – so you'll need to manually create your own. More on that below.

4. Select and add the tags you'd like your article to have. We recommend 3-5 tags, or as needed.

5. Finally, click "Submit for review", and then email the draft URL to editorial@freecodecamp.org. Again, both are required in order for us to be able to access and review your draft and send you feedback.

The process after that will be pretty similar to our current process: we'll share any feedback or update requests, you'll make your updates and let us know via email that they're done, and we'll do our final review and either ask for more edits or we'll publish the article.

Note that the /news front end will remain the same – readers won't know the difference. It's just the back end/editor/writing experience that's changed a bit.

Text Formatting in the Hashnode Editor

To access text formatting options, just type a forward slash and a pretty extensive menu will appear:

You can scroll down, click through the buttons along the top, or just start typing what you're looking for (like "table", "embed a link", "code", "quote" and so on) and the menu will filter through options accordingly.

There are a few things we'd like to call out that are a bit different from Ghost:

1. How to Add a Table of Contents to Your Articles in Hashnode

There are two ways to add a table of contents to your article: using a handy ToC generator that one of our contributors created, or manually (which we'll describe below).

How to use the ToC generator

One of our contributors created this freeCodeCamp Table of Contents (TOC) Generator (thanks, Ashutosh!). It's designed to simplify your writing process by automatically generating a structured TOC based on the headings in your draft post.

To get started, simply paste the Hashnode Preview URL from your freeCodeCamp post into the input field. You can get this by clicking the "Preview" button in the top right of your draft, under the three dots, and copying the URL from your draft preview from the new tab.

The TOC generator works with both single-level (H2 headings only) and multi-level (H2 and H3) structures, so you can choose the level of detail you want for your TOC.

Once you've selected the TOC type and entered your post link, click the "Generate TOC" button. The generated TOC will appear in the output box on the right, ready for you to copy and paste directly into your article. The links in the TOC will automatically correspond to the headings in your post, making it easy for readers to navigate.

If you encounter any issues or have questions, refer to this detailed guide for further instructions on using the TOC Generator effectively.

How to add your ToC manually

If you'd prefer to manually add a ToC to your Hashnode draft, you'll have to follow a bit of a workaround at the moment.

What you'll need to do is create the ToC in markdown in another editor of your choice (that is, NOT in Hashnode) and then paste it into your draft in Hashnode.

So, for example, it'll look like this:

So, here are the steps to create the markdown ToC in your editor of choice (not Hashnode) with the headings (and, if necessary, subheadings) you'd like to include in the ToC:

1. Open the article preview (in Hashnode) by clicking the three dots and selecting "see preview" in the top-right corner of the page. This will bring you to Preview mode. Scroll down until you see your first heading that you'd like to include.

2. Next, you'll need to get the IDs from the headings to create the internal links (just as you've likely done in Ghost). So just inspect each heading and grab the "heading id" text from the devtools:

   

   Format it like this: [Heading Text](#heading-heading-text). Yes - you do need that first "heading" term before the rest of the dasherized text. You'll get this automatically if you just copy the heading id text as shown above. Just paste it in after the #.

   So again, it'll look like this in your other editor of choice:

   

3. Then, paste that directly into your Hashnode draft where you'd like the ToC to be (typically right after the intro). This should properly format as rich text in Hashnode with the internal ToC links!

2. A Note on Markdown in Hashnode's Editor

At the moment, you shouldn't write in markdown directly in Hashnode's editor, as it doesn't fully support all markdown features.

You can use basic markdown formatting if you're used to writing that way – like using ## for headings, * or - for bullet points, and so on – and the editor will convert those into rich text.

But for now, links and images don't work in markdown. So if you go to add a markdown link, for example [freecodecamp.org](https://www.freecodecamp.org), it won't render properly as a link in the published article. It'll just look like what you typed. Same with images.

So for the time being, just use in-line linking like this (which you can do by highlighting the text you want to link and then choosing the little link symbol from the menu that pops up and pasting in the link there).

A note on images

As for images, you can drag/drop them in where you want them, or use the / menu we talked about above and search for "image". Then you can upload whatever image you'd like to use.

And if you're looking for a way to add a caption, you won't find it at the moment. So instead, just add alt text to your images. You can do this by clicking on the image, and you'll see a menu appear. There's an uppercase "T" in that menu – click on that and there you can add your alt text:

Note that if you write the markdown elsewhere (in another text editor) and paste it into the Hashnode editor, it should work fine (including images and links). Hashnode's editor will convert the markdown into rich text.

Adding tables in the Hashnode editor

If you'd like to include a table in your article, it's pretty easy to do in Hashnode. The editor's table builder is quite good for simple tables, and you can just copy and paste simple markdown tables into the editor directly.

If you need a more complex table - for example one that needs line breaks or a list within a cell - it's best just to put the markdown table into a code block. That will ensure that all the formatting renders properly.

3. How to Format Math Equations in Hashnode

Hashnode uses a tool called MathJax to add properly formatted equations to articles (you may have heard of similar tools like LaTeX or KaTeX). You can read about how to use MathJax on their website here.

So if you're using mathematical equations in your tutorials, please format them using MathJax. Don't include screenshots of equations, as this isn't accessible and won't be readable by screen readers.

Here's a helpful preview tool for your MathJax equations so you can make sure they've turned out correctly.

You'll also need to add the "MathJax" tag as one of your article tags (just make it the last one). This lets the editor know to apply the proper formatting.

Other Writing Tips

For more general writing tips and guidelines, you can still refer to our publication style guide here.

Happy writing!

When you write a long blog post or an article with independent sections, consider adding a table of contents. It can help your readers understand your article's content and know what's coming. Providing hyperlinks to each title in the table of contents helps readers navigate between the sections they want to check out.

Having a table of contents in your articles also benefits you as a writer. First, you can easily see the flow of your article. Another benefit is that it can increase your blog's traffic. If your readers have a great experience reading your article, they will likely bookmark and return to it.

Some publications use Ghost to write and publish articles on their website, and freeCodeCamp is one of them. In this article, I will walk you through how to add a clickable table of contents to your article on Ghost.

Table of Contents

• Understanding Headings
• How to Add a Table of Contents
  • Step #1 - Create a List of Headings
    • Create a List of One-Level Headings
    • Create a List with Subheadings
  • Step #2 - Inspect a Heading and Find the id
  • Step #3 - Add the Link
    • Add a Link to a Heading
    • Add a Link to a Heading in HTML
    • Why Does the Link Not Work?
• Final Words

Understanding Headings

Before we jump into how to add a table of contents, let's take a moment to understand "headings" because I will use this term going forward.

Headings are titles of sections and subsections that are displayed on a website.

There are six levels of headings based on the importance of the section.

Levels of headings – H1 - H6

Following best practices, a page on a website should only have one heading level 1 (known as h1). It is the main title of the page. In your case, it'll be the main title of your article. (In this article, it's "How to Add a Table of Contents to Your Article on Ghost".)

So, writing an article on Ghost (or any other publication platform) leaves you with h2 to h6 for your section and subsection titles. And you can use as many of them as you need depending on the hierarchy and organization of your content.

How to Add a Table of Contents

You can create your table of contents whenever you want – before you write, during the process, or after you finish writing your article.

But you can only add the link to each chapter or section title after writing your article. This is because you'll need to know exactly how the text of the headings will appear in order to link to them properly, as you'll see below.

In this guide, I'll show you how to build a ToC in HTML, which allows you to add subheadings in addition to main headings/section titles.

Step #1 - Create a List of Headings

You can create a table of contents with a list of one-level headings (h2) or include the subheadings (h3 to h6) if you want to.

You can also choose how you want to format your list:

• Unordered List: A list with bullet points.
• Ordered List: A list with numbers.

Create a List of One-Level Headings

Follow these steps to create a one-level headings list:

1. Insert a new line.
2. Type a dash (-) or an asterisk (*) for the unordered list. Or, type a number and add a period — for example, 1. — for the ordered list.
3. Hit the spacebar.
4. Add the title.
5. Click enter to add a new item in the list.

Add an unordered and an ordered list.

Note: You can skip the next section and go directly to "Step #2 - Inspect a Heading and Find the id" if you want.

Create a List with Subheadings

If you wish to create a list with subheadings (nested list), you must use HTML to format it manually, as Ghost doesn't have nested list options built into the editor.

First, you need to add the HTML card:

1. Start on a new line.
2. When your cursor is on the new line, you will see a plus (+) icon button in the circle on the left. Click this button.
3. Click the "HTML" option.

A plus sign and an "HTML" option on Ghost.

Afterward, you will see the HTML card, as shown in the image below.

HTML card on Ghost.

Now, let's start adding the list of your headings and subheadings.

Add an HTML unordered list (<ul></ul>) or an ordered list (<ol></ol>) element.

<ul></ul>

or

<ol></ol>

To add the list of your headings, add a space between the ul or ol tags. Put the cursor between the tags and hit enter twice.

<ul>

</ul>

Then, add list elements (<li></li>) in the empty line between the opening and closing ul or ol tags. Add these list elements based on the number of your section titles.

<ul>
    <li></li>
    <li></li>
    <li></li>
</ul>

Afterward, put each of the titles between the li tags.

<ul>
    <li>Heading 2 - Part 1</li>
    <li>Heading 2 - Part 2</li>
    <li>Heading 2 - Part 3</li>
</ul>

To add subheadings, repeat all the steps. But now, you should put the ul or ol element inside the li element(s) that hold the section title. Here's how to do it:

1. Place your cursor between the end of the section title and the </li> tag, then click enter.
2. Click enter again to add a space and add an ul or ol element for the subheadings.
3. Add an ul or ol element in the new line, put the cursor between the tags, and hit enter twice to add a space.
4. Add li element(s) in the new line between the ul or ol tags.
5. Put the subsection title between the li tags.

Creating a nested list in HTML.

Below is an example of a table of contents with subheadings in HTML.

<ul>
    <li>Heading 2 - Part 1
        <ul>
            <li>Heading 3</li>
            <li>Heading 3</li>
        </ul>
    </li>
    <li>Heading 2 - Part 2
        <ul>
            <li>Heading 3
                <ul>
                    <li>Heading 4</li>
                </ul>
            </li>
        </ul>
    </li>
    <li>Heading 2 - Part 3</li>
</ul>

And the result will look like this:

A list of section and subsection titles.

Step #2 - Inspect a Heading and Find the id

After creating the list, it's time to add the links to the titles in your table of contents.

But first, you need to find the id attribute of your heading using preview mode by inspecting the title with your browser's (Chrome or Firefox) developer tools.

So, let's open your preview mode:

1. Click the gear icon on the top right of your Ghost editor.
2. Click the "Preview" link beside the "Post URL" input.

The "Preview" link is in the "Post settings" on Ghost.

Now that you are in the preview mode, right-click your mouse. You will see some options. Click the "Inspect" option to open the developer tools.

"Inspect" option on Chrome.

In the developer tools, let's click the button with a box and arrow icon on the top left to select a heading element on the page and inspect it.

"Select an element in the page to inspect it" button in the developer tools on Chrome.

Hover over a title and click on it. It will highlight the element you want to inspect in the developer tools. Inside the heading element (h2 to h6), you will see an id (shown with a red line in the image below).

Inspect a heading with developer tools on Chrome.

Double-click on the value inside the quote marks of the id and copy it. You will use it to add the link to the title in the table of contents.

Note:

• If you created a list of one-level headings, head to the "Add a Link to a Heading" section.
• If you made a list with subheadings, go to the "Add a Link to a Heading in HTML" section.

Step #3 - Add the Link

Add a Link to a Heading

To add the link, return to your table of contents in the Ghost editor. Then, follow these steps:

1. Highlight the title that you want to add the link to.
2. Click the chain icon.
3. Type a hashtag (#) in the input field and paste your copied id value.

So, it will be like this:

Highlighting a list and a chain icon on Ghost.

#understanding-headings

After you refresh the preview page, check if the link works. It should take you to the target section when you click the title's link. If not, read the "Why Does the Link Not Work?" section.

Add a Link to a Heading in HTML

First, let's return to your Ghost editor and go to the li element that holds the title in the table of contents.

Then, wrap the title inside an anchor element (<a></a>) and add href="" attribute in the opening tag.

<ul>
    <li><a href="">Understanding Headings</a></li>
</ul>

The anchor element creates a hyperlink, and the href attribute is the placeholder for the link's destination.

Now, you will add the link's destination. Type a hashtag (#) and paste the id value you've copied inside the double quotes of the href.

<ul>
    <li><a href="#understanding-headings">Understanding Headings</a></li>
</ul>

Repeat all the steps to add a link for each title.

Below is an example of section and subsection titles with links in HTML:

<ul>
    <li><a href="#understanding-headings">Understanding Headings</a></li>
    <li><a href="#adding-a-table-of-content">Adding a Table of Content</a>
        <ul>
            <li><a href="#step-1-create-a-list-of-titles">Step #1 - Create a List of Titles</a></li>
        </ul>
    </li>
</ul>

After refreshing the preview page, you can now check if the link works by clicking it. If it doesn't work, read the next section.

Why Does the Link Not Work?

If you click a link in your table of contents and it goes nowhere or redirects you to a "404 Page not found", return to the preview page. Refresh it, and try to click the link again.

If it still does the same, you need to check the link in the Ghost editor.

Sometimes, it can be a typo where you change the title but still need to update the link. Or there is a missing hashtag (#) in the link.

Final Words

If you liked and found this article helpful, please share it with others. You can find other works on my blog. Let's connect on X (formerly Twitter) or LinkedIn.

So in this article, you will get access to the commonly used quotation marks out there that you can copy and paste them into your articles, papers, and HTML.

It doesn’t end there. You will get access to the Unicode characters, HTML entities, and CSS entities of all the smart quotes. Make sure you check the end of this article so you can learn how to use the HTML and CSS entities and Unicode characters of the smart quotes.

Before showing you a table containing all the smart quotes, let's see how to use them in HTML and CSS first.

What We'll Cover

• How to Use Smart Quotes (Quotation Marks) in HTML and CSS
• Table of Smart Quotes, their Unicode Characters, HTML, and CSS Codes
• Conclusion

How to Use Smart Quotes (Quotation Marks) in HTML and CSS

To use smart quotes in HTML and CSS, you need their Unicode characters. For instance, the Unicode for quotation marks is U+0022. So, to use it in HTML, strip out the U+ part, prepend the other letters or numbers with &#x, and end them with semicolon (;) like this:

"

That translates to this: "

In CSS, you need to strip out the U+ part again and replace them with a backslash (\). So this is how you'd use a quotation mark in CSS:

\0022

But there's a caveat to using Unicode characters in CSS. To make them visible on a web page, you need to create a pseudo-element and make the Unicode character the content:

element::after {
  content: '\0022';
}

Table of Smart Quotes, their Unicode Characters, HTML, and CSS Codes

The table below contains the quotation marks available for use in HTML and other writings:

Note: if you have a Mac, you may not be able to see the "Double low revesed quotation mark" and the "Heavy low single comma quotation mark". Here's what they're supposed to look like:

Conclusion

I hope this article helps you learn about the smart quotes out there, and how to use them in your HTML and CSS files, and other writings.

Try to share the article with your friends and family so they can have access to the smart quotes.

Thank you.

Ghost targets primarily writers and all the features are specifically built for writing.

Ghost's new dashboard gives you a user-friendly interface, and beginners can easily understand the functionality. In addition, Ghost's free tutorials will help you if you have any problems.

Some cool Ghost features:

1. Open-source
2. Membership support
3. Rich text editor (Koenig editor)
4. Newsletters
5. Email subscriber support
6. Login functionality support
7. Integration plugin
8. Analytics dashboard
9. Inbuilt comment support
10. Inbuilt search support
11. Inbuilt search functionality
12. SEO and different types of metadata support social media
13. Custom theme design

You can check out all the code available for this project on GitHub here.

Here's what we'll cover:

1. Self-Hosting vs Hosting with Ghost
2. What Are the Drawbacks of Ghost?
3. How to Install the Ghost CMS
4. Understanding the Ghost Folder Structure
5. Understanding the Ghost Theme Folder Structure
6. How to Create a New Theme with the npm CLI Tool
7. How to Create a New Ghost Theme from Scratch
8. How to Install ghost-cli Globally
9. How to install Ghost locally
10. How to Configure Tailwind CSS
11. Other Important Commands in the Ghost CLI
12. How to Write the Code for Our Custom Ghost Theme
13. How to add theme configuration in package.json
14. How to Use Theme Helpers
15. What is the Partials Folder?
16. How to Create a Default Page
17. How to Create an Index Page
18. How to Create a Posts Page
19. How to Create Information Pages
20. How to Create an Author Page
21. How to Create a Tags Page
22. How to Create an Error Page
23. How to Enable Comments
24. How to Set Up Search
25. Conclusion

Self-hosting vs Hosting with Ghost

Ghost provides two ways to create/host your website:

1. Self-hosting
2. With the Ghost cloud platform

Self-hosting

If you choose to self-host, you'll host your website on any cloud platform like Google cloud, AWS cloud, Azure cloud, Digital Ocean, and so on. These are some of the most used cloud platforms in the market.

Most cloud platforms come with one click to deploy solutions. This means you can deploy your Ghost blog with a single click.

Before deploying your Ghost blog, you should compare all cloud platforms based on pricing before choosing one.

Self-hosting your Ghost blog is free, and you do not need to pay anything to the Ghost platform. You'll just pay your cloud provider.

Hosting with the Ghost Cloud Platform

If you choose to host with Ghost, they'll help create the blog and host it on the Ghost platform itself. The Ghost team handles all the maintenance and security. You won't have to worry about updating Ghost and any themes you're using – the Ghost staff will handle that for you.

Self-hosting focuses more on developers, while hosting with the Ghost platform targets anyone who doesn't know about computers and programming.

Ghost hosting comes with a paid plan – it's not free. But they give you 14 day free trial period, after which you shift automatically into a paid plan.

What should you choose, paid or self-hosting?

In my experience, hosting with the Ghost platform is the best solution for beginner developers, non-developers, and writers. The Ghost team handles everything for you. You do not worry about traffic, security, or maintenance and do not need to update the Ghost CMS. This lets you focus on writing.

As a developer, I always recommended that you self-host Ghost. I have run my self-hosted Ghost blog with Google Cloud for two years with a Bitnami one-click deployment.

After six months, I'd used up my $200 free credit, and then I started to pay monthly to Google Cloud hosting.

For a non-technical person, I highly recommended using the Ghost (pro) cloud platform and as well any other platform that provides Ghost-based cloud and shares hosting.

I found a list of Ghost-hosting platforms on the internet. Perhaps one of these will solve your hosting issues or questions. If you plan to deploy Ghost with the Google Cloud platform, I have an article on that.

What are the Drawbacks of Ghost CMS?

The biggest drawback of Ghost is that web performance can feel slow. If you want good web performance, you'll likely need to use a CDN for media (images, videos, and PDFs) and also for CSS and JavaScript.

The second biggest drawback is cost. I've been running my blog with Ghost for two years, and I pay 10 to 20 times extra to Google Cloud for hosting as a self-deploy.

My website has 4000 to 5000 active monthly users, and I pay 20 times extra. Because of this, I shifted my website to Hugo.

Now I still have 4000 to 5000 active users on the website, and I pay zero money to Netlify.

The Solution for Developers

The best solution for developers is to use Ghost as a backend and, with the REST API, choose any JavaScript framework like Next.js, Fresh, Astro, and so on.

There are a lot of frameworks that can help you build a static website. In addition, static websites are fast and deploy with zero JavaScript.

In this method, you may not use all Ghost's features, but you can save a lot of money. Still, building the website with a JavaScript framework takes a lot of time just to run the essential version of the website.

My solution only works well for a small team. So if your team has a lot of writers and submits many articles in a single day, I'd recommend sticking with Ghost CMS as a frontend and backend.

Ghost version 5.0 is 20% faster than the old version. Suppose you use Ghost and want to design your own custom theme – then this article is for you. Let's get started.

How to Install the Ghost CMS

How you install Ghost CMS changes according to your operating system. We'll discuss installation for all operating systems in this guide. You can install Ghost with npm, yarn, and Docker.

Now let's look at how to install Ghost for:

1. Windows, Linux, and macOS
2. Docker image

How to Install Ghost on Windows, Linux, and macOS

Setting up the Ghost theme development environment in Windows and macOS is a straightforward process. But it's best if you've installed the npm or yarn package manager. If you don't have Node.js, npm, and yarn, yolu'll need to install them – Node.js comes with preinstalled npm and yarn.

To install Ghost CMS globally and locally, follow these basic steps:

How to install ghost-CLI globally

First, you can install ghost-cli globally on your machine using npm or yarn. Here are the commands:

npm install ghost-cli@latest -g
    OR
yarn global add ghost-cli@latest

How to install Ghost locally

Next, when your ghost-CLI installation is complete, then run the ghost local command in your terminal. It looks like this:

ghost install local

The command output looks like this:

Ghost cms folder structure

Note: you'll need to run the ghost install local command in an empty folder. Otherwise, you'll face an error:

Not empty directory error with ghost-cli

To start the local development server, run the ghost start command in your terminal.

Ghost start command

If you get an error when running ghost start in Ubuntu, run the following command: ghost start --no-setup-linux-user.

The directory is not readable by other users' error in Ghost CMS.

How to Set Up Your Environment Using a Docker Image

Docker is also a great way to set up a theme development or production environment for Ghost. The Ghost team provides an official Ghost Docker image on Docker Hub.

To start the setup, you'll need the docker-compose.yml file in your root project folder. Then run the docker-compose up command in your terminal.

version: '3.8'
services:
  blog:
    image: ghost
    restart: always
    ports:
      - 8080:2368
    volumes:
      - ./custom-ghost-theme:/var/lib/ghost/content/themes/custom-ghost-theme/
    environment:
      url: http://localhost:808
      NODE_ENV: development

In the volume section, you pass your file. In my case, I added a specific file in my Ghost theme folder.

version: '3.8'
services:
  blog:
    image: ghost
    restart: always
    ports:
      - 8080:2368
    volumes:
      - ./assets:/var/lib/ghost/content/themes/fastest/assets
      - ./partials:/var/lib/ghost/content/themes/fastest/partials
      - ./author.hbs:/var/lib/ghost/content/themes/fastest/author.hbs
      - ./default.hbs:/var/lib/ghost/content/themes/fastest/default.hbs
      - ./error-404.hbs:/var/lib/ghost/content/themes/fastest/error-404.hbs
      - ./error.hbs:/var/lib/ghost/content/themes/fastest/error.hbs
      - ./gulpfile.js:/var/lib/ghost/content/themes/fastest/gulpfile.js
      - ./index.hbs:/var/lib/ghost/content/themes/fastest/index.hbs
      - ./package-lock.json:/var/lib/ghost/content/themes/fastest/package-lock.json
      - ./package.json:/var/lib/ghost/content/themes/fastest/package.json
      - ./page.hbs:/var/lib/ghost/content/themes/fastest/page.hbs
      - ./post.hbs:/var/lib/ghost/content/themes/fastest/post.hbs
      - ./query.hbs:/var/lib/ghost/content/themes/fastest/query.hbs
      - ./tag.hbs:/var/lib/ghost/content/themes/fastest/tag.hbs
      - ./readme.md:/var/lib/ghost/content/themes/fastest/readme.md
    environment:
      url: http://localhost:8080
      NODE_ENV: development

In your custom-ghost-theme folder, you need the index.hbs, post.hbs, and package.json files to start theme development. But, you'll get an error when you activate your theme in the Ghost dashboard without requiring a file.

Here's the GitHub repo if you want to follow along:

Errors

In Ubuntu (22.04) or any other Linux distros, you'll get the Message: The directory /home/rajdeepsingh/ is not readable by other users on the system error. This means yours is old. So update your ghost-cli then run the ghost start command in your folder.

Understanding the Ghost Folder Structure

The Ghost folder structure has three main folders and one file. They are:

1. The config.development.json file contains the configuration for Ghost development.
2. The current folder is a link (symbolic link) that targets the install version.
3. The version folder contains all versions of Ghost cms.
4. The content folder is the main folder containing our database file, settings, theme, images, media, and so on.

Ghost CMS folder Structure

The folder structure might change according to the operating system but the content folder is the same in every operating system.

The content folder contains all the important files for Ghost. They are:

1. The data folder contains an SQLite3 database file. Ghost, by default, uses the SQLite3 database.
2. Files, images, and media folders contain all files which writers upload.
3. The public folder contains all public CSS and JavaScript files – for example, card and member JavaScript and CSS files.
4. Finally, the settings folder contains all the settings, for example, the router.xml file.
5. The theme folder contains all files and folders used to develop the theme.

Understanding the Ghost Theme Folder Structure

You can build a new custom theme store in the content/theme folder. To develop a new theme, you'll always need to create a new folder with the theme name and store all files in the theme name folder.

// theme structure

content 
content/theme
content/theme/my-theme-name
content/theme/my-theme-name/index.hbs
content/theme/my-theme-name/post.hbs
content/theme/my-theme-name/package.json

// rest of file created in my-theme-name folder

Ghost CMS uses handlebars to build a Ghost theme. There are a number of files but only three files are required:

1. index.hbs in the main file (required) to design the home page of the website.
2. post.hbs the file (required) is used to read and design the full article.
3. package.json file (required) is used for Node.js config, and it also uses the theme name, description, version, custom config, and so on.
4. The default.hbs file is used to build the layout of the theme.
5. The assets folder contains all the JavaScript, CSS, fonts, and image files.
6. The partials folder helps divide files into small partials (parts) for better code readability.

Ghost theme folder structure

How to Create a New Theme with the npm CLI Tool

The easiest way to start a new Ghost theme is with the create-ghost-theme CLI. I built it, and I maintain it. The create-ghost-theme CLI helps you create the following folder structure that we'll discuss next. But currently, it only supports Tailwind CSS.

First, we'll create a new theme with the create-ghost-theme CLI and restart the Ghost CMS local server again.

Folder structure

After creating a new theme with create-ghost-theme CLI, your folder structure looks like this:

create-ghost-theme cli folder structure

Understanding the New Website Layout

After creating the theme with create-ghost-theme CLI, your theme looks like this.

index.hbs

Your website reading page will look like this:

Your new tag page looks like this:

How to Create a New Ghost Theme from Scratch

When you're learning about Ghost theme development, my recommendation is to start creating a new theme from scratch. Then you can use the CLI tool I just showed you. This will be a lot easier for you.

So now, that's what we're going to cover in-depth: how to create a new Ghost CMS theme from scratch.

Requirements:

To create a new theme, you'll need two libraries: the first is ghost-cli and the second is Tailwind CSS.

Here's what we'll go over in the coming sections:

1. How to install Ghost-cli globally
2. How to configure Tailwind CSS
3. How to understand more commands in the Ghost CLI
4. Finally, we'll write the code

How to Install ghost-cli Globally

We went over how to do this above, but in case you need a reminder here it is:

First, you can install ghost-cli globally on your machine using npm or yarn. Here are the commands:

npm install ghost-cli@latest -g
    OR
yarn global add ghost-cli@latest

How to Configure Tailwind CSS

Tailwind CSS is a powerful CSS library for designing the front end of a website. And you can easily use it with Ghost.

Install Tailwind CSS in your theme folder like this:

npm install -D tailwindcss postcss autoprefixer

After Tailwind and another package have been successfully installed, then run the following command to configure Tailwind for your theme development:

npx tailwindcss init

The tailwindcss init command creates a tailwind.config.js file. Here's what you'll see:

/** @type {import('tailwindcss').Config} */
module.exports = {
content: [],
  theme: {
    extend: {},
  },
  plugins: [],
}

Config your template path in the content section, so Tailwind CSS tracks the CSS classes. Then compile those classes in the production file.

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ["*.hbs","partials/*.hbs"],
  darkMode: 'class',
  theme: {
    extend: {},
  },
  plugins: [],
}

Create a main.css or dev.css and use any other file name to create the file for Tailwind directives. Then paste the following tailwind CSS directives code into the file:

@tailwind base;
@tailwind components;
@tailwind utilities;

Create the script for Tailwind CSS to check all the classes then create a production-ready CSS file for your theme.

    "scripts": {
        "start": "npx tailwindcss -i ./assets/css/dev.css -o ./assets/build/css/build.css --watch"
    },

The last step is to link the production-ready CSS file to your theme like this:

<head>
    {{!-- link production ready css file  --}}
    <link rel="stylesheet" href="{{asset 'build/css/build.css'}}" />
</head>

The one problem you might face when you enable Tailwind CSS in a Ghost theme is that refreshing your site in the development process is manual. When you change anything related to Tailwind classes, you'll need manually refresh your website again. I haven't found a solution yet, but you can use the live server for that for now.

Other Important Commands in the Ghost CLI

There are a number of other commands you'll use often when working in the Ghost CLI. Let's go through them now. Here's what we'll discuss:

1. ghost stop
2. ghost ls
3. ghost doctor
4. ghost uninstall
5. ghost version
6. ghost restart
7. ghost update
8. ghost version
9. ghost --help

How to use the ghost stop command

The ghost stop command stops the currently running instance.

How to use the ghost ls command

The ghost ls command prints the current installs instance list in your machine.

How to use the ghost doctor command

The ghost doctor command checks the system's health to see if everything is fine before running the ghost install or ghost update command.

If you face any errors in Ghost, you can also use the ghost doctor command to check the errors.

How to use the ghost uninstall command

The ghost uninstall command removes the Ghost instance and related configuration files as well.

How to check the Ghost version

You can use the ghost version command to check your currently installed version of Ghost.

How to use the ghost restart command

The ghost restart command restarts your currently running Ghost instance.

How to use the ghost update command

The ghost update command updates your old Ghost version to the new version.

How to use the ghost --help command

The ghost --help command prints a help page:

Finally, we'll write the code

Now we get to start writing the code. Here's what we'll cover in the coming sections:

1. How to add theme configuration in package.json [required]
2. How to use theme helpers
3. What is the partials folder?
4. How to create a default page
5. How to create an index page [required]
6. How to create a posts page [required]
7. How to create informational page
8. How to create a tags page
9. How to set up comments
10. How to enable search

How to add theme configuration in package.json

The package.json file is the main file where you add or change the theme name, description, and custom configuration for the theme.

The first step is to create package.json file and add the theme name, description, version, and additional configuration.

The following properties are used by Ghost themes: name, description, version, engines, card_assets, license, author, keywords, screenshots, and config in the package.json file.

The most important properties are name, description, version, engines, card_assets, and config. Here's what this looks like in the code:

{
    "name": "fastest",
    "description": "Fastest ghost cms base theme. Fastest is light weight, modern open-source theme",
    "version": "1.0.7",
    "engines": {
        "ghost": ">=5.0.0"
    },
    "license": "MIT",
    "scripts": {
        "dev": "gulp",
        "start": "npx tailwindcss -i ./assets/css/dev.css -o ./assets/build/css/build.css --watch"
    },
    "author": {
        "name": "Rajdeep Singh",
        "email": "officialrajdeepsingh@gmail.com",
        "url": "https://officialrajdeepsingh.dev"
    },
    "keywords": [
        "ghost",
        "theme",
        "blog",
        "light weight",
        "ghost-theme"
    ],
    "screenshots": {
        "desktop": [
            "assets/dark.png",
            "assets/light.png"
        ],
        "mobile": "assets/mobile.png"
    },
    "config": {
        "posts_per_page": 10,
        "card_assets": true,
        "image_sizes": {},
        "custom": {
            "linkedin_url": {
                "type": "text",
                "default": "None"
            },
            "github_url": {
                "type": "text",
                "default": "None"
            },
            "instagram_url": {
                "type": "text",
                "default": "None"
            },
            "copyright": {
                "type": "text",
                "default": "Copy right by Rajdeep Singh"
            },
            "copyright_url": {
                "type": "text",
                "default": "https://officialrajdeepsingh.dev/pages/terms-and-conditions/"
            },
            "adsense_enable": {
                "type": "select",
                "options": [
                    "Disable",
                    "Enable"
                ],
                "default": "Disable"
            }
        }
        },
    "devDependencies": {
        "@tailwindcss/typography": "^0.5.8",
        "autoprefixer": "^10.4.13",
        "cssnano": "^5.0.17",
        "gscan": "^4.22.0",
        "gulp": "4.0.2",
        "gulp-autoprefixer": "^8.0.0",
        "gulp-concat": "^2.6.1",
        "gulp-cssnano": "^2.1.3",
        "gulp-livereload": "4.0.2",
        "gulp-sourcemaps": "^3.0.0",
        "gulp-uglify": "^3.0.2",
        "postcss": "^8.4.20",
        "tailwindcss": "^3.2.4"
    }
}

You can learn more about card_assets and config for the theme. The config section helps add configuration for Ghost. You can also add more custom configuration for Ghost and enable and disable it with the Ghost UI.

To check all configurations, go to Ghost > Settings > Design > and click Site-wide. There you can check all configuration lists provided by the theme developer.

custom config enable and disable in ghost cms

How to Use Theme Helpers

The Ghost team provide lots of helpful functions to add additional functionality to the Ghost theme with handlebars. Some of the functionality by default comes with handlebars and other functionality is built by the Ghost team and maintained by the community.

The Ghost team uses handlebars to build the entire Ghost CMS and theme. Basically, handlebars.js is a template language that helps you build both static and dynamic websites.

There are lots of Ghost helpers like foreach, get, if, is, match, @config, comments, navigation, post, total_members, total_paid_members, block, asset, ghost_head, ghost_foot, pagination, partials, body_class, block, search and many more.

You can read about all of the helpers on the official docs. You can also copy-paste some of the code so you do not need to remember.

What is the Partials Folder?

The partials folder is like a component folder where you define all components for your theme. Basically, components are reusable code that you can reuse as often as you need. In the theme structure, we call these partials. All the partials are created with handlebars.js.

partials for ghost theme

I create more than 24 partials for my Ghost theme and you can easily reuse them across websites. You can use partials with the following syntax: {{> your-partials-file-name}}.

How to Create a Default Page

First, we need to built a default.hbs file. The default.hbs file helps us build a layout for the website. Here's the code:

<!DOCTYPE html>

<html class="dark scroll-smooth overflow-x-hidden" lang="{{@site.locale}}">

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    {{!-- link production ready css file  --}}
    <link rel="stylesheet" href="{{asset 'build/css/build.css'}}" />
   {{!-- ghost header --}}
      {{ghost_head}}

</head>


<body class="{{body_class}} bg-white dark:bg-slate-800 dark:text-white antialiased scroll-smooth ">

  {{!-- partials/header --}}
    {{> header}}

    <main class="mt-6 flex flex-col">

{{!-- Render other pages  --}}
        {{{body}}}

    </main>
{{!-- partials/footer --}}
    {{> footer}}
    {{> banner}}

{{!-- ghost header --}}
    {{ghost_foot}}

    <script src="{{asset 'build/js/main.js'}}"></script>

</body>

</html>

Let's see what's going on here:

1. {{meta_title}} provides the title from the website.
2. The @site is a global variable and you can access a title with {{@site.title}}.
3. Include a Ghost {{ghost_head}} in the head tag.
4. Include a Ghost {{ghost_foot}} in the footer tag.
5. Inserted all other templates with the {{{body}}} tag in index.hbs, post.hbs, and so on.
6. All other templates get inserted in index.hbs, post.hbs, and so on.
7. Include dynamic CSS classes with {{body_class}} in the <body> tag
8. Add footer partials in the default {{> footer}} file
9. Add header partials in default {{> header}} file
10. Include assets from the {{asset "build/tailwind.css"}} folder.

How to Create an Index Page

Create index.hbs in the Ghost theme

The index page is the main page of the website. You can create a similar index page with the following code:

{{!--  Add default.hbs layout file --}}
{{!< default}} 

{{!-- loop all the posts and show on home page --}}

{{#foreach posts}} 

{{!--  check condition defined in config section in package.json and add adsense code after every third post --}}
    {{#has number="nth:3" }} 
        {{#match @custom.adsense_enable "Enable" }} 
            {{> ads}}
        {{/match}}
    {{/has}}

    {{!-- partials/postCard.hbs --}}
    {{> postCard }}

    {{/foreach}}

    {{!-- Add pagination --}}
    {{pagination}}

{{!--  check condition defined in config section in package.json and add adsense --}}
    {{#match @custom.adsense_enable "Enable"}}
        {{> ads}}
    {{/match}}

{{!-- newsletter partials --}}
    {{> newsletter}}

You can access all posts with a for each loop and pass them to the partials with the {{> postCard}} template. The @custom.adsense_enable is a custom config written in the package.json file and used in the theme to check that the website owner has enabled AdSense on-site or not. The custom config enables you to go to Ghost > Settings > Design > and to click on Site-wide and enable Adsense.

How to Create a Posts Page

Create post.hbs in the Ghost theme

The posts page is where readers will read your articles on your site. You can create a posts page with the following code.

{{!< default}}

{{#post}}


{{!-- Pass reading_time time to authors partials with block , learn more about about block https://ghost.org/docs/themes/helpers/block/ --}}
{{#contentFor "fastestReadingTime"}}

 <p class="text-slate-600 dark:text-slate-400 text-xs xs:text-xs sm:text-xs md:text-sm lg:text-sm xl:text-sm 2xl:text-sm ">
    {{reading_time}}
 </p>

{{/contentFor}}

{{#match @custom.adsense_enable "Enable"}}

    {{> ads}}

{{/match}}

<article class="{{post_class}} w-6/6 p-2">

    <!-- Heading section -->

    <div class="m-auto mb-4 w-6/6 xs:w-5/6 sm:w-5/6 md:w-5/6 lg:w-5/6 xl:w-5/6 2xl:w-5/6">
        <h1 class="mt-8 text-3xl xs:text-4xl sm:text-5xl md:text-5xl xl:text-5xl 2xl:text-5xl">
             {{title}} 
        </h1>
        <p class="text-slate-600 dark:text-slate-500 mt-2 text-1xl">
            {{excerpt}}
        </p>
    </div>

    <!--  Author card partials/authors -->
    {{> authors}}



    <!-- article thumbnail with partials/authors -->
    {{> featureImage}}


    <!-- article body -->
    <div class="prose-lg prose-neutral m-auto p-2 my-10 w-10/12">
        {{content}}
    </div>




</article>


    {{!-- partials/comment --}}
    {{> comment}}


{{!-- Add adsense  --}}
{{#match @custom.adsense_enable "Enable"}}

    {{> ads}}

{{/match}}

{{!-- Show related posts --}}
{{#get "posts" filter="authors:{{primary_author.slug}}+id:-{{id}}" limit="3" include="authors"}}

{{!-- if post is available then show it --}}
{{#if posts}}

<h2 class="mt-10 m-auto text-left w-5/6 text-xl xs:text-1xl sm:text-3xl md:text-4xl xl:text-5xl 2xl:text-6xl">
    Read more
</h2>

{{!-- loop all post --}}
{{#foreach posts}}
    {{> postCard }}
{{/foreach}}

{{/if}}

{{/get}}

{{!-- Add adsense  --}}
{{#match @custom.adsense_enable "Enable"}}

    {{> ads}}

{{/match}}

{{/post}}

{{!-- newsletter partials --}}
{{> newsletter}}

The fastestReadingTime block is to pass the reading time to the author partials. The @custom.adsense_enable is a custom config written in the package.json file and used in the theme to check that the website owner has enabled AdSense on-site or not. The custom config enables you to go to Ghost > Settings > Design > and to click to Site-wide and enable Adsense.

How to Create Informational Pages

Create page.hbs in the ghost theme

The page.hbs file helps you create informational pages for your website. For example, you can create an about, contact, privacy policy, or disclaimer page on your site.

{{!< default}} 

{{#post}} 

    {{!--Pass reading_time time to authors partials with block , learn more about about block https://ghost.org/docs/themes/helpers/block/     --}}
    {{#contentFor "fastestReadingTime"}}

    <p class="text-grey-600 text-xs xs:text-xs sm:text-xs md:text-sm lg:text-sm xl:text-sm 2xl:text-sm ">
        {{reading_time}}
    </p>
    {{/contentFor}}

{{!-- Add adsense base of if enable on theme  --}}
    {{#match @custom.adsense_enable "Disable"}}

        {{> ads}}

    {{/match}}

    <article class="{{post_class}}  w-6/6 p-2">

        <!-- Heading section -->
        <div class=" m-auto mb-16 w-6/6 xs:w-5/6 sm:w-5/6 md:w-5/6 lg:w-5/6 xl:w-5/6 2xl:w-5/6">
            <h1 class="text-gray-800 mt-8 text-3xl xs:text-4xl sm:text-4xl md:text-5xl xl:text-6xl 2xl:text-8xl">
                {{title}}
            </h1>
            <p class="text-gray-600 text-xl xs:text-xl sm:text-xl md:text-1xl xl:text-2xl 2xl:text-2xl">
                {{excerpt}}
            </p>
        </div>

        <!--  partials/authors -->
        {{> authors}}


        {{!--  partials/featureImage  --}}
        {{> featureImage}}



        <!-- article body -->
        <div class=" prose-xl prose-neutral m-auto p-2 my-10 w-10/12">
            {{content}}
        </div>



    </article>


    {{!-- Add adsense  --}}
    {{#match @custom.adsense_enable "Disable"}}

        {{> ads}}

    {{/match}}

    {{/post}}

The fastestReadingTime block is to pass the reading time to the author partials. The @custom.adsense_enable is a custom config written in the package.json file and used in the theme to check that the website owner has enabled AdSense on-site or not. The custom config enables you to go to Ghost > Settings > Design > and to click to Site-wide and enable Adsense.

How to Create an Author Page

Create author.hbs in the ghost theme

Author pages let you describe the author. You can show the author's name, bio, and related articles.

{{!< default}}

{{#author}}

{{!--  Author Section pass with block learn more about about block https://ghost.org/docs/themes/helpers/block/ --}}
   {{#contentFor "authorName"}}
      {{name}}
    {{/contentFor}}

<div class="container mt-20 mb-16 flex flex-col justify-between mx-auto">

    <div class="flex flex-col mt-6 w-6/6 xs:w-5/6 sm:w-5/6  md:w-3/6 lg:w-3/6 xl:w-3/6 2xl:w-3/6 xs:mt-6 sm:mt-6 md:mt-6 lg:mt-0 xl:mt-0 2xl:mt-0 ">

        <h1 class="text-3xl mt-5 xs:text-3xl sm:text-3xl md:text-4xl xl:text-5xl 2xl:text-6xl"> {{name}} </h1>

        {{#if bio}}
            <p class="mt-0 xs:mt-0 sm:mt-0 md:mt-1 lg:mt-3 xl:mt-3 2xl:mt-3 text-md">
                {{bio}}
            </p>
        {{/if}}

        <ul class="flex flex-row my-3">

            <li class="text-md">{{location}}</li>

               {{#if facebook}}

                    <li class="mx-3 text-sm flex items-center">
                        <a target="_blank" href="https://facebook.com/{{facebook}}" >

                        {{!-- Pass partials/Icons/facebook --}}
                            {{> Icons/facebook}}

                        </a>
                    </li>

                {{/if}}
                {{#if twitter}} 
                    <li class="mx-3 text-sm flex items-center">
                        <a target="_blank" href="https://twitter.com/{{twitter}}" >

                        {{!-- Pass partials/Icons/twitter --}}
                            {{> Icons/twitter}}

                        </a>
                    </li>
                {{/if}}
                {{#if website}} 
                    <li class="mx-3 text-sm flex items-center">
                        <a target="_blank" href="{{website}}" >

                            {{!-- Pass partials/Icons/website --}}
                            {{> Icons/website}}

                        </a>
                    </li>
                {{/if}}
        </ul>
    </div>
</div>


{{!--  get posts related to author base on author Id --}}
    {{#get "posts" limit="all" filter="authors:{{slug}}+id:-{{id}}" order="published_at desc"   }}

        {{#if posts}}
                {{#foreach posts}}
                    {{> authorCard}}
                {{/foreach}}
        {{/if}}

    {{/get}}

{{/author}}

How to Create a Tags Page

Create tag.hbs in the ghost theme

You can use the tag.hbs file to show articles related to the tag used.

{{!< default}}


{{#tag}}

<div class="container m-auto mt-32  mb-16  w-5/6 xs:w-5/6 sm:w-5/6 md:w-5/6 lg:w-5/6 xl:w-5/6 2xl:w-5/6">

    <h1 class=" text-gray-800 text-4xl xs:text-5xl sm:text-6xl md:text-7xl xl:text-8xl 2xl:text-9xl">{{name}}</h1>

    {{#if description}}
        <p class=" text-gray-600 text-xl xs:text-xl sm:text-xl md:text-1xl xl:text-2xl 2xl:text-2xl">
            {{description}}       
        </p>
    {{/if}}


</div>

{{!--  get posts related to tag base on  tag slug --}}

    {{#get "posts" include="authors,tags" limit="3" filter="tag:{{slug}}" as |related|}}

   {{!-- loop posts base on article --}}
        {{#foreach related}}

    {{!--  check condition define in config section in package.json and add adsense code after every third post --}}
            {{#has number="nth:3"  }}
                {{#match @custom.adsense_enable "Enable"}}
                    {{> ads}}
                {{/match}}
            {{/has}}

        {{!-- partials/postCard.hbs --}}
            {{> postCard }}

        {{/foreach}}

    {{/get}}

{{/tag}}

How to Create an Error Page

Create error.hbs in the ghost theme

You use the error.hbs file to show when any errors occur on the website. Error pages help your website not break in production. The most common error is a 404 (not found) error.

{{!< default}} 
<div class="flex flex-col m-auto p-10 w-5/6 xs:w-5/6 sm:w-5/6 md:w-5/6 lg:w-5/6 xl:w-5/6 2xl:w-5/6">
    <h1 style="font-size: 10.8rem;" class="text-black text-center">
        {{statusCode}}
    </h1>

    <p class="text-4xl -m-6 text-center">
        {{message}}
    </p>

    <a href="/" class="text-center w-32 m-auto my-20 p-3 bg-black text-white items-center rounded-full">
        Home
    </a>
</div>

How to Enable Comments

enable comments in the ghost theme

Ghost 5 officially supports the commenting system (it's built-in) and you can just enable comments on the theme by copying and pasting the code – you never need any configuration. Ghost itself handles all the configurations. Here's the code:

<div class="m-auto my-8 w-10/12">
    <p class="text-right text-xs xs:text-xs sm:text-xs md:text-sm lg:text-sm xl:text-sm 2xl:text-sm ">
        Before comment read our <a style='text-decoration: underline' href="https://officialrajdeepsingh.dev/terms-and-conditions/">term and condition </a>
    </p>
    <div class="mt-5 mb-5 p-4">

   {{!--  Enable comment on theme --}}
       {{comments}}
    </div>
</div>

How to Set Up Search

enable the search bar in the ghost theme

Ghost 5 comes with the official support of search functionality. You do not need any other configuration. Just paste the following code into your theme and the search functionally will start working on your site.

{{!-- partials/Icons/search --}}
<button class="gh-search" data-ghost-search>{{> Icons/search}}</button>

Conclusion

Building a theme with Ghost is a relatively straightforward process compared to WordPress. The Ghost team has created well-defined documentation that you can easily follow as a beginner with examples.

They also provide many ready-made components, like search functionality, amp page, comments, and so on.

You can create your Ghost theme by copy-pasting the code. For beginner developers, it might seem a bit complicated, but you'll get the hang of it with some time and work.

The Ghost team has created a well-defined folder structure for theme development. It is the easiest way to manage the theme development process. You can also use npm packages to enhance the development process and add more functionality to the theme. In my theme, I use tailwind CSS and the Gulp package to speed up the development process.

This guide will help technical writers get started contributing to open-source projects, and outline some of the common pitfalls you might encounter when starting to contribute.

It'll also highlight some of the benefits of contributing to open source, and provide some additional resources for getting started with contributing to open source as a technical writer.

What You Will Learn

This post will cover how technical writers can contribute to open source, what the benefits are, and some of the potential drawbacks. We'll also go over a few resources for getting started.

What is Open Source?

Open source is a collaborative way of developing and distributing software. People all over the world contribute to open-source projects by adding features, fixing bugs, answering questions, translating text, or writing tutorials.

Why Contribute?

Contributing to open-source software is one of the best ways for technical writers and other knowledge workers to give back and make a difference.

You can help improve the software you use every day, or you can learn from the example of others who have contributed before you. Plus, it's a great way to meet people with common interests. And when your contributions are appreciated, you'll feel like part of the community.

You might be wondering – when should you contribute? Well, if you're new to open source, contribute at your own pace—don't worry about trying to do too much too soon. You'll find what you're comfortable with.

Contributing to open-source will not only increase your skill set but also allow you to develop contacts within the community and even create opportunities for freelance work.

It takes some time to build up the knowledge and skills necessary to become an active contributor (especially because documentation often requires a different skill set than programming), but it’s worth the investment.

Challenges of Contributing

Technical writers can face several challenges when they start contributing to open-source projects. One of the most common is not being sure how best to contribute, especially if you don't know anything about the project yet.

You might also be unsure about where your work should go or what is expected from contributors. There are a couple of ways around this problem: you can read the project's README file and/or documentation to see if they have contribution guidelines. You can also get in touch with the team behind the project and ask for help.

How to Contribute to Open-Source Projects

First, you'll want to find a project on GitHub you want to contribute to. You can read this tutorial about how to search GitHub and find projects.

Next, you'll want to open the README and make sure you understand the given instructions.

Then, fork the repo by clicking on Fork located at the top right corner of your screen.

Clone the forked repo in your local computer using the following command:

git clone <LINK TO THE REPO>

You'll see the repo link when you click on the code dropdown.

Once you've cloned it, open up the directory containing your new fork and start adding your contribution.

When done push your changes on GitHub by using the following instructions:

git status //displays which modifications have been staged.
git add . // adds changes to the cloned repo
git commit -m "changes" //performs a commit to the cloned repo
git branch -M changes //creates a new branch
git push -u origin changes //pushes the changes

You will be prompted by GitHub to create a pull request after pushing your changes to the cloned repo. Go ahead and create the pull request and wait for the maintainers to merge your cloned repo to the main repo.

Make sure to incorporate upstream modifications into your local repository if you forked the project a while ago.

If you encounter a large file, install git-lfs if it is not already installed with the following command:brew install git-lfs

By downloading the appropriate versions of huge files slowly, the Git LFS (Large File Storage) extension, created by Atlassian, GitHub, and a few other open-source contributors, lessens the impact of large files in your repository

You can also use the following documentation to install git-lfs.

Best practices when contributing to open-source

1. Identify an area where you could be of assistance and find the relevant project on GitHub.
2. Read the documentation for any projects or programs that may be similar to the one you're interested in. This will give you a better understanding of what is involved in contributing and what other people have contributed.
3. Search for issues labeled good first issue and read through them – these are typically fairly easy to solve.
4. Get your code ready by following the contribution guidelines of the project.
5. Write up a pull request with your solution and explain why it solves the problem at hand. Include links to related resources like tutorials if necessary.
6. Submit your pull request for review. The team will discuss whether it should be accepted into the repository and update you about their decision.
7. If they decide not to accept your pull request ask them how you might go about addressing their concerns so that they'll reconsider acceptance at a later date.
8. If they do accept your pull request then thank them!
9. Continue searching for new problems to solve and share your progress along the way!

What Types of Contributions Can I Make?

You can contribute to these projects in many ways, including submitting pull requests for bug fixes or feature additions, writing documentation about how to use the software, improving the current documentation, translating the text into another language, and fixing typos.

You should get involved by picking a project you're interested in and reading through its documentation before diving right in.

Writing for an open-source project is a great way to establish yourself as an expert in your field and position yourself for future freelance opportunities.

One thing that technical writers should always keep in mind when writing for open-source projects is that their audience is primarily developers. This means that they need more technical details than what you would find in other types of writing.

Where Can I Find Open Source Projects?

There are a variety of places you can find open-source projects. GitHub is the most popular place for open-source projects, but there are also repositories on BitBucket, Gitlab and other sites.

If you have an idea for an open-source project that doesn't exist yet, start by putting together your plan in a README file. If you're not sure how to get started with contributing to an existing project, check out its documentation or read through some pull requests before submitting one of your own.

Sample Projects

• The HTML5 Boilerplate project is a popular open-source project for web developers that provides HTML, CSS, and Javascript code for building a website or web application.
• The Bootstrap framework, also an open-source project, is a collection of tools to help developers quickly create responsive websites.
• Jekyll is a static site generator written in Ruby, designed for personal blogs.
• React.js documentation - React.js documentation provides official information on how to use react.js
• GitHub pages - They contain everything you need to know about GitHub.
• Galaxy project (training material) -A collection of training materials about the Galaxy project which is a web-based open platform for data-intensive computational research that extends beyond the biological sciences.
• CNCF (Cloud Native Computing Foundation) -CNCF is open-source cloud-native computing that hosts projects such as Kubernetes and Prometheus to make cloud-native ubiquitous and sustainable.

You can also check out Google Season of Docs which provides assistance to open-source projects in improving their documentation and allows skilled technical writers to acquire experience in open-source.

There are many different ways you can contribute, which means there is something out there for everyone.

Conclusion

Contributing to open source is a great way for technical writers and other content creators to share their knowledge with the world.

There are many different ways you can contribute, which means there is something out there for everyone.

After you write your first couple of articles, a problem most technical writers face is: "So, what do I write about next?"

It can be a frustrating question, so I wrote this article to help. In it, I will give you tips that will save you the headache the next time you need to pick a topic for an article.

Here's an overview of what this article will cover:

• Brainstorming
• Decide why you want to write
• Follow your interests
• Everything has already been written about
• Don't rehash the docs

Intended Audience

This article is intended for technical writers who write about programming topics and are trying to figure out what to write about next.

The article doesn't include any advice about actually writing articles – just what to write about.

Brainstorm Ideas

One of the best ways to generate ideas of any kind is brainstorming. The more ideas you can come up with, the great your chances are of finding a good one.

You can brainstorm in a bunch of different ways, including as a group, but here's the approach to it that works best for me:

1. Get a pen and paper.
2. Write down every topic idea that comes to your mind, even if you think it's a bad idea.
3. Keep going until you can't think of anything else.
4. If you've found an idea you're happy with, stop.
5. If you haven't, look for some more input. You can ask people for suggestions, check out things other people have written, or do some research on the ideas you already have.
6. Take a break of some kind. Sleep for a while, go for a walk, or work on something else for at least 30 minutes.
7. Get a new piece of paper, and write your ideas on it until you can't think of anything else.
8. Repeat until you have ideas you're happy with.

Decide Why You Want to Write

It may sound like an obvious tip, but it's worth checking in with yourself: do you know exactly what you want to gain by writing your article?

There is an endless list of topics to write about, which is part of what makes it hard to decide on something. One of the best ways to narrow it down is to consider why exactly you're writing: what's your end goal?

Once you have that firmly in mind, what you should write about becomes much more apparent, at least in general terms.

For example:

• If you're writing to submit to a publication, you should focus on topics that go well with what they've already published.
• If you just want to practice your writing, the topic doesn't matter too much.
• If you're writing to learn something specific, you can stop reading. You've answered your question.
• If you're writing to show your competence, focus on what you know a lot about and feel confident writing about.

People write for more reasons than the above, but often, confirming your personal reason brings a lot of clarity.

Follow Your Interests

Your best writing usually comes from topics you're genuinely interested in for their own sake.

Here's advice from Chris Coyier from his article on advice for technical writing:

If you want to write for CSS-Tricks and you ask me what you should write about, I'm probably going to turn that question around on you. It's likely I don't know you well enough to pick the perfect topic for you.

More importantly, what I really want you to write about is something that is personal and important to you. Articles rooted in recent excitement about a particular idea or technology always come out better than dictated assignments. (Source: advice on technical writing)

If you're having difficulty deciding on a topic, try and start with the topics that interest you, even if you're not an expert.

Maybe you've always wanted to learn about web automation, CSS art, or game development. Do some research into your interests, and pick something to write from there.

Everything Has Already Been Written About

Even when you have a topic in mind, a common frustration is that it can sometimes feel like everyone has already written about the topic you want to write about.

And that's probably true. Unless you're writing about a very new or unpopular framework or language, the odds are good that someone has already covered the subject in some way.

That doesn't mean you can't still write about your topic of choice, but you have to get a little creative.

Here's Quincy Larson's advice on the subject (the relevant snippet stops at 5:20):

As you can see, even if other people have already written something about your topic, there's a good chance you can still write about it.

This is Chris Coyier's best advice on picking something to write about:

Personally, I apply this advice by googling my topic to see what people have already written about it. After that, I check if I can find anything missing from what I read:

• Does it go into enough detail?
• Was it explained clearly enough?
• Would it benefit from a more practical approach?
• Is the content out of date?
• Is there another way to apply this content?

Sometimes, you won't find anything missing, especially with very old or foundational topics. But often enough, you can find a way to contribute something of value to the existing writing.

Also, keep in mind that the way you explain things might resonate with someone in a way that nothing else out there does.

Don't Rehash the Docs

I know I just said you shouldn't rehash the docs, but it's actually okay in a few scenarios:

• You're writing mainly to help yourself learn the concept or practice writing
• The official documentation is glaringly deficient in detail or clarity
• Your writing offers a significantly different perspective or substantial improvement

On the other hand, if you're writing for other people to read, and the official docs are already reasonably good, it's probably a better idea to build a tutorial showcasing the concept or write about your experience using it than to simply explain it again.

Conclusion

I hope you had fun reading this and that you'll find choosing a topic to write about much easier from here on out.

This article didn't cover how to actually write once you've come up with a topic. If you'd like to read advice on turning your idea into an article, check out the following links:

• Advice for technical writing
• How to write technical blog posts people will actually read
• Technical Writing One

Good luck, and follow me on Twitter to see more of my writing.

And that is exactly what this article will show you how to do.

To follow along with this tutorial, it'll be helpful if you have a Word document you can work with. Here is the one I'll be using:

I have closed the application without saving the document. Now let's start the easy restoration process.

Step 1 – Create a blank document in Word

• Launch the application again.
• On the startup page, click on "Blank document".

Step 2 – Use the Open option

• Press Ctrl+O.
• Alternatively, you can click on the File option in your blank document's header and then click Open on the sidebar.

Step 3 – Click on "Recover Unsaved Documents"

• Click on the Recover Unsaved Documents which is usually at the bottom of the page.

If you do not see the Recover Unsaved Documents button, then follow these steps to see the options:

1. In your blank document, press Ctrl+O or click on File which is at the header section.
2. Click on Info which you will find in the sidebar.
3. Click on Manage Document.
4. Click on Recover Unsaved Document.

Step 4 – Choose unsaved documents

After you have clicked the Recover Unsaved Documents button, a new window should pop up with a list of unsaved documents. Go through the list and open your document and all your progress should still be intact.

Conclusion

In this article, we went over the steps required to recover an unsaved Word document. These steps can be used anytime you close Word without saving a document.

Don't forget to save this time!

In this post we're going to get all the headings from a freeCodeCamp blog post to make a Table of Contents (ToC) in Ghost CMS.

I recently published quite a large post here on freeCodeCamp and needed to add a table of contents to the post.

There's a really good supporting post written by Colby Fayock on how to do this. It details the process really clearly.

You can check out the video and really comprehensive guide on that for all the details:

Colby's post details why you would want a Table of Contents (ToC) and how to create one using the Ghost editor (the editor used for writing this post in the Ghost CMS).

The thing is, I had 33 headings in the post I needed to add links for. And the thought of scrolling through a 10,000 word document to get a heading then scroll to the top to add it to the table of contents made me wonder if there was a better way to do it!

Table of contents:

• JavaScript to the rescue!
• Get the element properties
• Get the element id and innerText
• Filter on the localName
• Conclusion

JavaScript to the rescue!

With this thought in mind I did a quick search and found a Stack Overflow answer that I could use. Here's the snippet:

var ids = document.querySelectorAll('[id]');

Array.prototype.forEach.call( ids, function( el, i ) {
  // "el" is your element
  console.log( el.id ); // log the ID
});

So, let's hop on over to the browser now and try that out.

I'll go over to that published post now in the browser and open the developer tools. (In Chrome and Edge it's F12 to open the dev tools.) Then I'll paste in that example code into the console and hit enter, here's the output:

Get the element properties

Not bad but I want the heading title as well, so one quick way to see the properties of the elements is to wrap the el in some curly braces:

let ids = document.querySelectorAll('[id]');

Array.prototype.forEach.call(ids, (el) => {
  console.log({el});
});

You'll notice I've cleaned up the function a bit, replacing the inline function with an arrow function and replaced var with let so the syntax is more modern.

Running that snippet in the browser now gives me the object for each element:

I can then expand out one of the elements now to get all the properties relating to it. From here I'm going to want to get the id (which I already know was there) and also the innerText which is the heading title:

Get the element id and innerText

Let's add the innerText element to the snippet we're working with and see what that looks like now. Here's the snippet:

let ids = document.querySelectorAll('[id]');

Array.prototype.forEach.call(ids, (el) => {
  console.log(el.id);
  console.log(el.innerText);
});

And here's the output we get from that:

Ok, so that is really noisy as it's showing the innerText of every element in the document with a lot of irrelevant information on there. All we're really interested in is the title of the heading and it's id.

Filter on the localName

All the headings I use in the post are h2 headings so I want a way to filter that. So from the {el} properties I'll need to grab the localName which denotes the type of the element h2 in the case here.

So let's use an if function to see if the localName includes h2 and if it does log that out. I'll also use a template literal to add the anchor id # to the beginning of the id:

let ids = document.querySelectorAll('[id]');

Array.prototype.forEach.call(ids, (el) => {
  if (el.localName.includes(`h2`)) {
    console.log(`#${el.id}`);
    console.log(el.innerText);
  }
});

Let's take a look at the output now:

Much nicer!

Now I can use that output to start making my ToC!

Conclusion

We took what could be quite an extended process and turned it into a handy snippet we can use in the browser console every time we need to create a ToC for our blog posts.

That's it, hope you found it useful! 🙏

If you like the content you can check out much more from me on my blog and you can follow me on Twitter.

But sometimes, the spell check feature in word processors stops working for various reasons, mostly to do with your Settings.

So, in this article, I will show you 4 ways you can fix the problem on a Windows 10 PC. The first 2 solutions work for the Word app in general, while the last 2 work for a particular Word document.

I will be using Microsoft Word 2016 in this tutorial, but everything applies to Word 2010, 2013, 2019, and some other versions.

How to Fix Spell Check Not Working in Word with Language Settings

If you are writing in English and your Word app language is set to French or Spanish, then spell check might not work.

The steps below takes you through how to select the right language:

Step 1: Click on File in the menu bar and select Options.

Step 2: Head over to the Language tab.

Step 3: Under “Office authoring language and proofing”, select your preferred language and click Ok.

If your preferred language is not available in the list, click on “Add a language” and look for your language.

How to Fix Spell Check Not Working in Word by Turning off Disabling Add-ins

Firstly, you need to test if an add-in is preventing spell-check from working.

To do this, hold CTRL and open your Word app. If spell check isn't working, then an add-in might be the culprit.

To disable an add-in, follow the steps below:

Step 1: Click on the File tab in the menu bar and select Options.

Step 2: Select add-in on the left.

Step 3: Left-click on the add-in you want to remove and click “Go”.

Step 4: Check the add-in, then click “Remove”.

Do this for the individual add-ins you have and cross-check if spell check is working after each one. This way you'll know which add-in is the culprit.

How to Fix Spell Check Not Working in Word by Turning off the Hide Spelling Error and Hide Grammar Error

Step 1: Make sure you have the Word document open where spell check is not working.

Step 2: Click on the File tab and select Options.

Step 4: Select Proofing.

Step 5: Uncheck both “Hide spelling error in this document only” and “Hide grammar error in this document only”, then select “Ok”.

How to Fix Spell Check Not Working in Word by Turning on Check Spelling as you Type

Step 1: Make sure the file is opened.

Step 2: Click on the File tab in the menu bar and select Options.

Step 3: Select Proofing.

Step 4: Make sure “Check "spelling as you type" is checked under “When Correcting Spelling and Grammar in Word”, then click Ok.

Final Thoughts

Spell check is a cool feature of Word that speeds up your productivity. And now you know how to fix it if it fails.

You can also apply these fixes to other Windows OS versions as Word works the same way in them.

It's tricky to make a good-looking and functional table of contents in Microsoft Word.

You might often encounter documents that have messy tables of contents along with navigation panes with links to missing headings, non harmonized styles, and badly structured sections.

This wouldn't be a big problem for smaller documents, but with hundreds of pages in a file it ruins the user experience and makes it painful to navigate from one section to another. Not to mention that non-harmonized styles throughout the file can mess with the overall hierarchy of titles.

So how can you build a customizable and structured table of contents with pretty personalized titles and numbering? You'll learn how in this guide.

How to Build a Table of Contents in Microsoft Word

How to Define Numbering Styles in Word

What we're going to do first is define a new list style to create a personalized numbering for our titles. Go to the Home tab > Paragraph section and click the multilevel list button. Choose Define New List Style.

This will open the Define New List Style window which we will use to customize the numbering style and format of our titles.

Name your style however you want (here MyNewListStyle), then click the Format button > Numbering... This will open the Modify Multilevel list window.

We will only define the numbering ("1)","a)") and no format or style will be applied at this level. We'll define and apply font styles and formats later on.

Let's take the following numbering for our titles "1.","1.1","1.1.1","2.","2.1","2.2" and so on.

First replace the parenthesis character with a dot character in the Enter formatting for number field. This will change the level 1 numbering format to "1.".

Then we'll define the second level of numbering by clicking the number 2 in the Click level to modify list.

Change the Number style for this level by clicking the associated dropdown menu then select 1,2,3, ... You should get this result:

Erase the parenthesis character in the Enter formatting for number field and place a dot before the "1". You should have ".1".

Now how do I get the numbering style 1.1 at level 2? Pretty simple! Place your mouse before the ".1" in the Enter formatting for number field. Then open the Include level number from dropdown menu and select Level 1.

This will insert the numbering for level 1 before your numbering for level 2. You should get this result:

Inserting numbers manually in this field will give you static numbers which won't be linked to any dynamic numbering in your document. These numbers won't be highlighted in grey in the Enter formatting for number field.

Let's repeat the same steps for level 3. Select level 3 in the Click level to modify list. Select the right Number style for this level in the dropdown menu. Remove unwanted characters and add a dot before the "1".

Then place your mouse before the ".1" in the Enter formatting for number field and open the Include level number from dropdown menu and select level 2. Add a dot before the level 2 "1" in the Enter formatting for number field. Then open Include level number from and select level 1. You should get this result:

You can modify the space character following the number by clicking More >> then Follow number with and select what you want. Here I am going to use Tab character for all my levels.

Click the OK button and you're all set for the numbering part! You won't have to do these steps again as the styles you define can be available from one Word document to another. We'll talk more about that later.

Your list style should be available by clicking the Multilevel list button in the Paragraph section of the Home tab.

We will now define our title styles.

How to Define Title Styles in Word

In the Home tab and under the Style section, click the down arrow next to the different styles available.

Then click Create a Style.

Give your new style a name. It's good practice to include the level number where you're going to apply this title so it's easier to follow your title hierarchy. I am going to name mine NewStyle1 for level 1. Then click Modify.

If you've clicked OK too fast don't worry – you can find your style and modify at anytime in the style section. You can edit it by right clicking on it and clicking Modify...

We are going to apply formatting to our title style.

Start by opening the Style based on dropdown menu and select Heading 1 for level 1. This is an important step for Word to understand the title hierarchy level. You'll apply this step to each level (Heading 2 for your level 2 style, Heading 3 for your level 3 style...).

Then open the Style for following paragraph and select Normal. This will prevent any formatting from applying automatically to the following lines of text you type.

Open the Format menu and open the Numbering... menu. Make sure that None is selected then click OK. This will prevent any conflict between the numbering we defined earlier.

You can then select any font formatting that you want. This is what I picked:

Let's create a style for level 2 and 3 by following the same steps. Be sure to have the numbering set to None each time. This is what I have for level 2:

And level 3:

We are now going to link our title styles with our numbering style.

Go to the Home tab, Paragraph section, Mutlilevel list. Then right click on the Numbering list style we created in the first part and click Modify.

Open the Numbering window by clicking Format. Select the level 1 and in the Link level to style dropdown menu select the level 1 style you created for your level 1 title. You should get this:

Repeat these steps for level 2 and 3.

Then click OK.

How to Apply Your New Title Styles

Now let's try to apply our new title styles. Type in Title 1 in your document without any formatting applied.

If you already have a format applied you can remove it by clicking in the paragraph and applying the Normal style in the Styles section. This is useful to remove any unwanted formatting or styles you may find.

Now click in the Title 1 text and click on your newly created style for level 1. This will apply your level 1 style to the whole paragraph.

If you go to the View tab you can check the Navigation pane and see that "1. Title 1" just appeared as a selectable heading on the left Navigation panel, allowing you to go to it quickly.

Let's try our other titles styles as well. Type in the text without formatting, place your mouse in the relevant paragraph, and then click on your newly created styles to apply them. You should get something like this:

As you can see on the left panel, all my titles are appearing in a structured way with harmonized numbering. You can collapse are expand these to navigate faster. There is also a search engine available on top of this panel.

You can now insert a structured table of contents by going to the References tab > Table of Contents > Automatic table 1. You should now have something like this:

You can customize this table of contents to only display titles down to a certain level by clicking Table of Contents > Custom table of Contents > decrease the Show levels number > OK.

How to Preserve Your Styles in Word

At the moment, these title styles are only available in this Word file. We are going to make them available every time we open Word as well as make them transferable to other people.

Open the Developer tab in Word. If you can't see it displayed click File > Options > Customize Ribbon > Check Developer in the right panel > OK.

Once you're in the Developer tab go to Document Template > Organizer.

In the left panel (in Document1 for me) you can see the styles available in this file. In the right panel are the styles available in the Normal.dotm which allows you to store styles that will be available every time you open Word.

Let's select all our newly created styles then click Copy->. You should get something like this:

Now if you open another file your styles will be directly available in the styles section. This can be useful if you want to transfer styles among your group and harmonize the structure and format of your files.

That's it!

Voilà! You are now able to build a structured Word document with customizable titles styles and a reliable navigation panel.

These extra pages could be caused by tables, hitting the ENTER key too many times, unnecessary section breaks, unintentional page breaks, extra paragraph markers, and more.

You don’t want your Word document to look unprofessional because of this quirk, so in this article I'll show you how to delete blank and extra pages in Word.

I will be using Microsoft Office 2016 in this tutorial, but you can follow along with any version, as pretty much the same thing applies to all versions.

How to Delete a Blank Page in the Middle of a Word Document

If you are working with a large word document and you are about to present it or print it, it’s a good idea to check for blank pages and an extra final page.

To do this, press CTRL + SHIFT + 8, or go to the Home tab and click the paragraph icon.

This key combination displays paragraph markers (¶) at the end of every paragraph and each blank line – basically, whenever you hit the ENTER key, and at the beginning of the extra blank page.

To remove these extra pages, highlight the paragraph markers with your mouse or trackpad and hit the DELETE button. If one of the markers remains there, remove it with the BACKSPACE key.

If you have the patience, you can also remove the blank page(s) by going to the blank pages and hitting the BACKSPACE key until the paragraph markers disappear.

How to Delete an Extra Blank Page in a Word Document

Step 1: To delete an extra blank page that might get added at the end of your document, click the View tab:

Step 2: Go to the Navigation Pane. This will display a sidebar containing 3 tabs – Headings, Pages, and Results. Click on Pages to display all the pages of the document in the sidebar.

Step 3: The active page will be automatically selected. Click the extra blank page to select it and hit the DELETE button on your keyboard to remove it.

You can also remove this extra blank page by simply pressing the BACKSPACE key.

Conclusion

In this article, you learned how to remove blank pages in Word, so you can make your documents appear more professional.

Thank you for reading. If you find this article helpful, please share it with your friends and family.

I am a software developer and I've written 1,500 posts on my blog over the past few years. Millions of people have read my writing. And my blog is now one of the top 20,000 websites on earth (according to Amazon's Alexa website ranking tool).

In this book, we will not focus on the "how to install WordPress" aspect of blogging. We will also not discuss how to build your own blogging software. (That's a fun exercise, but not as important as what I'd like to discuss.)

This book will instead focus on developing the right mindset. It will also show you how to get systems in place so that you can run your blog over a long period of time.

The hard part of blogging is doing it sustainably. How do you blog in such a way that you can publish consistently? How do you become a household name in your field? How do you hold your audience's attention over time?

A lot of bloggers struggle with these challenges. There are so many blogs out there with 1 or 2 posts. Or the last post is from 2018 saying "Sorry I haven't published for a long time." With planning and execution, you can prevent this from happening to your blog.

Also, you may be wondering how relevant blogging is in the 2020s. After all, YouTube, TikTok, and Instagram get a lot of headlines in the news. Well I'm here to tell you that blogs are still powerful when it comes to content marketing and getting organic traffic from Google.

The main goal of the book (and yes, you can read the book in its entirety here) is to help you get started with blogging in the right way. So grab a beverage and a comfortable chair. And bookmark this page so you can come back and review, in case you can't finish it in one sitting.

And if you prefer, you can download a PDF and ePub version of this How to Start a Blog book here.

Table of Contents

1. Framing your blog for success
2. The benefits of having a successful blog
3. Pick a goal for your blog
4. Own your platform
5. Make the first step
6. Solutions to common problems
7. Content is king
8. Practical content suggestions
9. Create a system
10. How to get people to your blog
11. Expand your reach with an email list
12. Ups and downs
13. Making money with a blog
14. Final words

Framing your blog for success

People communicate and share information over the internet. We use it to look for help. Maybe we try to find the perfect recipe for dinner or the best book we should read this month.

A blog is a tiny website, made by one or a handful of people, with the goal of creating information that will help people.

On this blog, you will write posts. A post is a single page of the website containing some information.

The concept of a blog I'll talk about in this book is different from a diary, where you write about everyday things as they happen. That is something you can definitely do, but it's not what I'll be talking about here.

By blog, I mean a personal site, or a product/company site, where you regularly produce interesting content that can be beneficial to other people.

You want people to be able to find the solution to their problem on your blog.

I want to highlight this point because it's central. Your blog should be useful to other people. Without this fundamental concept, your blog has no reason to exist.

Why a blog does matter

Blogs are the fundamental building block of today's internet. Think about it: we have giant corporations that create walled gardens that people are constantly drawn to, like Facebook, YouTube, Instagram, and Twitter.

Those are places that are engineered get you addicted so that you consume, debate, consume, debate, consume. And if you are in the lucky 1‰, you will be one of the stars of those walled gardens, and you will profit from other people consuming, debating, consuming, debating, consuming.

What are those people consuming? Well, aside from the content, they're consuming their time.

With notable exceptions, much of the content created and shared on the internet isn't useful.

But a blog is one of those rare places on the Internet where you can create something of value without a giant corporation benefitting from your work. You are the owner of your little corner of the world.

I'll soon tell you more about the "own your platform" concept, but here's the gist: a blog matters because it's 100% yours.

Is blogging still relevant?

This is a legit question. Is blogging still relevant in today's world, dominated by social media and big platforms?

Can the underdog still find some space on the Internet? Don't we have too many sites already?

First, we'll never have too many sites. There's less than 1 person creating content for every 100 people. This is a rule for all media consumption: there are ~100 TV or radio stations in a country with 100 million people. Same for newspapers.

The same goes for the Internet. If you start creating, and you do your job well, eventually your content will surface and you will have success. Whatever success means to you.

This is possible with videos on YouTube, podcasts, and blogs, of course.

So why should you start a blog instead of making videos? It's a choice. We can't all be good at making videos, and we can't all have a voice made for podcasts. Similarly, we can't all be good at writing.

But if you happen to enjoy writing and you like the idea of having your own little corner on the Internet, then creating a blog might be what you are looking for.

Should I have a personal blog or a company/product blog?

If you are a freelancer, working solo, or you are a solopreneur, a company of one, you might have a tough decision ahead: should you create a personal blog or a company blog?

There's a big distinction in this. In my opinion, a personal blog is way better because companies and projects come and go. You might sell your company in 3 years.

Your personal brand, however, will stick with you wherever you go. The advantage I find in a personal brand is that you have the ability to experiment and pivot, if necessary.

If you create a brand that's too tied to a product or area, you can't switch without changing the name and domain, so it can be very confusing to people and it's very hard to make it work nicely.

And most likely you'll have a hard time finding a good idea, at first, so it’s always good to have more than one option. That way you don't have to start from zero.

Why a blog and not videos or podcasts?

In the last few years, videos and podcasts have grown tremendously.

Videos, in particular, are very popular. Kids want to become YouTubers when they grow up.

Both videos and podcasts are awesome. I watch YouTube every day and I am subscribed to several podcasts, too.

There's one thing I noticed about those platforms, however. Podcasts are very hard to discover. I only discover new podcasts if I see one mentioned somewhere. Or by word of mouth.

And in addition to having great content, as a podcast owner, a person's voice tone is a differentiating factor that makes me like a podcast or not. You are either born with a great podcasting voice, or you're not.

With videos, it's the same thing. A creator's personality is a unique differentiating factor in a great YouTube channel.

Plus, videos, if made well, require a huge effort in time, energy and equipment you need.

A blog, on the other hand, is something you can make no matter who you are, as long as you can write. You don't need to have that uniqueness that makes you liked on YouTube, and you are not trapped on one platform (YouTube). You also have a great channel for organic discovery of your blog posts (Google). More on this later.

But you don't have to choose one over the other, of course.

Many times creators use a blog alongside a YouTube channel, or a podcast. This is helpful if you use it more than just to cross-post content from one channel to another, but as a complementary tool.

When done well, it's a powerful combination.

Define who your blog's readers are

A blog that's successful and useful to other people is a blog that has a readership in mind.

I'm sure you've stumbled upon those blogs or sites that talk about a little bit of everything.

It all seems very random, and you don't find a reason for coming back to that site, so you forget about it.

If you happen to visit a website that talks just about your favorite topic, you might save it for later in your bookmarks, or leave the tab open to go back to it later.

This happens because the owner of the site is not just writing about everything that comes to mind: they have a specific kind of person they are talking to.

And this is what you should do, as well. Carefully define the kind of person you want to talk to with your blog.

You have to pick a niche.

How to Pick a Blogging Niche

Picking a niche is how you can define what your little corner of the internet will be all about.

It can be all about you, your hobbies, passions, and stories. But then not many people will find it very useful. Maybe one post can solve their problems, but will they ever come back? Probably not.

Because your blog's not about you, it's about your readers.

Pick a niche. A small subject.

Say you're a programmer. You can write a blog about the C++ programming language, write 2 posts a week, and never run out of topics for 20 years. It's probably even a niche that's too broad, not much of a niche.

A better niche would be C++ programming for embedded devices. Or using C++ to build games.

Then filter out this group of people a little bit more. Using C++ to build a 2D game engine.

You can write about that for years, too, but this time if a person is interested in this subject, they will bookmark the site and download everything they can because you are the expert (or at least more of an expert than they are) and they can get a lot of value from you.

Blogging is a a marathon, not a sprint

I want to give you another concept that will frame your blog for success: it’s not a sprint, it's a marathon.

As with everything in life, creating a successful blog takes time.

Creating a blog, per se, is a matter of hours if not minutes. This is why everyone can start a blog.

But creating a successful blog, depending on what you consider "success", can take years, and not many people welcome this fact with joy.

People like immediate, fast success. It almost never happens, unless you are very lucky.

Consider blogging to be your marathon.

The benefits of having a successful blog

We all have limited time to dedicate to our hobbies, families, and friends. So why should you set aside a number of hours every week to work on your blog? And it's not just a few hours here and there. If you want the blog to be successful, you have to dedicate a lot of time.

As with everything in life, you have to evaluate the pros and cons.

Let's analyze the benefits.

Personal satisfaction and gratification

First, blogging gives you personal satisfaction and gratification.

Many people like to build puzzles or to do crosswords during their free time. Or they like to tinker with woodworking or electronic gadgets.

Writing on your blog can give you the same feeling.

Plus, it gives you a sense of accomplishment.

Writing a blog post can be easy sometimes.

Other times it's really hard, maybe because of the subject, or maybe because you can't find your way through your writing.

But when you finally finish it, it's a really good feeling.

You can get your name out

Another thing that a blog can give you is discoverability.

When people search your name on Google, if you write under your own name people will find your blog as the first result. This gives a great impression at a job interview, for example.

And even if you are currently employed, having a blog is like an extension of your personal brand that can help you be perceived as a more knowledgeable person.

It's like writing a book. A book that no one reads is one thing – but writing a successful book that is read by many people is a completely different thing.

Blogs follow the same rule. Some blogs are not very popular, maybe due to the subject or other factors (we'll see more about this later). But some blogs are successful, and others are wildly successful.

You can get in touch with more people

By writing on your blog, you can publish things that are read by people all around the world, and your work can possibly help them achieve what they want.

Not only this is great for personal satisfaction and fulfillment. It's also a great way to be perceived as an expert in your field.

And the more people you can reach and impact, the better it is for you (and them!).

A blog is your platform

Your platform, your launchpad. In today's world, there's just too much noise.

We are bombarded with information from every medium, and it's really hard, as a creator, to stand out.

A blog can be a great starting point for your next project, your next adventure, your next (or first) company. It's yours.

The goal of any product is to be used by people.

Lots of people, possibly. Not everything can "change the world" Silicon Valley-style, but your little project, product, or service can have a big impact on a tiny slice of the people it targets.

But the first steps are always hard, including finding a good idea.

Your blog can be the way you find the initial users for something that you find worth creating.

Put the idea out there. See how people react to it.

You can become an active part of the community

In every community, there is a small number of people that lead, a slightly bigger number of people that contribute, and a larger number of people following.

Think about the community you are in. The 1%, or 0.1%, work on the "core". They organize an event, build a software project, host a podcast, work on a product. Another 9% will participate and be an active part of the community around it. 90% of the people will just consume.

As a blogger, even if you're not in the 1% that lead, because you don't want that responsibility or power or you can't make the commitment, you can still contribute. You can add your input, and be heard in a world that is eager for people that want to stand out.

Write about that thing you are so enthusiastic about. Create a helpful resource. People will be really grateful for that. Including the 1% or 0.1% that lead but that do not have time, resources, or will to create those resources.

A notable example is Jeffrey Way. He created Laracasts to build training screencasts for Laravel, a programming framework that was gaining traction.

He’s now an integral part of the framework ecosystem and a driving force for its popularity.

Pick a goal for your blog

You can start a blog for multiple reasons. No one has the same ambitions, the same drive, or the same starting point.

You want to get a job

One goal for a blog might be to help to get your first job.

Suppose you are getting ready for your first rounds of interviews as a Junior Frontend Developer. As you are learning the technology and experimenting, maybe following an online course, you document everything you are learning.

I think this is great for 3 reasons:

1. you reinforce your learning
2. you build up an online presence
3. you get better at documenting and explaining technology

As you approach the interview and send out applications, companies will see that you have a website. They'll find that you are great at explaining technology, you know how to communicate, and you definitely know your stuff.

And this is a great advantage over any other job applicant that does not have a website.

You want to get a raise or a better job

If you already have a job, you might want to step up your career and get better pay, or switch to another niche in the field you are interested in.

Having a blog that positions you as an expert in the thing you want to work on is definitely a big plus.

You can leverage your blog at your current company to reposition yourself as a senior developer.

Your colleagues will look up to you and your writing and will perceive you as an authority in the field.

You want to get better/more clients

If you are not interested in getting a job and prefer being the independent freelancer with a queue of prospect clients lined up, blogging can be a game-changer for you.

I experienced this first-hand when I started my career in tech.

I started my career by finding work on freelancing sites. It was hard to compete with freelancers all around the world who were much more experienced than I was in many cases. And sometimes they were located in a lower cost of living area, which allowed them to provide the same service at a fraction of my rates.

I started a blog about the subject I was specializing on, an open-source CMS, written in Italian, my own language, and people from Italy slowly started to perceive me as an expert. They were more than willing to pay a premium to work with a person that spoke their language, worked in their timezone, and was one of the few experts in the field in the country.

My blog was key to this because people searched for topics they knew they needed help with – and they found me.

At some point, I was even able to turn down client proposals because I had too many requests. I could choose the ones that I believed were better for my business and more interesting to me.

You want to demonstrate your expertise

A common benefit to either getting a job or freelancing clients is this: a blog helps you demonstrate your expertise and expose what you know to other people.

Some people are more naturally inclined to show off their abilities.

Sometimes, depending on culture and perception, we can even think of them as more capable than what they really are.

Some other people are less inclined, perhaps because of introversion or shyness.

Blogging is a great way to demonstrate your expertise even if you're not naturally inclined to raise your hand in public. This is because it's a medium that has very low friction compared to, for example, creating videos that show your face on YouTube.

You want to document your learning

A great goal for your blog could be to document your learning. Perhaps being more competitive in the job market is not something you are interested in right now, or you just want to write about your hobby.

A blog is a great track record for everything you learn.

I have a terrible memory, for example, and sometimes I just create a blog post to remember how I made something work.

I used to write notes on an app on my computer, but now I default to blog posts because I realized I can help other people by publishing my notes on the Internet.

You want to structure your thoughts and learn more

The way I used to learn best back in school was by creating very detailed notes about a subject.

However I only made them for subjects I was interested in, which in retrospect explains why I was good in some classes and bad in others.

You can use your blog as a way to learn better.

I am a huge proponent of learning through blogging because it works.

I use blogging as a way to learn a subject and at the same time help other people.

When I write a new blog post I am forced to create a mind map of the subject and I try to frame it, before writing about it.

In this way I learn much more than I do when I read a book or watch a course without taking organized notes about it. And as a side benefit, I end up with a new blog post I can publish.

You want to become better at explaining things

A great benefit of blogging is that over time you'll become better at explaining things.

You will take fewer things for granted, and you'll think more from the point of view of the person who is listening to you, rather than just writing a bunch of words to be perceived as an expert.

This will help you tremendously in your career and as a person.

You want to grow your audience

A great benefit of having your own blog is that over time you'll start to build an audience.

As with many things, the more time you dedicate to it, the more your audience will likely grow.

People might get to know you. Recognize your name. You will not become famous (except in rare cases), but this might not be what you want, either.

That's not what an audience is for. And honestly, I see many developers raise an eyebrow when marketing subjects come into play.

An audience is a great place to test your ideas. An audience can help you figure out something. An audience is your group of people, the people that trust you and that can help you move to the next level.

You want to express yourself

A blog does not need to be a means to an end.

My favorite blogs are the ones that are playgrounds for creativity and expression. Especially when applied to programming and computers in general.

A blog is a great way to have a track record of all your past creative projects.

Your own centralized creative hub.

Own your platform

Your blog is the operational center for your future. Your platform, your headquarters. Everything else should bring you to your site.

Your Facebook page, YouTube channel, Twitter, Medium, your guest posts on other blogs, and the content you stream – all are tools to connect people with the content of your site on the Internet.

The website can be made with any technology you want. It does not really matter, provided that it’s on a domain that you own, and that you can change as desired.

You should have complete freedom over it: you have to be able to contact your users whenever you want, you must be able to extract all the data from this platform. Also, whenever you want to, you should be able to move away to a different platform with all your content.

Lastly, you do not have to be at the mercy of other people decisions.

The platforms of other people

There are many ways to sell online. For each type of product, there are a number of options, and while sometimes you can sell things in the way you want, sometimes you need to work with a platform managed by someone else.

For example, if you sell digital books, you will, of course, sell them on Amazon Kindle, which probably represents 80% of the market.

Do you sell physical products? In addition to your own e-commerce, you will want to sell them on Amazon too, as it’s a huge market opportunity.

Do you make mobile apps? You will need to sell them on the App Store if you target Apple users, or on Google Play for Android.

Here, in some of these examples, it is clear that sometimes you have choices and sometimes you have to take a mandatory road to actually sell something.

You can’t distribute iPhone apps through your site. If you build desktop applications for Mac, on the other hand, this is possible, but you might also want to join the Mac App Store, which in this case is optional. Apple sets the rules, but it gives you some visibility that you would not get without being in the App Store.

All these great distribution systems such as the App Store, Amazon, Kindle, and many others like Etsy or Alibaba, are platforms. Other people’s platforms.

Benefits of using a platform managed by other people

There are, of course, benefits to using a platform managed by other people. It provides a virtually limitless user base, customers visiting the platform already have an account, and in many cases they just need to press the buy button.

In general, not managing your own platform saves you worry about having to manage a huge number of things.

Disadvantages of using a platform managed by other people

But there are disadvantages of using a platform, as well. You have to comply with the rules the owners impose, and the customers are not yours – they are the platform's customers. So you might struggle to create a relationship with your customers.

You also have little room for your branding, as everything could change from one day to the next. In some cases you have little control over your prices, and you'll have to pay commission to the platform for each sale you make.

The platform sets the rules

A platform is not just the place where people turn into customers, but it is also the place where you can find and interact with them. Facebook, Instagram, and Twitter are platforms, phenomenal platforms, but still platforms built by others.

A few years ago, having a Facebook page with 10,000 fans and writing a message on the page was enough to show this message to a vast percentage of those people. Unfortunately, this has changed today because the Facebook platform has changed. Now we are lucky if we reach 10% of our audience.

The only way to reach more people who like your page is to sponsor posts. So you have to pay Facebook to communicate with your own fans: this is an example of what it means to build on another property.

This is not to say that you should not have a Facebook page, that you don’t have to invest in Facebook Ads, or that you do not have to interact with people on Twitter.

You should do these things if you're trying to build an audience. The market imposes them on you, because you find people in these places. But always try to use these large containers to find people and bring them to you.

And it's important to always have a way out of a platform, and not to be completely dependent on it.

To do this, you have to push users to come to you through all the channels you can take advantage of.

You have to create your own platform.

Use your own domain name

Your domain name is very important. I use my own name for the domain: flaviocopes.com.

Your domain is like your address.

Except that a real-world address changes when you move somewhere else.

Your domain, on the other hand, is yours forever, regardless of your physical location. Like your email address.

When you publish things on your own website, under your own domain name, you are building virtual real estate and generating value that can last for years if not decades.

The way things work for search engines, now and for the foreseeable future, is that quality links pointing to your website make the domain more valuable.

If you publish under a domain name that's not yours, you are effectively working for other people, in exchange for something that might appear convenient for you, like a nice way to create the first page.

But if you take the time and put in some work beforehand to set up your own site and get your own domain, it can pay you a lot more in the future.

Make the first step

The first step is always the hardest. In anything you want to do. Running. Coding. Cooking. Blogging.

In this chapter, I want to make sure you are well equipped for your first step when you’re ready to dive into blogging.

Pick a domain name

There is one very important thing you need to do before you can create your blog. You need to choose a domain name.

You can notice 3 patterns for domain names. People have their own name/surname combination like I do with flaviocopes.com. Some people like to have a fantasy name or their nickname. Totally fine, too.

If it's cool and you can create a brand out of it, it's great. Like codinghorror.com. Other people like to have a more general brand, like css-tricks.com.

The good aspect of this is that people know the content of the blog just by looking at the domain. The downside is that you are kind of forced to stick to that topic forever.

For example, css-tricks.com has long stopped talking exclusively about CSS, and other topics like JavaScript, SVG and others are very often covered.

This is kind of controversial, but I think your own name, or brand name with no direct attachment to anything specific, is the best and most future-proof way to create a domain name.

With one caveat: if you use your own name, you'll never be able to sell the site to someone else, or transform it into something "more" than just yourself with some guest posts here and there. But there are notable exceptions as well, like raywenderlich.com.

If you create a specific domain name that reminds people of a technology or hobby in particular, on the plus side you'll be able to sell it when it's successful to a bigger brand.

I started posting on my blog frequently by talking about the Go programming language. I later switched to a completely different programming language, JavaScript.

But because I used my own name and domain, I did not have to change anything. If I had a domain name like startprogrammingingo.com or something similar, there's no way I could've just switched to talking about JavaScript, or Arduino.

The whole project would have sunk because the day I stopped my work on Go, the site would just end its life with that very specific domain.

Since I use my own name for the domain, whatever I want to write about 10 or 20 years from now will be perfectly fine.

If you already have a domain, maybe used in old projects, and you think it can work fine, that's even better.

Domain Authority

There's something called domain authority that is really important. Because that's how Google determines your site's value, and it's fundamental in how Google ranks web pages in its results.

One factor in domain authority is the domain's age. Older is more stable and more trustworthy to Google.

And when you're creating your domain, try to get the longest expiration date you can. That's a factor, too. Google basically detects your seriousness with the project. If your domain expires in 3 years and a competitor's in 3 days, maybe your domain is better in the long term.

I mean, we can't really know how the Google algorithms work, but we can try and make sure we tick all the checkboxes.

That can make the difference between a site that's never visited, and one that gets 10 visitors a day. Or one that gets a few hundred visits a day to one that gets tens of thousands.

Choose a blogging software (don't build it!)

I personally use Hugo to power my blog. It is built using Go, it is very fast, and has some limitations on the things you can do. This means I can avoid distractions and I can focus on the writing.

I see many people, especially developers, who start creating their own blogging software from scratch.

I think that this a bad idea.

Why?

Because the moment you start is the time that you have the most energy. There will not be another moment in the lifetime of your blog where you'll have the same enthusiasm and drive to work on it.

And if you channel this energy towards something so futile, in this case, like building the software, then when it's time to actually write the content you'll have very little time, very little energy, and very little drive to craft great content.

Plus, you'll have to work on bugs, handle updates, and more, on your own. It's much easier to let others work on maintaining popular software used by thousands of people rather than reinventing the wheel.

Choose a minimalistic stock design

The second mistake, I think, is to work on the design before working on the content.

Just as developers like to build their own software, design-oriented people want to create their own design. It's logical, I get it. But in this scenario, at the beginning, it's just a distraction.

My suggestion is: pick a stock theme, the simplest you can find.

The more minimal the theme is, the better.

Remember to keep the focus on the content. Not on the blog engine, not on the theme, not on plugins...on the content.

I have a couple blogs built using the default Ghost theme, which look very professional. In the niche they are built in no one knows what Ghost is – let alone do they know that it's the default theme.

Also, no one cares. Except you.

You can work on the design later on. There's always time for that.

Create the first 3 posts

Right after you have your blog idea, write the first 3 posts. You can write them in a normal plain text editor, and move them later to the blog platform you chose.

I like to use Bear (https://bear.app) to create my drafts. It autosaves, it is beautiful and intuitive to use. But it does not really matter. The thing I want you to focus on is those 3 posts.

Why exactly 3 posts?

Because now that you are so pumped to create your blog, it's the easiest time to write 3 great posts. If you create only one, maybe the second will be deferred until tomorrow, then to the day after.. and you'll be left with a blog with a single post.

Two posts... kinda the same. 3 posts seem like a good number to me.

Once you have those 3 posts, it's time to publish them. My advice, in this case, is not to publish them all together at the same time. Instead, you should schedule them.

Schedule the first 3 posts in advance

I've had several people ask me how can I be so consistent with my blogging. The best suggestion I have is to create a habit. Habits are a very hip and popular topic nowadays, with many books published on the subject.

I'm not an expert, but I noticed that once a habit is established, it's really hard to break it.

Use this little hack to force yourself to write blog posts. Once you decide your perfect schedule (twice a week, once a week, twice a month, once a month...) then schedule the 3 posts you wrote so that you make a little buffer.

Suppose you write once a week. Publish the first post immediately, the second next week, the third the following week.

Now, you can relax and have a little party because you can launch the blog. Plus, you already have content written for the next 2 weeks and you can start planning other posts.

All the other posts you will write will be queued after the posts you wrote in the beginning.

Don't be tempted to add a new post in the middle of your planned schedule: there will be times when you can't write due to limited time, or you will have a low energy week. The buffer will be helpful to keep a consistent publishing schedule.

One thing that is key here is this: once the schedule gets full enough and you can look back at a long streak of posts, all very consistent in their publishing date, and you will start to feel a little pressure to not break the streak.

Transform this little pressure into a positive push towards staying consistent. If you have a weekly publishing routine, at the end of the year you will have 52 blog posts written, which would be a major accomplishment.

Keep going this way

If you do the things I mentioned in this chapter and you just keep going, you will have 99% more success with your blog than anyone else.

Solutions to common problems

Who am I to write about this?

Let's say you are a student. By writing about the subject you are studying, you can reinforce your learning. Writing things down forces you to learn it really well.

Put your ego in chains: people don't care about you. People care about solving their problems. At least on their first point of contact with you, opinions, politics and controversial statements are detrimental to the user experience.

I don't know enough of the subject

You don't need to be an expert.

When I write a technical blog post, it does not really matter if I'm an expert at it. On the contrary, if I'm an expert in a field and I'm trying to write an introductory or beginner-friendly topic, I might not be able to explain that topic very well. This is because I cannot think like a beginner might when they don't know a topic, and so I might assume too many things and not explain that topic well.

If you're not an expert, do your best to absorb a topic and explain it to people that don't know about it. If you're an expert, on the other hand, writing content for other experts might be a good approach. Then you can mostly leave the entry-level content to people that might be in a position to explain it better.

Analysis paralysis

Just get it out there. Publishing a piece of content is much better than keeping it for months, revisiting it, thinking and thinking about it. Just do it.

It's ok to plan, but make sure you don't get trapped by analysis paralysis. The longer you think about it, the longer it will take you to start. Focus that energy on finding 3 good articles to write. That's the start.

Don't be afraid of failing

Resistance is telling yourself that you are not good enough, that you will fail. This happens because you're about to do some creative work, you are about to be exposed to the public, to the opinions of others, and others will think you are not good enough.

Resistance is a powerful force. Especially if you write opinions or personal facts in your blog.

I have two suggestions.

The first is to talk about a topic that cannot be judged. Pick facts. No one can rant that a fact is not correct. Explain something you learned recently.

The second suggestion is to read The War of Art by Steven Pressfield, which is a mandatory read, in my opinion, for everyone trying to do creative work. It really goes into the root causes of resistance, and why you feel it.

I am not good at writing

Are you sure? Or is this just an excuse to bail out of the work that will open so many doors for you, and get back to your room?

This might be resistance kicking in, giving you a nice excuse for not writing.

Are you good at making videos, or feel great at talking to a microphone? Then make videos or start a podcast instead, but don't try to avoid any work that makes you vulnerable to the other people, just because you fear it.

But if you are really not good at writing, your writing will get better in just one way: by writing more.

I don't know English very well

If you want to write for an international audience in the western world, then you should blog in English. I highly recommend doing so, but in some cases, it might make more sense to write in your native language.

For example, if the niche you chose is too crowded and there's no one talking about it in your native language, then it might be an interesting opportunity to position yourself as an expert

If you'd like to blog in English, don't take a lack of English knowledge as an excuse. First, if you are reading this book, then it means you can read English and if you can read it, you can write it.

Also, unless you explicitly write for native English speakers, most of your readers might not be native English speakers, either.

If you are afraid your English is not good enough, and never start practicing, it will never become good.

My suggestion is to just start, and have someone who's really good at English review your posts, so you can learn over time.

Don't give up too early

Most blogs fail. This is a harsh truth. Blogs are abandoned, people forget to renew the domain name, people move on.

Blogs get into this situation because people gave up. They gave up on writing content consistently and frequently, because they did not see immediate gratification from doing so.

If you want your blog to have the chance to become successful, you have to give it the time it needs, and you need to be prepared right from the start.

Don’t be overwhelmed

It's too easy to be overwhelmed by all the things you need to do. In addition to your day job and your family and friends, you need to find the time to blog.

But blogging is not just writing. You need to find the perfect image for that post, you need to share the post on social media, you need to reply to comments, think about future post topics, craft that perfect and eye-catching post title...the list never ends.

It's easy to feel overwhelmed.

That's why I take a minimalistic approach to blogging, which involves no pictures at all unless they're needed in the content of the post, and no comments.

Not having to manage comments frees up a lot of time and mental energy. It also has a nice side effect: I don't have to worry about what people think of my articles. I just focus on the writing.

One step at a time

Don't think you have to rush and do everything at once: open the blog, write 100 posts, create a Twitter account, a Facebook page, an Instagram account, make YouTube videos… it's just too much.

Start with the simplest thing you can do, create a habit, make that habit stick in your day to day and expand from there.

Content is king

Content matters. Content is the thing that matters the most, in the context of your blog.

Let's discuss some of the things I believe are fundamental pillars in a content-centered blog strategy.

Write to your people

Let's say you are great at cooking. Write about your craft: cooking tips, ingredients, recipes, talking to other people that love cooking. Do you love knitting? Write for other knitters about techniques and everything new that you learn about knitting. Love dogs? Create a blog for dog owners.

Anything you do, the important thing is that you identify a group of people that are as passionate as you about a subject, and you write for them.

There's no value in what you write if it's not valuable to other people. Sure, you can write about something that's only appreciated by you, perhaps. But then there's no purpose in spending so much time and effort creating blog posts, is there?

Focus on creating value

Once you identify the people you want to write to, it's key for you to focus on creating value.

Value can take many different forms, of course. It could be how-to posts. It could be sharing your specific experience with some technology. It could be teaching other people how your raw meat diet for your dog works.

It could be telling everyone about your recent trip and what you visited, in detail, so that when someone is searching for tips as they are organizing a vacation, they can find your useful information.

There is no fixed rule on what creates value.

Here's what I do to create value for the readers of my blog: I create easy-to-follow tutorials, written with a beginner's mindset. I do not take the perspective of an expert while writing them.

To do so, I learn a new thing, so I'm not an expert in it, and I create a practical guide.

I know it's very difficult as an expert to write for beginners about the thing we're expert in. This is because we've forgotten what it means to be a beginner and we make too many assumptions, forgetting to mention essential things that are key to understanding a topic.

Other times I describe how I fixed a problem that I just solved while working on some coding project. My memory is very fresh and I can remember what it's like to have the problem, so I can describe it very clearly.

Sometimes I create less practical posts where I talk about things that relate to my experience as a developer, or common struggles, or tips for productivity, for example. Those are the posts that are normally appreciated the most by my readers.

Focus on being useful and solving problems

Your posts must solve a problem: each post on your blog must have a very specific goal.

This is key, and the post title must perfectly address the problem and solution.

When people search for how to solve that problem, you want your post to be in the top results.

And your content must be awesome.

Exactly what they are looking for.

Focus on creating the absolute best, most valuable content.

Write the blog post that would have helped past you

One of my favorite things is writing a blog post that contains the solution to a problem I just solved.

Everyone else solves a problem and moves on.

If you dedicate 10 minutes to document how you solved the problem you had, you are helping other people that might have this problem next week, or next year, or 10 years from now.

They will be thankful that you wrote something that helped them.

And perhaps you can even help yourself in the future.

Sometimes I google for a problem and I find my own post, written many months ago. I completely forgot that I wrote it.

What not to write about

One thing I recommend that you not write about is anything that doesn't help other people.

It's difficult to draw a line in the sand, but you should think about what you are writing.

Don't think of a blog like a diary. You can use it like a diary, posting your rants or opinions or what you ate for dinner.

But is it really helping or creating any value for other people?

I personally only try to write about things that I assume will help anyone. Even if a post helps just one person, then it's a good post for the blog.

Teach everything you know

I learned this mantra, or motto, from Nathan Barry. He's famous for his book Authority and for being the founder of ConvertKit, a great tool for bloggers that have the need to build a newsletter.

He has this notion that building an audience is the secret hack to creating a successful business, and I really believe that. And to build an audience, the best way is to share, in one way or another, everything you know.

He did that in the form of books, first with two books about design, as that was his specialty. Then he wrote everything he learned about selling those books in another book.

I make my living teaching everything I know, and since there's a finite amount of things I do know at any finite point in time, I had to transition to teaching everything I learn.

I found that many people like the way I talk about stuff, with a very simple approach, and this beginner-oriented point of view has been beneficial to me.

Your approach can be different, but the “teach everything you know” mantra is one that you need to seriously think about.

Practical content suggestions

After discussing why content matters, and why you should focus on creating great content, it's time to talk about some practical suggestions.

Content length, how much is enough?

It does not matter how long your articles are.

The Internet is full of marketing blogs that tell you the content must be 2000+ words long, 10000+ words long, and so on.

But it does not matter as long as your content solves a problem for a person.

I have posts that solve the problem in 50 words, and if this is the solution to someone's needs, that's great!

There is no need to dilute the content with useless words, and I'm sure you immediately notice when a blog post is trying to transform a 5-line answer into a 200-line one.

The same thing happens with videos, right? You are looking for something, but you need to watch 15 minutes of intro to get to the meat of the subject.

Do the opposite. Do what's great for your readers.

Plus, Google does not care.

Keep posts focused

When I say that Google does not care about content length, it's because I've observed this first-hand.

Some of my most visited blog posts are very short, yet they take a problem and they solve it, quickly.

And Google notices it. The key is solving a problem. Google notices that you are helping it help its users, and that's what happens when you keep your posts focused on a specific topic.

Some topics will perform better than others, some might be less popular, but as long as it's focused on a little problem and it solves it, it's great.

Don't try to appeal to everyone

You can't write great content for everyone. Pick your ideal person, or group of people, and write for them.

Pick your crowd.

Pick your tribe.

Ignore everything else.

Don't aim for perfection

Done is better than perfect.

This is my mantra. As long as what I do is technically correct and does not have errors, it's all fine.

You don't need to overthink it. Focus on being good enough. That's when the point of diminishing returns starts.

Most of the time, good enough is already better than 95% of what's out there.

Don't let chasing perfection limit your production volume.

It does not matter if someone already wrote about it

There are thousands of water brands. Thousands of brands of wine and beer. Thousands and thousands of hotels.

The more people write about a subject, the more interest there is around it, and the more people read about that subject.

If no one wrote about something, it might not mean you are a pioneer or “first", it might just mean no one cares about that topic.

You don't need to bring something new to the table

If you worry that you don't have a unique spin on something, or a revolutionary idea, you might be limiting yourself.

Often, a 1% or 5% improvement over something that's already out there is enough.

Google was not the first search engine. It just worked better.

Basecamp was not the first project management tool. It just worked better.

Focus on being better, not new.

You can blog about anything

I am a programmer and I blog about programming. If you’re a programmer too, you don’t just have to blog about programming.

There’s space for everything.

The topic does not matter, as long as you are passionate about it. There's no way you can force yourself to write about one subject for a long time without burning out.

Anywhere there’s a problem, you can bring solutions.

For me the niche was programming, for you it might be something else. Also, programming is even a bad niche as most developers consider even a little bit of marketing to be spam and mostly hate receiving emails (as they're using email every day and probably already receive a lot of it).

I think blogging, properly done, can be even more successful in less technical topics. It can work, as long as people search for those topics on the internet and have a place where you can find them like a big subreddit, a big Facebook group, or a popular online forum.

Create a system

I am an engineer and I believe in systems. Humans are weak. Systems are strong. Humans with a system are on a good track.

If only we could have a system for our blog, everything would be simpler.

Turns out that we can definitely have a system, and in this section, I'm going to explain the system I use.

It might not be the perfect system for you, and I won’t pretend it’s a system that works in 100% of the cases. But it's a starting point, and by tweaking it you can create your own perfect system.

A system makes you consistent.

Consistency is key

Why is consistency so important?

Because consistency is deeply entrenched in our lizard brains.

You are the one that makes one blog post every Tuesday. You're not the one that tries to write a blog post consistently each week. You're the one that just does.

It's not me, Flavio, saying so.

Let me share something from Robert Cialdini, author of the amazing book Influence:

Once we have made a choice [...] we will encounter personal and interpersonal pressures to behave consistently with that behavior.

Once you have a series of 5, 10, 20 weeks of posting, you automatically become the one that posts every week. Or twice a week, or whatever schedule you chose.

That's the key to the system: consistency.

Have you ever heard of Rand Fishkin's Whiteboard Friday? That was a great video series about SEO that came out every Friday. Do you know about FunFunFunction? MPJ releases one video every Monday. Every one of his fans knows and waits for his "good Monday morning" every week.

I’m sure you know YouTubers that post on a pre-determined day. Like Saturday or Tuesday.

Everyone can find the time to create a blog post every week. But not everyone is willing to put in the work to create something every week. Will you?

Schedule posts ahead of time

As we just discussed, the single best thing you can do with your blog is stay consistent.

But staying consistent is hard.

One of the easiest ways to become inconsistent is to miss a day because you were sick, or because you went to a party, or because you took a vacation.

When you miss a day, and you forgive yourself for this, you will miss other days.

That's what I would do. If I let one day slip by without a post, well… nothing bad happens and I have a track record of missing one post.

Before I realize it, I am sure I will miss other posts, too. Just because I was too lazy one day, I ruined the consistency of my blog and now it's impossible to get that perfect streak of posts back.

How do you prevent that? By scheduling posts ahead of time.

Before you start publishing your blog, before unveiling it to the world and announcing it everyone, write 3 posts as we discussed before, and start building up your queue.

Have a queue

When I first started my blog, I discovered the notion of creating a queue by accident.

I happened to work on another project of mine, one that didn't take off as I expected it to.

This project involved creating some long guides, about topics I cared about.

So when I decided to shut down the project, I thought that it was a shame to abandon those long guides to their unknown fate.

So I cut each chapter into several blog posts, and I got about 15-20 of them.

I could have published them all on that day, but I randomly decided to queue them up. One today, one tomorrow, and so on.

A couple of days after that, I had an idea for a new post. I was a blogger now, right? And I queued it after all those posts.

The queue has never dried up since then, over 700 days ago. Some days I reached the end of the queue and I had to fill it up again from zero, but I never missed a day.

I just attribute this result to the system – the queue I've built up, and the shame that would result from having written all those posts in the past and then stopping.

I could not stop.

Pick a schedule frequency you can sustain over the long run

One key part of this scheduling and queuing system is frequency.

How frequently should you post?

My recommendation is to post with a frequency you can maintain over time, consistently.

Start with one day per week. Create a queue, as I suggested, and see if you can maintain this frequency over 2-3 months. Once you start having a queue that's too long, say a blog post you write today will be published 3 months from now, then you can start increasing the frequency.

It's always best to scale up the frequency than to post less frequently because you can't sustain the frequency you initially set.

The reason I focus a lot on consistency and frequency is that people get used to it and they learn to expect a post from you, and they look for it.

If you start missing posts and not sharing information as frequently, then people don't know when to expect a new post from you, and they feel lost and disconnected.

This happens with everything. I notice it with videos.

If you watch YouTube videos frequently, what do you think when a YouTuber that posts every day, and you watch every day, suddenly stops posting for a week?

I subscribe to a YouTuber that posts every Saturday, and every Saturday, unless I am out doing something, I'm there, at noon, watching his video.

Ignore quantity

If you know beforehand that you have 3 hours a week to dedicate to blogging, don't force yourself to create too many posts.

Do one post a week, but do it well. Don't create many posts that are irrelevant or low quality, create one that you can be proud of.

Quality is perceived, and people will associate your worth with the quality of your work.

Be known for creating high quality and helpful content.

Focus on the process, not the outcome

One recommendation I have to be productive is to focus on the process.

I am focused on creating the blog post.

I am focused on creating ebooks.

I am not focused on how many people will read the blog post, or if they will like it.

That's not something I have control over. The best thing I can do is focus on my work and make sure it is the best work I can perform today.

Keep the process lean

When thinking about my process, I like to simplify it.

I want to remove all the friction I can remove.

It all needs to be simple, fast, streamlined.

I don't want roadblocks.

I try my best to remove all the resistance and all that powers resistance.

There should be nothing between me and writing a great blog post.

Keep a list of topics

I don't always have the time to write about something.

Sometimes I have an idea for a topic, and I write down the title of the article in my favorite writing application.

When it's time to write a new blog post, and I don't have an idea ready, I go through the list of titles and find one that is appealing to me in that specific moment.

Capitalize high energy days

Some days I have really high energy for writing blog posts. Some days I have very little, if any, energy.

On those days when I have the fire, I can write a few blog posts in a row and code the rest of the day (as that's my job). I have fuel for everything.

I capitalize on those days. I sit there and I might write 5 posts, and put them in the queue.

The days I have low energy I am thankful for those high energy days and I am thankful that I did everything I could to get the most out of them.

How to get people to your blog

Having a blog is great and all, but having a blog that people actually read is deeply satisfying.

There’s a problem though: how do you get people to read your blog?

How Blog Traffic Works

In today's world, if you are not producing valuable and consistent content, you are invisible. There are just too many things pushed at us every day.

I dedicate from 30 minutes to 1 hour every day to the Internet. That means Social Media, mostly Twitter, RSS and content aggregators.

I always see the same people. Those people that are highly successful keep pushing out great content.

It might be an inspiring tweet, a great blog post that's shared a lot, or something that's just worth reading.

Unless you perform at the same level, you are not appearing in my feed because I only give it limited time. And I assume the vast majority of people do the same. People don't just spend the whole day on social media waiting for you.

Share your work where the people are

Sharing your content is a great motivator especially when your blog is young and you don't have an audience yet (more on this later).

In this situation, you can't rely on organic traffic. To avoid losing motivation, it's key to get your first views by sharing your content.

You can do 2 things: share it with your own audience on social media, if you have an audience already, or use sites that provide an audience and try your luck.

Those sites include Reddit, Hacker News, Medium, and forums that specialize in the topic you are talking about. Word of caution: you might have your feelings hurt in some of those venues, so just be prepared for criticism.

Organic growth is the only reliable solution for long term traffic

You might have the proverbial lucky day, and your blog post goes viral in places like Reddit, Hacker News, or on Social Media.

But the key factor for your blog is organic traffic.

Organic traffic means Google will receive a search from a user and will decide that it should show them your blog post.

Organic traffic is a key factor to every website. Social media traffic is generally low quality, hard to get, and hard to maintain over time.

This is a long process. Google needs to trust you, and it can take some time.

My best suggestion to give Google a reason to show your blog posts is to consistently solve people’s problems.

Solve people’s problems

How do you get Google (and other search engines) to send loads of traffic to your website?

What matters to Google is that it satisfies its own users.

And those are people searching.

People search in order to solve their own problems.

I see SEO people who suggest that you write 3000+ posts to rank on Google.

That’s a great tip if their goal is to discourage you from writing more. They call it long-form content.

Now, as a non-SEO person, but as a person that does things and observes what works and what doesn’t, I can say that if you solve a problem for a person with a 4-line blog post, Google will thank you by sending you more people who have that problem.

They know using their algorithms when a person found the answer they needed. This is Google’s job. Their job is to solve people’s problems by providing the perfect content they are looking for.

If you can provide that, Google will help you.

Not every post on your blog can solve a problem, of course. But if you have posts that solve problems, you’ll start to notice, as those are the posts that will get the most visitors.

Not every post must be small of course, and if long-form content is best for you, do that.

The importance of links

When we were talking before about choosing a good domain name, I mentioned domain authority. I said that an old domain name will likely have more domain authority.

What is domain authority?

Domain authority is a sort of score that search engines use to set the importance of a website, and it's determined by many different factors. The specific algorithms and metrics used are not publicly available, but there's one thing which is key to domain authority: links.

The more links to it that a website has, the more authority it has. But it's not that simple. The more authority the domain has that the link comes from, the more important the link is.

Links have very different weights. A link coming from Wikipedia has more power than a link from a random tweet. And search engines do take social metrics into consideration, too. We can't know for sure, but a link in a tweet from an influencer in your field has more weight than a tweet from a Twitter bot account.

Google (I say Google because it's the most important search engine, but others might do a similar thing) is also careful about the topic. If I link to a kitchen recipe site from my computer programming blog, that link is not going to have much value.

If a famous kitchen recipe blog links to a smaller kitchen recipe blog, then that's more relevant for Google, and it will give that link more meaning.

When it comes to links, it's important to get links from relevant and on-topic websites.

This is only something you can get by providing great and useful content.

Expand your reach with an email list

Let’s discuss how to augment the experience you create for your blog visitors by using an email list.

What is an email list?

Blogs are closely linked to newsletters and email lists. The two often go hand in hand.

A newsletter is the most effective way you can get in touch with your blog readers over time.

If you are not already familiar with the email list concept, you may be wondering whether in the era of Facebook, Instagram, Snapchat, and Twitter if you still need to use an old-style system like email.

In fact, email is a fundamental tool for any online business. Blogs are no exception.

Sending emails to a list of customers is not a system by which people commonly spam, as you might be thinking.

Especially if you're a developer, you need to realize that email is useful, you are not evil for sending emails, and that people want to hear from you.

Email is a cool system where people interested in your content or products can have more information about them, or about new products that you could provide in the future.

Email marketing is one of the most effective systems with which people are converted over time from visitors to customers: people in your list have explicitly asked to receive more information from you in the future.

This does not mean sending an email after 8 months asking them to buy your new product. Instead, the right way to approach this is to ask yourself how you can help your customers, in a consistent way.

Through the list, over time you can build customer loyalty, you create a relationship, and you keep in touch.

Your task with the list is to train people on the subject you are talking about, and to foster anticipation about upcoming news. But try to keep the focus on the customer rather than on you. Remember that a person will not be on your list forever – just as long as you can keep interest high.

So how do you get a person to join your email list in the first place?

With a small gift, called the lead magnet, which can be for example a report, a free ebook, exclusive access to premium content, an email course, or really any gift you can make.

The concept is simple, but it is crucial that the gears that make up this mechanism are calibrated to perfection and oiled regularly. Don't leave anything to chance if you do not want to be amateurish in the eyes of your customers.

It’s fundamental that you offer people what they want. The email list is considered by most online business owners as the most important asset of a business, and the only one that really is 100% yours.

A typical use of an email list

Let's look at an example. This is the system that most successful blogs use:

a person reaches your site coming from search engines or Facebook. Then a popup appears (more or less invasive) with the request that they enter their email to get a small gift. Then you’ll send them the gift via email, and the person enters this cycle where they will be offered a variety of products over time.

Usually, when a person gets on your list, they enter a phase called the funnel. The funnel is an automated process of warming, that is, the person get "heated" and is brought from being a random visitor to becoming a possible customer via a series of emails.

As soon as the person signs up, they will receive an email. The next day they will receive another, after 3 days another one, all according to predetermined logic.

Typically, these e-mail series terminate after 7-8 mails where a story is told and in the end, they will be offered a product to purchase. If the person doesn't buy right away, emails will continue to flow, and so on until the automated sequence ends.

There are many kinds of different sequence types and usually people do not invent anything new. Instead they use well-tested systems (which you can easily recognize once you are trained).

Once this sequence is over, the person's email is placed in another sequence, or in the general list, which is no longer automated. Then, the person managing the list (you, for example), will send an update email from time to time, say once a month, to make sure the person don’t forget about them.

In short, the author of the list tries to sell a product but if the recipient does not buy it, they will still remain in the list until they cancel the subscription. Because you never know – in the future they could decide to buy and become a customer.

How to use an email list

Of course, there are several approaches to the list. Let's see some situations that you could apply in your case.

If you sell an ebook: your users are therefore your readers. You could add a link to your site, and use as a lead magnet a free ebook on a topic that you know the user is interested in.

On the list, you could initially present an upsell of other ebooks you've already written. Then you could insert the person into your monthly email, where you'll publish interesting links to the topic, and from time to time promote your new ebooks.

If you sell a product: for an info-product, it's the same process as a typical example used on blogs. Maybe as a lead magnet you use one or more chapters, or you have a video or something else related to the subject.

If you have a software product: the list could be made up of all the people who bought your software if you sell to them directly, which gets you their emails. Or you may want them to sign up for your application.

You could use the list to share updates, inform about the latest releases, cross-promote with other developers, and raise awareness on new products you’ll build over time.

Where to host your email list

To manage an email list you need a specialized software.

There are many different kinds of email newsletter management tools.

Some are simple. Some are way too complex for your needs. You just need to find the perfect one for you.

The first separation I want to make is between self-hosted software and SAAS. Sendy (https://sendy.co) is an example of a self-hosted software. You don't pay a monthly fee to use it, but you have to manage your own server, and you use a service, typically AWS, to actually send the emails.

ConvertKit is an example of a tool that is SAAS based. You pay them a monthly fee, and they take care of everything.

That tool, in particular, is targeted at bloggers, and it's really well made. I have used it for almost 2 years, and it's really great.

I have recently moved to Sendy, self-hosting my newsletter, because at some point the price, for me, was not sustainable.

To start with, I would definitely recommend ConvertKit. You don't need to overthink spending $29 or $49 a month if that's valuable to you.

But my list became big enough and I was not comfortable spending a lot of money on my email list hosting software.

And it's a business tool: I know several top-performing bloggers with great audiences that use it for lists in the hundreds of thousands, and I'm sure that the ROI (Return on Investment) is well worth not having to manage your own server.

Especially if you are new to managing servers.

ConvertKit is not the only service, of course. There's Mailchimp, Drip, and others.

Some tools let you start free. I think of TinyLetter (https://tinyletter.com/). That's what I started with, in the beginning, until I reached a few hundred subscribers. Then I moved to a tool called ButtonDown and I went from there.

Keep it alive

As with blog posts frequency and consistency, the best advice I can give about mailing lists is to keep them consistent.

Do you write every 2 weeks? Fine. Keep doing it.

Do you write every month? Fine. Keep doing it.

The exact frequency is really personal. Some people write a new email for every post they make on their blog.

Some people email once a month with the list of posts. If you write once a month, however, people might forget who you are. This happened to me: I might subscribe to a newsletter and forget about it if you don't email me quite frequently.

Since I write one post per day, I found my sweet spot at one email every week, on Tuesday, and I always respect this frequency.

People know that Tuesday is "email from me" day.

The lead magnet

We discussed how having a newsletter is essential. It's also essential to have people signed up for it.

How can you have people decide to give a thing so precious as their email address to you?

The best way I know is to give them something in return. Don't expect people to sign up without a clear gain for them

You need to give an incentive to people to sign up for your newsletter.

This is the lead magnet that we discussed briefly earlier.

It can be a 1-page PDF cheat sheet. A report. A short mini-course of 10 videos. An email-based course.

The sky is the limit when it comes to what the lead magnet should be.

And there is no reason you should only have one lead magnet. You can have multiple.

In the ideal case, every blog post should have a specific lead magnet, but this is of course not always possible. I tend to create a lead magnet for each category of posts I'm writing.

How I discovered lead magnets

At the beginning of my blogging adventure (a little more than 2 years ago), my blog had zero traffic and Google ignored me.

I shared my posts on Reddit, and some people came and saw the site. I shared my posts on Twitter, where I had like 500 followers, many of them probably bots or inactive followers that I had collected in the 10 years I had been on Twitter.

If I had 10 or 15 visits a day, that was a good day.

After a while, I decided to create a newsletter, with a simple promise: every 2 weeks I'd send you links to all the posts I published. Like everyone does. That was good to get an email subscriber every other day, but that was it.

After some months, traffic grew a little and I was getting 4-5 subscribers every day. This was better.

Then I realized that people will not subscribe to a newsletter if they don't gain an advantage from that. This is a key point. I rarely subscribe to a newsletter just to “stay in touch”. Sometimes I do, and when this happens to you, that’s a quality email subscriber. Someone that really wants to hear from you.

But to get to this level requires people to have received a lot of value from you already, in one way or another. Maybe they already subscribe to your YouTube videos or your podcast. It’s hard for a complete stranger to subscribe.

So I changed my strategy from asking to "Join my newsletter" to offering people something of value. This lets the conversation begin with me offering a valuable asset.

In my case, the valuable asset, in the beginning, was a little PDF with a collection of the best blog posts I had written on a subject, nicely organized as an ebook.

Most people coming to my blog didn’t read more than one page, so I thought that creating a nice little ebook was a good way to show them what I had to offer. This increased signups a lot.

Ups and downs

Having a blog is not all fun and games. There are many things that might give you a hard time on your journey.

Realizing this is a first step in the right direction.

Writer's block

Writer's block is a thing. I have no general advice on this, and whole books were written on the subject so there's a lot of better advice out there than what I could come up with.

My solution when it comes to not knowing what to write about is to pick a subject I want to learn, and start learning it in public. Right as I write this, I am learning a completely new thing (Arduino and electronics sensors) while re-discovering the old electronics topics I studied back in school.

I am shooting videos while I learn this thing, and writing blog posts on the topics that are better suited for blog posts (no, I'm not limiting myself to blogging, I also like doing videos).

If a topic is boring to me, I just don't write about it because if I'm bored writing, I will write a boring article. So I try to write about things I'm interested in and excited about.

Imposter syndrome

Every person, sooner or later, is going to suffer from this thing which we label imposter syndrome. You might have this feeling now, but you don’t know that it has a name attached.

Let me describe some situations where you might find imposter syndrome in the wild.

You are a developer, have no Computer Science degree, and you feel people that have the CS degree know a lot more than you, and you should get one too in order to be called a developer.

You work on a project and you call it a little side project, not a real project, because – you know – it’s just a simple app.

You constantly belittle yourself, and have low confidence in your abilities.

You think other developers know a lot more than you do.

You think someday someone will find out that you are not worth your job position, as you can’t solve the coding interview quiz #423 from a random book.

You think you don’t belong to the coder’s club.

In the case of blogging, you’d like to start blogging but you fear other’s opinions and even think that you can’t add anything new to the table, so you don’t even start.

What's the solution to this problem?

I don't know if it applies to you, but when I start to feel this way, I try to put myself in the learner's shoes. I am not teaching. I am learning in public. Most of the time.

If this is not enough, realize how far you have come from where you started. Look back. There was a day when you could not even figure out how to start the computer. What code even was. You didn’t know you could actually create programs and make the computer do what you want.

Look at you now. You are the best version of yourself and yet you can be perfectly sure that tomorrow you’ll be an even better version. You are improving. Just like your blog posts.

Working in public

Working in public can be nerve-wracking. Well, it is for me. You don't really know who is watching your work, and what they really think of it.

You're one step away from an intolerant expert judging your work as not relevant.

And maybe the creator of a library is looking at your tutorial on it, thinking you didn't get it right.

But looking at the opposite side of the spectrum, by learning in public you are forced to grow.

Step up the game.

You need to put a lot of effort to make your work great in the eyes of a lot of people.

Burnout

It's easy to feel overwhelmed by all the things you are doing. Thinking about new content, writing the actual content, writing guest posts, trying to promote the content as much as you can – but without being spammy, and replying to comments and feedback.

This is not unique to blogging, of course. I have seen this even more in the YouTube space. There, it's even worse to me. You are putting your face and voice in front of a lot of people, instead of just your words and pictures like in a blog post.

My best advice to avoid burnout is to choose a minimalistic approach and to pick a topic that deeply interests you.

If you write about things you are passionate about, you will never have a shortage of things to write about. Your list will be 3 miles long.

Choosing a minimalistic approach means that you have to cut down anything that's not essential. I do not have comments on my blog. I need to care less about what people think, which has the drawback of creating less community, but also has the positive of causing me less stress.

Also, I do not generally promote the content I write on social media or other outlets, except if it is a special article that I really want to be seen, and I do not usually write guest posts on other blogs.

Such activities can be limited once the blog is up and running and you get a fair share of visits every day. So with the increase of views and stress given by many people looking at your work every day, you get the benefit of focus.

Lower your expectations

If you keep your expectations low, you will never be deluded. Don't expect your blog to be an overnight success. It will not happen. Just like it does not happen with a YouTube channel or a podcast. It's hard. Except for some lucky ones, maybe.

This is why blogging about things you are passionate about is beneficial. If you write about things you always wanted to write about, and will even write if no one is reading, then you are on the right track.

Then if success will ever come to you, you'll be more than ready for it.

Trolls and negative feedback

The Internet can be a wild place, and I am sure I don't have to explain this to you. When people write comments online, they can be mean. Sometimes. Most of the time they are not.

I do not have comments on my blog directly, but I do receive feedback via email and on Twitter. And on YouTube videos.

And the rare day I get one blog post featured on Reddit or Hacker News, two sites relevant for my content, I get very stressed about looking at comments.

It must be me, and most of the times comments are wildly positive, which is great. But I heard somewhere that our brain is much more receptive to negative feedback, and I can certainly confirm that I remember bad feedback more than positive feedback. It can take 10 positive comments to make up for a single negative one.

I might be over-sensitive but removing comments altogether from my blog removed the handbrake. I do not have to worry if some content does not resonate with people.

I wrote it, it's like that, I did my best to make sure it's "correct" to my best judgment, and I am off to the next one.

Your mileage might vary.

Ignore vanity metrics

I have the incredible experience of having enough visitors to be surprised every day of the number of people visiting the blog.

I open Google Analytics at a random point in time during the day and I see the number of people. Then I get back to whatever I was doing. It's kind of addictive, but also useless.

Does that affect my day? No.

Does that change what I'm going to do next? No.

Same for email subscribers. Does it really matter how many people are on the list? No.

What matters the most is that people resonate with your ideas and learn from your work.

Even if it is just a handful of people.

The rest is useless.

Blogging is lonely

Blogging is lonely, in the same way that writing a book is lonely. Also working in your secret laboratory is lonely. Being a YouTuber is lonely. Being a remote freelancer is lonely.

There's not much of a solution for this.

Other than accept it, and realize that some people might be more happy to be lonely. I am definitely an introvert and I thrive in a lonely environment, spending days in the silence.

That's probably why I like blogging.

It takes time

Let's say it out loud: it's going to take a lot of time. There is no way that your blog will be an overnight success. It will take many months and possibly years before you will see a rising tide of visitors to your blog. Maybe. If you did it alright.

This is a harsh truth, but it's one I think is necessary because I don't want you to believe that success is easy to achieve, and I want to set the right expectations. Time, persistence, showing up every day. This is what it takes, for any kind of success in any kind of activity.

It's a long game, but one that will eventually give you a lot of satisfaction.

Making money with a blog

A blog can be a great launch point for various projects that can make you money.

There’s absolutely no need for your blog to make money if you don’t want it to. But it’s good to know what your options are. In this last chapter, I’m going to explain at a high level the main options for “monetizing” a blog.

Get more clients for your business

The first and easiest way, I'd say, is to offer your services.

This especially works with non-location specific services. For example, if you are a plumber it might be harder. Not impossible, especially in large cities, but other channels could work better.

But if your business or activity is not linked to a specific location, a blog can be a great promotion for your business.

You can write articles that position you as an expert in the field you work in, and people will get in touch using the tools you give them: email, chat, or whatever you want.

I’ve seen this applied countless times, and it can lead to big opportunities in consulting. I have also experimented this first-hand when I started my career.

Advertising, affiliates, and sponsors

When your blog starts to gain a consistent number of visitors, that’s when it can make you some money in what’s usually called “passive income”.

There are 3 ways, mostly: advertising, affiliates, and sponsors. This is the difference: advertising is banner or text ads that appear on your page. You typically add a code to the site and then forget about it.

There is a broker, like Google Ads or Mediavine or BuySellAds that will take care of everything for you. They'll find companies that want to show their ads, and their ads will be displayed on your blog. You get paid by ad views and/or ad clicks. It’s the simplest method you can find, although it usually requires a high number of page views to work.

Affiliates work in a different way: you get paid when people purchase a product coming from a link put on your website.

A common affiliate system is Amazon affiliate links. I’m sure you’ve seen them everywhere, under YouTube videos, under Instagram posts, and so on.

When Amazon makes a sale, you get a percentage of that. Same works for other smaller affiliate programs.

For affiliate links, you need to generate a specific link and depending on the frequency you have to do that, and the number of products or programs you promote, it will require more work on your part.

Sponsors work in a different way, and you typically need to get in touch with companies via email or phone. They will usually pay a flat fee for a month (or more) of sponsoring. You typically need to put a banner on the site or talk about their products in your posts.

Selling your own products

The system I like the most is using the blog to promote your own products.

It’s similar to promoting your services, but with products, it requires less work on your part and it can scale very easily.

Sure, you need a product beforehand. And you need a product that you know will be relevant and useful to people who read your posts.

But once you have it, you can promote it to your readers, without paying for ads, and without having to run an affiliate program yourself. Then, all your work – your blog and your products – are all aligned in the same direction: making useful things for the people you want to interact with.

Final words

I hope this book was useful to you, and I really hope it might be the inspiration you need to create your own blog.

Download a PDF and ePub version of the How to Start a Blog book here.

In it, I will show you why you should share your coding expertise by looking at five extraordinary benefits.

I have always enjoyed sharing content online and helping others. But today, as a software engineer, I can tell you that it helps me even more.

Recently, I started asking myself about the benefits of doing sharing knowledge. That's how I found five reasons that will motivate you to start today.

Let’s discover them!

You'll gain a deeper understanding of what you’re learning

One of the main benefits of sharing what you know is that you will deep dive into the subjects you want to share with everyone.

This means that you will repeat your learning process in order to best write your technical content. By doing so, you strengthen your knowledge of the subject, and you may even learn something new.

For example, when I'm creating new content, I like to read similar resources before I start writing. This helps me to understand the concept better and write something more accurate and useful.

Then when I publish my content, sometimes I receive feedback that gives me better ways of solving my issue.

This happens to me often when I'm sharing articles about JavaScript, and it's super useful in my own learning process.

You’ll help others

Always remember that you're not alone! Many developers encounter the same issue as you and will benefit from your specific way of explaining that issue.

In the beginning, you might feel like you're writing only for yourself. But one day people will start finding your content and they'll learn from and enjoy it.

I recommend using an open publishing platform like Hashnode, Dev.to, or Twitter if you want to get started. These have significant developer communities built around them. People there will support you and give you feedback on your content. It can be an excellent motivation to start!

And once you've done some writing, you can apply to publications like freeCodeCamp's and share your knowledge with the large community they've built as well.

One side note: even if there is plenty of content about a particular topic, please write your own article about it. There is considerable potential that your article will complete or complement what's already out there. Everyone explains things and brings value in their own way.

You’ll have fun and discover new opportunities

Creating content takes time, but it's a fun way to learn. You will improve your skills while building an audience of people with the same interests as you.

I've seen a lot of great stories from developers sharing content on Twitter. The good thing is that the Tech community is generally supportive, and everyone helps each other.

Also, building an audience, or at least sharing content online, can bring you new opportunities. For example, it can help you find and apply for a new job, create a side-project, and even more.

You’ll create a piece of knowledge for your future self

Sharing your knowledge is like writing documentation for your work. It helps others – but it also helps you! You can refer later to what you documented and shared if you can't remember how you solved a bug or issue.

As an example, I like to take notes whenever I repetitively search for something on Google. And I know that others are probably searching for the same thing.

So later, I often write an article about that search. It allows me to refer to my content when I need a reminder.

It’s very gratifying when you find your article on Google, and at the same time it helps you and others.

You should give it a try :)

You’ll be more motivated

Last but not least – creating content will help you stay motivated. Sharing your journey as a developer can help you feel like you're making progress in your learning.

I think this is the case because:

• you will have concrete pieces of content based on what you learned, tested, and built (it helps to keep track of your progress)
• you will help others and have their support
• you will have fun (enjoying the process = motivation)

Ready to start?

Hopefully, this article can motivate you to start sharing your knowledge. Start today by sharing your learning journey with the community.

I have primarily written up these benefits based on my experience. I'm pretty sure you can find even more. In any case, you'll have a lot of fun getting started.

If you're interested, follow me on Twitter 🐦! I'll help you to improve your skills as a web developer.