Step 1: Basic Theme Structure – FSE Theme Development

UpdatedAugust 26, 2025

Part of seriesFSE WordPress Theme Development Course – Professional Training

Step 1: Basic Theme Structure

Create the fundamental folder structure for a Full Site Editor (FSE) theme following WordPress best practices.

Code Snippet:

cd wp-content/themes/starry
mkdir -p {assets/{css,js,images},inc,parts,patterns,styles,templates}

What This Creates:

assets/ – Static files (CSS, JS, images)
inc/ – PHP includes and functions
parts/ – Template parts (header, footer, etc.)
patterns/ – Block patterns
styles/ – Theme style variations
templates/ – HTML template files

Next Step:

After creating the structure, we’ll add the essential theme files (style.css, theme.json, functions.php).

Resources & References

Full Course on GitHub: https://github.com/4wpdev/4wp-course-fse-theme-development
Theme Code on GitHub: https://github.com/4wpdev/4wp-starter-theme
Course for WordPress developers: https://4wp.dev/course/fse-theme-development/
Author Fullstack WordPress developer: https://anatoliy.dovgun.com/

#4wpdev #fse #fse-themes #gutenberg

Comments

Join the discussion

No comments yet. Be the first to comment.

FSE WordPress Theme Development Course – Professional Training

Part 1 of 2

Learn to build production-ready FSE themes from scratch using theme.json, block patterns, templates, and advanced development workflows.

Up next

Step 2: Essential Theme Files – Core WordPress Theme Structure

Step 2: Essential Theme Files Create the core files required for a WordPress Full Site Editor theme using the 4WP Starter Theme* as our foundation for Personal Branding and Corporate sites. Project Foundation: Base Theme: 4WP Starter Theme* – FSE st...

More from this blog

You're a Tenant, Not the Owner: 6 Doors in Someone Else's wp-admin, and How Not to Be a Bad Neighbor

Originally published on 4wp.dev. The Premise wp-admin isn't yours. The owner is WordPress core, and every active plugin is a tenant with its own key to a shared apartment. The six hooks in this catego

Oct 1, 20266 min read

You're a Tenant, Not the Owner: 6 Doors in Someone Else's wp-admin, and How Not to Be a Bad Neighbor

GraphQL for Headless WordPress in Practice (4wp.dev Hooks Series): From First Query to Production

Most WPGraphQL tutorials end at the first query. This one goes further: a small Next.js (App Router) blog on top of headless WordPress, taken all the way to a production-ready setup. We'll build a pag

Sep 30, 20265 min read

GraphQL for Headless WordPress in Practice (4wp.dev Hooks Series): From First Query to Production

Enqueue Hooks: Four Hooks, Four Different Zones — and How Not to Mix Them Up

On the surface, these five hooks all do the same thing — load CSS/JS. But four of them sound almost identical while each one runs in a different zone of the site. Mix them up, and block styles leak on

Sep 24, 20264 min read

Enqueue Hooks: Four Hooks, Four Different Zones — and How Not to Mix Them Up

A Hook That Fires Twice — and How Not to Trigger an Infinite Loop When Saving a Post

The Problem A typical case: a developer hooks logic onto save_post — update a counter, sync an external service, recalculate something based on the post's fields. The code runs... and immediately runs

Sep 22, 20266 min read

A Hook That Fires Twice — and How Not to Trigger an Infinite Loop When Saving a Post

SOLID in WordPress: Auditing Our Own Plugin Catalog

WordPress makes it easy to write code that works and easy to write code that lasts, and those are not the same skill. Hooks, filters, custom post types, widgets — the platform hands you enough rope to build something maintainable or something that collapses the moment a second developer touches it. SOLID is the discipline that decides which one you get. Not as academic dogma imported from enterprise Java, but as five habits that map cleanly onto things WordPress developers already do every day.

Sep 9, 20265 min read

SOLID in WordPress: Auditing Our Own Plugin Catalog

4wp.dev

15 posts

Command Palette