Manual Install
@matthiesenxyz/ astro-ghostcms-catppuccin
Demo Live Demo of Catppuccin Theme
Install
# For fresh Installnpm create astro@latest# Create Empty Install with standard typescript# Then Delete entire `pages` folder under `/src/`
# Then run the following:
npx astro add @matthiesenxyz/astro-ghostcms tailwind
npm install @matthiesenxyz/astro-ghostcms-catppuccin
# For fresh Installpnpm create astro@latest# Create Empty Install with standard typescript# Then Delete entire `pages` folder under `/src/`
# Then run the following:
pnpm astro add @matthiesenxyz/astro-ghostcms tailwind
pnpm add @matthiesenxyz/astro-ghostcms-catppuccin
# For fresh Installyarn create astro@latest# Create Empty Install with standard typescript# Then Delete entire `pages` folder under `/src/`
# Then run the following:
yarn astro add @matthiesenxyz/astro-ghostcms tailwind
yarn add @matthiesenxyz/astro-ghostcms-catppuccin
Then set your astro.config.ts
to look like this:
import { defineConfig } from "astro/config";import ghostcms from "@matthiesenxyz/astro-ghostcms";import tailwind from "@astrojs/tailwind";
// https://astro.build/configexport default defineConfig({ site: "https://YOURDOMAINHERE.com/", integrations: [tailwind(), ghostcms({ theme: "@matthiesenxyz/astro-ghostcms-catppuccin", ghostURL: "https://ghostdemo.matthiesen.xyz", }) ],});
Setup Tailwind
Catppuccin Themes | Default? |
---|---|
Latte (Light) | |
Frappe (Light Dark) | |
Macchiato (Dark Light) | TRUE |
Mocha (Darkest) |
/** @type {import('tailwindcss').Config} */module.exports = { presets: [require('@matthiesenxyz/astro-ghostcms-catppuccin')]};
/** @type {import('tailwindcss').Config} */module.exports = { presets: [require('@matthiesenxyz/astro-ghostcms-catppuccin/latte')]};
/** @type {import('tailwindcss').Config} */module.exports = { presets: [require('@matthiesenxyz/astro-ghostcms-catppuccin/frappe')]};
/** @type {import('tailwindcss').Config} */module.exports = { presets: [require('@matthiesenxyz/astro-ghostcms-catppuccin/frappe')]};
/** @type {import('tailwindcss').Config} */module.exports = { presets: [require('@matthiesenxyz/astro-ghostcms-catppuccin/mocha')]};
Setup .env
variables
CONTENT_API_KEY=a33da3965a3a9fb2c6b3f63b48
When you deploy your install dont forget to set the above ENVIRONMENT VARIABLES!
Created Routes
The routes are the same as a standard Ghost Blog so you can migrate to Astro easily.
Route | Content |
---|---|
/ | Homepage with recents/features Blog Posts |
/404 | 404 Page |
/[slug] | Post or Page |
/author/[slug] | Author page with related posts |
/authors | All the authors |
/tag[slug] | Tag page with related posts |
/tags | All the tags |
/archives/[...page] | All the posts, paginated |
/rss.xml | All the posts, in a FEED |