ForgeDocs — All-in-One Astro Starlight Theme

If you have been looking for an Astro theme that does not force you to pick between a landing page, documentation, or a blog, ForgeDocs is worth a look. It is built with Astro 7 and Starlight, and it ships with a complete content system — landing page, documentation, blog, and static pages. Everything is editable from JSON and Markdown. No database, no admin panel required, no monthly fees.

Most themes give you one of three things. ForgeDocs gives you all three in a single Astro project. One codebase. One design system. One deployment. That is the entire point.

This article covers what ForgeDocs is, who it is for, what is inside, and a complete documentation walkthrough — from installation to deployment.

---

The Problem ForgeDocs Solves

Building a product site usually means stitching three separate things together:

1. A landing page template for marketing
2. A documentation framework for docs
3. A blog template for content

Each one comes with its own design system, its own navigation, its own deployment pipeline. You end up with three sites that do not look like they belong together, and three things to maintain.

ForgeDocs removes that problem. It combines all three into one Astro project with a shared design system and shared navigation. You deploy once. You maintain one codebase.

---

Who ForgeDocs Is For

• SaaS founders launching a product with documentation
• Developers who need a professional site without hiring a designer
• Documentation teams that want a consistent design system across marketing, docs, and blog
• Agencies building Astro sites for clients
• Indie makers who want a fast, modern site on Astro

Who ForgeDocs Is Not For

• Documentation-only projects — see Docuna or Docus
• Booking-based sites like rentals — see Astro Car
• Portfolio or gallery sites — see Blacks
• Landing-page-only projects — see Finance App

---

Two Versions Available

ForgeDocs comes in two packages on Gumroad.

Code Only — $79

Full source code. Edit content directly in Markdown and JSON. For developers who want full control over every file.

Code + Decap CMS — $129

Everything in Code Only, plus Decap CMS pre-configured. Edit all content — landing page, docs, blog, static pages, SEO, navigation, footer — from a browser admin panel. No coding required.

Both packages include lifetime updates and unlimited projects. The only difference is whether you edit files directly or from a browser admin panel.

---

What You Get

Landing Page

Hero section, feature grid, pricing table, and CTA — all driven from JSON. Change copy once, update everywhere. No hardcoded content in components.

Starlight Documentation

Full docs system with sidebar navigation, sticky table of contents, and Pagefind full-text search. Write in Markdown or MDX. Sidebar supports nested groups and autogenerated directories.

Blog System

Post list with pagination, tag filtering, detail pages, and RSS feed. Includes related posts and SEO metadata per post. Write in Markdown.

Static Pages

About, FAQ, Terms, Privacy, and Contact. Managed from a single content collection with dynamic layouts. Each page type has its own layout — default, faq, legal, or contact.

Light and Dark Mode

System preference detection. Persists across sessions. Works on every page, every component.

SEO Foundation

Meta tags, Open Graph, Twitter cards, canonical URLs, and sitemap generation. All automatic. Per-page SEO from frontmatter.

Responsive Design

Mobile-first. Works on desktop, tablet, and mobile. No broken layouts, no horizontal scroll.

Markdown and MDX

Write docs, blog posts, and static pages in Markdown or MDX. Full component support.

JSON-Driven Content

Every piece of copy — hero text, features, pricing, navigation, footer — comes from JSON. No hardcoded content in components.

Unlimited Projects

One purchase, use on unlimited personal and commercial projects. No per-site license.

Lifetime Updates

Every future version included. No upgrade fees.

---

Tech Stack

---

Features List

• Framework: Astro JS
• Documentation: Starlight
• Lang: JavaScript
• Tech: Node JS
• Data: JSON
• Content: Markdown
• MDX: Support
• Blog: Ready
• Pagination: Ready
• Landing Page: Ready
• Static Pages: Ready
• Dark Mode: Ready
• Responsive: Ready
• Sitemap: Ready
• SEO: Ready
• Unlimited Projects: Ready
• Lifetime Updates: Ready

---

Documentation

Everything below is the complete documentation included with ForgeDocs. Follow it from top to bottom to go from download to a live site.

---

Welcome

ForgeDocs is an all-in-one Astro theme that gives you three things in one project:

• Landing page — for marketing your product or service
• Documentation — powered by Starlight, Astro's official docs framework
• Blog — with pagination, tags, and RSS feed

This documentation walks you through everything — from installing the project to deploying it on a live domain.

Who This Documentation Is For

Non-technical buyers — If you bought ForgeDocs and want to edit content, add pages, or deploy your site without writing code, start with the Getting Started section.

Developers — If you want to customize the theme, add features, or understand the architecture, jump to the Developer Guide.

You do not need to be a developer to use ForgeDocs. Most content changes happen in Markdown and JSON files — no coding required.

What You Need Before Starting

• Node.js 18 or newer — download at https://nodejs.org
• A code editor — VS Code recommended: https://code.visualstudio.com
• A terminal — Terminal on macOS, Command Prompt on Windows

---

Installation

This guide walks you through installing ForgeDocs on your local machine.

Requirements

Node.js 18 or newer

Download the LTS version from https://nodejs.org

A code editor

Download VS Code from https://code.visualstudio.com

A terminal

Command Prompt on Windows, Terminal on macOS.

Check Node.js

Open your terminal and run:

node --version

If you see v18.0.0 or higher, you are ready. If not, install Node.js first.

Step 1 — Download the Source Code

After purchase, download the ZIP file from your Gumroad library. Extract it to a folder on your computer.

Recommended location:

• Windows: C:\Users\YourName\Desktop\forgedocs
• macOS: /Users/YourName/Desktop/forgedocs

Avoid folders with spaces or special characters in the path.

Step 2 — Open the Project in Terminal

Windows:

cd C:\Users\YourName\Desktop\forgedocs

macOS:

cd ~/Desktop/forgedocs

Verify you are in the right folder:

• Windows: dir
• macOS: ls

You should see package.json in the list.

Step 3 — Install Dependencies

npm install

This downloads all packages. It takes about 30–60 seconds the first time.

Step 4 — Start the Development Server

npm run dev

Open your browser and go to:

http://localhost:4321

You should see the ForgeDocs homepage.

Step 5 — Verify the Installation

npm run build

If the build completes without errors, you are ready.

Troubleshooting

npm: command not found — Node.js is not installed. Reinstall from https://nodejs.org

EACCES: permission denied — On macOS or Linux, run sudo npm install

Module not found — Delete node_modules and package-lock.json, then run npm install again.

Build fails with version errors — Check node --version. Install the latest LTS if older than 18.

---

Run Project

Start the Development Server

npm run dev

Open http://localhost:4321.

The dev server watches your files. Changes appear instantly. Stop it with Ctrl + C.

Build for Production

npm run build

This creates a dist/ folder with your optimized site. Compiles all pages to static HTML, optimizes images, generates sitemap, and builds the Pagefind search index.

Preview the Production Build

npm run preview

Serves the dist/ folder locally. Use this to test the production build before deploying.

The Three Commands

---

First Setup

Edit astro.config.mjs

Open astro.config.mjs in your code editor. It is at the root of your project.

Update site to your domain:

site: 'https://your-domain.com',

Astro uses this URL to generate canonical URLs and sitemap entries.

Update Starlight title and description:

starlight({
  title: 'Your Site',
  description: 'Your description here.',
  ...
})

Update the sidebar to match your docs structure:

sidebar: [
  {
    label: 'Getting Started',
    items: [
      { label: 'Welcome', slug: 'welcome' },
      { label: 'Installation', slug: 'getting-started/installation' },
    ],
  },
]

Save and restart the dev server.

---

Update JSON Data

Most ForgeDocs content is stored in JSON files in src/data/.

seo.json

Controls site-wide SEO metadata: title, description, keywords, Open Graph image, canonical URL, Twitter handle, favicon, theme colors.

site.json

Site metadata: name, version, tagline, description, domain, demo URL, price, license.

navbar.json

Navigation links and brand: logo, brand label, menu items, CTA button.

footer.json

Footer columns, social links, copyright, legal links.

home.json

Landing page content: hero, showcase, features, pricing plans, CTA section.

features.json

Features page content: hero, stats, showcase, feature items with images.

contact.json

Contact page: hero, Formspree ID, info items, highlights, form fields.

blog.json

Blog labels: list title, pagination text, tag labels, SEO titles.

JSON Rules

Always use double quotes. No trailing commas. Save with UTF-8 encoding. Test locally with npm run dev.

---

Update Pages

Docs Collection

Docs live in src/content/docs/. Each .md file becomes a page.

Frontmatter:

---
title: Page Title
description: Short SEO description.
---
Content goes here in Markdown.

The sidebar is configured in astro.config.mjs.

Blog

Blog posts live in src/content/blog/. Each .md file is a post.

Frontmatter:

---
title: "Your Post Title"
description: "Short SEO description."
date: 2026-01-15
tags: [astro, tutorial]
image: /images/blog/cover.webp
imageAlt: "Cover description"
---
Content goes here.

Static Pages

Static pages live in src/content/pages/. Each .md file becomes a page at /{filename}/.

Frontmatter:

---
title: About
description: Short SEO description.
image: /images/about-hero.webp
imageAlt: "Image description"
layoutType: default
updated: 2026-01-15
---
Content goes here.

Layout types: default, faq, legal, contact.

---

Project Structure

forgedocs/
├── public/
│   ├── admin/           Decap CMS admin panel
│   ├── uploads/         CMS media uploads
│   ├── logo.svg
│   └── favicon.svg
├── src/
│   ├── components/      UI components
│   ├── content/         Markdown content
│   │   ├── blog/
│   │   ├── docs/
│   │   └── pages/
│   ├── data/            JSON content
│   ├── layouts/         BaseLayout
│   ├── pages/           Routes
│   └── styles/          landing.css
├── astro.config.mjs
├── content.config.ts
├── package.json
└── tsconfig.json

---

Decap CMS — Local Setup (Code + CMS Package Only)

If you bought the Code Only package, skip this section.

Verify the CMS Config

Decap CMS configuration lives in public/admin/config.yml. Verify the backend section:

backend:
  name: git-gateway
  branch: main
local_backend: true

Keep local_backend: true while testing locally.

Run Decap CMS Locally

Decap CMS needs the production build to work. The dev server does not include the assets it needs.

Open two terminals in your project folder.

Terminal 1 — Build and preview:

npm run build
npm run preview

Terminal 2 — Run the Decap proxy:

npm run cms

You will see:

Decap CMS Proxy Server listening on port 8081

Open the Admin Panel

Go to:

http://localhost:4321/admin/

You will log in without credentials — the local proxy handles authentication.

---

Decap CMS — Update Content

Once deployed, your CMS is available at:

https://your-domain.com/admin/

Log in with your Netlify Identity credentials.

Collections

• Pages — static pages
• Blog — blog posts
• Docs — documentation
• Home — landing page content
• Site Config — SEO, site metadata, navbar, footer

Edit Workflow

1. Click a collection
2. Click an entry
3. Edit the fields
4. Click Save → Publish now

Decap CMS commits to GitHub. Netlify rebuilds the site automatically.

---

Push to GitHub

Step 1 — Create a Repository

1. Go to github.com/new
2. Repository name: forgedocs
3. Do NOT add a README
4. Click Create repository

Step 2 — Initialize and Push

git init
git add .
git commit -m "Initial commit"
git branch -M main
git remote add origin https://github.com/YOUR-USERNAME/forgedocs.git
git push -u origin main

You will be asked for a password. Use a Personal Access Token, not your GitHub password.

Create one at https://github.com/settings/tokens. Check the repo scope. Copy the token and paste it when Git asks for a password.

---

Deploy to Netlify

Step 1 — Connect Repository

1. Go to https://app.netlify.com/signup and sign up with GitHub
2. Click Add new site → Import an existing project
3. Select your forgedocs repository

Step 2 — Build Settings

Click Deploy site. Wait 1–3 minutes.

Step 3 — Custom Domain (Optional)

Go to Site configuration → Domain management → Add a domain. Follow the DNS instructions. Netlify provides free HTTPS automatically.

Step 4 — Enable Netlify Identity (For Decap CMS)

1. Go to Identity → Enable Identity
2. Under Registration preferences, choose Invite only
3. Go to Identity → Services → Git Gateway → Enable Git Gateway

Step 5 — Invite Yourself

1. Go to Identity → Invite users
2. Enter your email
3. Click Send

Check your email, accept the invite, set a password.

Step 6 — Access the CMS

Go to:

https://your-site.netlify.app/admin/

Click Login with Netlify Identity. Enter your credentials. You are in.

---

Deploy to Cloudflare Pages

1. Log in to https://dash.cloudflare.com
2. Go to Workers & Pages → Create application → Pages → Connect to Git
3. Select your repository
4. Build settings:

1. Click Save and Deploy

Note: Cloudflare does not include Identity or Git Gateway. Decap CMS requires GitHub OAuth on Cloudflare.

---

Deploy to Vercel

1. Go to https://vercel.com/new
2. Sign in with GitHub, select your repository
3. Vercel auto-detects Astro
4. Click Deploy

Note: Vercel does not include Identity or Git Gateway. Decap CMS requires GitHub OAuth on Vercel.

---

Deploy to Firebase Hosting

npm install -g firebase-tools
firebase login
firebase init hosting

Choose:

• Public directory: dist
• Single-page app: No
• Do NOT overwrite dist/index.html

Then:

npm run build
firebase deploy

---

Deploy to cPanel

Option A — Upload Build Output

1. Run npm run build locally
2. Zip the dist/ folder
3. Log in to cPanel → File Manager → public_html/
4. Upload and extract the ZIP
5. Verify index.html is in the root

Option B — Node.js App (if host supports it)

1. cPanel → Setup Node.js App → Create Application
2. Node.js version: 20
3. Application root: forgedocs
4. Upload project files
5. Run npm install && npm run build via SSH
6. Point document root to forgedocs/dist/

---

Deploy to AWS S3 + CloudFront

aws s3 mb s3://your-bucket-name
npm run build
aws s3 sync dist/ s3://your-bucket-name --delete

Enable static website hosting in S3 console. Set Index document to index.html.

For HTTPS and CDN, create a CloudFront distribution with your S3 bucket as origin. Set viewer protocol policy to Redirect HTTP to HTTPS.

---

Credits

Built with:

• Astro — static site framework
• Starlight — documentation framework
• Bootstrap 5 — CSS framework
• Pagefind — static full-text search
• Decap CMS — optional content management

Fonts:

• Poppins
• Inter

Author: Creativitaz

• Gumroad: https://creativitaz.gumroad.com
• Website: https://www.hockeycomputindo.com

---

License

One-time purchase. Unlimited personal and commercial projects. Lifetime updates. Not for resale as a template or theme.

See full Terms & Conditions in the documentation.

---

Get ForgeDocs

Code Only — $79

https://creativitaz.gumroad.com/l/forgedocs

Code + Decap CMS — $129

https://creativitaz.gumroad.com/l/forgedocs-cms

Live Demo: https://forgedocs.pages.dev

Documentation: https://forgedocs.pages.dev/welcome