Converted from doc(x) by doc2md. What's it doing here?
Posted on 27th May 2026 at 05:48 by Admin
Another site sourced from a WordPress site like astro-wpress.
This time from localhost/wp/wp
A lot of the notes here are as much about WordPress as Astro. Work on Astro and ncvp-class at the same time
Contents
Not needed. Normal Cloudflare deployment doesn’t work with local WP.
You can’t use the normal Cloudflare build mechanism, but have to build locally and upload /dist
Install Cloudflare CLI tool (Wrangler)
% npm install -D wrangler
Connect to Cloudflare account
% npx wrangler login
Build Astro site locally
% npm run build
Upload complete site to Cloudflare
% npx wrangler pages deploy dist
Adding this to package.json
”deploy”: “npm run build && wrangler pages deploy dist”,
allows
% npm run deploy # Build and deploy in one command
Copy /tsconfig.json from astro-wpress
Add
site: “https://al.ncvp.me\”,\
devToolbar: { enabled: false },
to astro.config.mjs. Rest of file slightly different with MDX stuff
Create a 70x70 logo, and put separately named copies in /public and /src/assets
Copy src/layouts/Layout.astro from astro-wpress and tweak
Copy src/components/Footer.astro, Header.astro, Menu.astro from astro-wpress and tweak
Copy src/styles/astro-wpress.css and rename astro-local.css
Copy src/data/menu_definition.js from astro-wpress
Copy src/pages/index.astro from astro-wpress and tweak. At this point Home page burst into life.
Copy src/utils from astro-wpress
I thought initially that this would not be possible with a static site, but Astro has an ingenious solution.
At build time it generates a compact index which the client only downloads if the search box is clicked.
% npm install fuse.js
astro-wpress gets feed from ncvp.me/wp. This is not possible for locally sourced blog.
How can we get it from the cloud astro site? This would be better for astro-wpress as well.
astro-blog
Works as supplied in blog template.
Useful reference.
astro-wpress
Some subtleties, particularly in /src/pages/rss.xml.js due to the fact that this is a front end to a headless WP site.
% npm install @astrojs/rss
Configure site url in /astro.config.mjs
export default defineConfig({
…
site: ‘https://astro-wpress.ncvp.me\’,\
…
});
Create /src/pages/rss.xml.js
Add to <head> in Layout.astro:
<link rel=“alternate” type=“application/rss+xml” title=“astro-wpress.ncvp.me” href={`${Astro.site}rss.xml`} />
/scripts/get-menu.mjs gets the menu via the WP REST API and builds menu_definition_auto.js in /src/data
Check carefully against menu_definition.js and replace when OK
Add to package.json manually
…
“scripts”: {
“get-menu”: “node scripts/get-menu.mjs”,
…
Run with
% cd ~/winxp/projects/astrojs/astro-local
% npm run get-menu
Other editorial possibilities
**1. Decoupled CMS (Headless)
**If you like the “dashboard” feel but want something more modern or specialized than WordPress, look at:
Payload CMS: This is currently the “darling” of the Astro community. It’s a Node.js-based headless CMS that is incredibly flexible. You can run it locally (just like WP) or host it. It uses TypeScript, so it integrates perfectly with your Astro constants and types.
Sanity.io: A cloud-based CMS where you define your “schema” (fields) in code. It has a great real-time editor and an Astro integration that makes fetching data very simple.
**2. Git-Based CMS (The “MD” Evolution)
**Since you’ve already worked with Markdown files, these tools provide a visual UI on top of your .md or .mdx files. They don’t need a database; they just commit changes to your Git repo.
Decap CMS (formerly Netlify CMS): An open-source classic. It adds an admin dashboard to your site that lets you write posts, and when you hit “Save,” it commits a Markdown file to your repo.
TinaCMS: This is the most impressive “modern” choice. It allows for Visual Editing, where you click on a heading directly on your Astro site and type to change it. It saves the changes back to your Markdown files.
**3. Keystatic (The “Local-First” Winner)
**Since you are currently enjoying a local-first workflow with Xubuntu and symlinks, you should definitely check out Keystatic.
It was built specifically for the “Astro/Next.js” era.
It has no database. It’s a beautiful UI that runs in your browser but saves everything as local files in your project.
It handles image uploads brilliantly---it will save them directly into your public/ folder without needing symlinks or rsync.
Comparison for a WP User:
| Feature | WordPress | Keystatic | TinaCMS |
| Data Source | MySQL Database | Local Markdown/JSON | Git-based Markdown |
| Interface | Familiar / Heavy | Minimal / Clean | Visual / Live |
| Images | Media Library | Local Folder | Local Folder/Cloud |
| Astro Setup | REST API Fetch | Local File Import | GraphQL/Git |
My Recommendation: If you want to stick with a “Local Build” workflow but want to get away from the overhead of a full PHP/MySQL WordPress install, try Keystatic. It gives you a clean editorial UI while keeping everything as simple files on your hard drive.
All the pages are classic apart from the following:
Home
Nice arrangement of general notes in the left-hand column and recent news posts in the right-hand. Keep it because it just works in Astro and ncvp-class
Blog
I made this look like the RHS of the home page by copying the Home page and taking out the ‘General’ column. I had to leave the single column in place, however.
Select posts
I made this in the block editor for the category date and tag WP selector blocks. I had to make an [ncvp_author] shortcode because the author selector is missing in WP. This caused a lot of trouble (for Gemini) because WP scripts try to get in and hijack the links to /category/test etc. It may be less trouble to do the whole page with a classic shortcode.
Block galleries
Just to show how useless they are.
Would it be worth making my own gallery shortcode for better control?
Block galleries are useless. Don’t waste time on them.
Firelight Lightbox formerly Easy Fancybox works, but is less controllable than ncvp-image-gallery.
Fancybox on Astro works well, and is version 5.
I need to make ncvp-image-gallery work on Astro-style single images with textflow
Text and images
Images are pop-out or static. Astro methods are good. It’s probably best to make ncvp-image gallery work with them.