Your entire blog is powered by a single Google Doc. No dashboards, no databases — just write and publish.
The blog reads a publicly published Google Doc and parses it into individual posts. Each post is separated by a special marker line. The page fetches the document fresh on every load — so publishing a new post is as simple as updating the Google Doc.
You don't need to touch any code. Every change you make in the Doc appears on the blog automatically.
Before the blog can read your Doc, you need to publish it to the web. This is a one-time step.
/pub. Copy it.blog.html and find the line at the top of the script section that reads GOOGLE_DOC_URL = '…'. Replace the URL inside the quotes with yours.Every post follows the same simple format. Start with the marker line, add your metadata fields, then write your content freely below.
---POST--- TITLE: My Post Title Here DATE: June 12, 2025 AUTHOR: Jane Doe TAGS: Design, Technology, Opinion Everything below this blank line is your post content. Write normally — paragraphs, headings, lists, images all work. Your first paragraph goes here. This text will appear as the excerpt on the blog index page. Add as many paragraphs, headings, or images as you like. Google Docs formatting (bold, italic, links) carries over.
| Field | Format | Required? | Notes |
|---|---|---|---|
| ---POST--- | Exact text | Required | Marks the start of every post. Must be on its own line, no spaces. |
| TITLE: | Plain text | Required | The post's headline. Displayed large on the card and full post view. |
| DATE: | Any text | Optional | Shown in the card meta row. Use any format you like, e.g. June 12, 2025. |
| AUTHOR: | Plain text | Optional | The author's name. Shown alongside the date. |
| TAGS: | Comma-separated | Optional | Category labels. These become the filter pills on the blog index. e.g. Design, Tech |
Stack posts one after another in the same document. Each new ---POST--- line starts a fresh post. The blog automatically displays them newest-first (posts at the bottom of the Doc appear first).
---POST--- TITLE: First Post DATE: January 1, 2025 TAGS: Intro This is the content of my first post. ---POST--- TITLE: Second Post DATE: February 14, 2025 TAGS: Design, Opinion This is the content of my second post. It will appear first on the blog because it's newer.
Insert images directly into your Google Doc using Insert → Image. Place an image anywhere within a post's content and it will appear in the same position on the blog.
The first image in a post is used as the thumbnail on the blog index cards. All images are automatically resized to fit the layout.
All standard Google Docs formatting is carried through to the blog automatically. You can use the Docs toolbar as normal.
| Formatting | How to apply in Google Docs | Result on blog |
|---|---|---|
| Bold | Ctrl/Cmd + B | Bold text |
| Italic | Ctrl/Cmd + I | Italic text |
| Heading 1 | Format → Paragraph styles → Heading 1 | Large section heading |
| Heading 2 | Format → Paragraph styles → Heading 2 | Medium section heading |
| Heading 3 | Format → Paragraph styles → Heading 3 | Small italic subheading |
| Bulleted list | Format → Bullets & numbering | Disc bullet list |
| Numbered list | Format → Bullets & numbering | Numbered list |
| Hyperlink | Ctrl/Cmd + K | Underlined link in accent colour |
Open blog.html in a text editor. At the very top of the <script> block you'll find the configuration section — the only two lines you ever need to change:
/* ★ CONFIGURATION — edit these two values only */ const GOOGLE_DOC_URL = 'https://docs.google.com/…/pub'; // your published doc URL const POSTS_PER_PAGE = 6; // how many posts appear per page
The.Journal in blog.html to update the logo, and look for the <section class="hero"> block to change the headline and tagline.
---POST--- marker---POST---.