I used to run my personal site on WordPress.
And it was fine. It was live. It was doing the job.
The problem wasn’t that WordPress broke. The problem started when I wanted to redesign it.
I was on Elementor, plus a stack of plugins — Semrush tooling and others — that made everyday marketing easier until they didn’t. Every redesign idea ran into the same wall: the page builder and the plugin ecosystem locked the layout, the markup, and the way content was structured. I wasn’t free to rebuild the site the way I actually wanted it to look, feel, and sell.
So I chose a different path.
Not another Elementor theme. A custom open-source stack: Payload CMS for content, Astro for the frontend, based on the payload-astro-website-template by jhb-software.
This is how I built it — and why the pages look more like a marketing agency than a sole-trader portfolio.
Why leave WordPress (even though it still working)?
WordPress wasn’t the enemy. Lock-in was.
Elementor and those plugins were useful until a full redesign needed real control — custom layout systems, clean code, and a content model I owned. Fighting the builder to get agency-level design and SEO structure wasn’t worth it.
I wanted:
- Design freedom — a redesign without fighting a page builder’s constraints
- Ownership — content models and components I control, not plugin settings I inherit
- SEO as a first-class feature — meta, structured data, clean URLs, redirects — without bolting on another plugin for every gap
- A workflow that matches how I actually ship — TypeScript, Git, Docker, deploy scripts
Payload + Astro let me treat the website like a product again: redesign on my terms, then market it properly.
Starting from an open-source template
I didn’t invent the architecture from a blank folder.
I started from jhb-software/payload-astro-website-template — a monorepo with:
- cms — Payload CMS (collections, blocks, SEO plugin, media)
- web — Astro frontend that consumes the CMS API
That template already thought through the hard parts: multi-language paths, SEO metadata, breadcrumbs, redirects, media hosting patterns, live preview, sitemaps, robots.txt.
My job was to adapt it into nathanielgatpandan.com — personal brand, work case studies, blog, and marketing-led pages — then self-host it the way I run client and product work in the real world.
How the stack fits together
In plain terms:
- Payload — is the headless CMS. Posts, pages, tags, categories, media, and page blocks live there.
- Astro — is the public website. It renders pages from Payload and stays lean for visitors.
- Postgres — stores the content.
- Object storage — (Cloudflare R2 in production) holds media, served under the site domain.
- Docker — runs the production stack on a VPS — CMS, web, database, reverse proxy.
Editors publish in Payload. The site is built to make that content visible quickly. Rebuilds stay for the parts that need them (redirects, server bundle updates), not for every sentence change.
That separation is the point of leaving Elementor-era WordPress: the CMS is a tool for content, the website is a tool for visitors and search engines — and neither is trapped inside a page builder.
Building more than a portfolio
Here’s the part people ask about most.
Why does the site look like a marketing agency — services framing, case-study storytelling, SEO-aware structure — instead of a quiet “here’s my gallery” portfolio?
Because a portfolio alone doesn’t sell future work with businesses.
Businesses don’t hire a vibe. They hire clarity:
- What you do
- Who it’s for
- How you think
- Proof you’ve shipped
- A path to start a project
A classic portfolio is easy to admire and hard to convert. An agency-shaped site is built for discovery and decision.
That means:
- SEO — pages and posts that can rank for the problems I solve (web design, branding, development, content systems)
- Positioning — language that speaks to founders and marketing teams, not only other designers
- Trust — work presented as outcomes and process, not just pretty thumbnails
- Content — a blog that shows how I build, choose tools, and think about growth
If someone finds me through Google, LinkedIn, or an AI answer, the site has to answer the business question fast: Is this the person I’d trust to reinvent our brand or scale our digital presence?
That’s marketing. On purpose.
What I took from agency sites
I studied agencies that treat their homepage as a sales engine — not a résumé dump.
From places like MadeByShape and Rise at Seven, I borrowed the discipline of clear services, strong narrative, and content that compounds SEO over time. From studios like Agence Foudre, Brand Appart, ZOMA, and Cut the Code, I studied motion, composition, and how premium brands present work without looking generic.
The result isn’t a clone of any of them. It’s a personal site that uses agency structure so the next business conversation starts warmer.
What open source gave me
Using Payload and Astro — and an open template as the foundation — means:
- No Elementor / plugin lock-in when I want to redesign again
- A CMS I can extend with custom fields and blocks
- A frontend I can shape without fighting a page builder
- A stack I can explain and sell: “I build the same class of systems for clients”
Leaving a working WordPress site wasn’t about failure. It was about unlocking the redesign — and proving I ship modern content websites the same way I’d build them for a business.
Inspirations and moodboard
These are the references that shaped the look, rhythm, and marketing posture of the site:
- Agence Foudre — card slide energy, human brand voice
- Brand Appart — card stack, conversion-led studio layout
- Units — bento composition and living-product clarity
- ZOMA — previous WordPress-era inspiration; bold agency marketing
- Meditation and medicine website (Dribbble) — bento hero direction
- Education / business growth (Dribbble) — bento hero direction
- Cut the Code — inverted bento, no-code / agency confidence
- Design Trends 2026 (Behance) — visual ideas and trend cues
- MadeByShape — top inspiration: agency clarity, craft, and content
- Rise at Seven — top inspiration: search-first storytelling and category leadership
If your WordPress site still works but Elementor and plugins lock every redesign, the next move might not be another theme. It might be a stack you own — and a site built to sell the next engagement, not only display the last one.
Mine does both.
