Barrel — A Surf-Inspired WordPress Theme Built from Scratch
A custom WordPress theme designed and developed in PHP during my studies at Portland Community College — inspired by a summer learning to surf and built for the simplicity, edge, and visual energy of surf shop culture.
Overview
A summer learning to surf — and a WordPress theme built to show for it.
During my last term at Portland Community College, I took an intensive WordPress development course where the assignment was simple: build a theme from scratch based on an original idea. That summer I had started learning to surf, and the aesthetic of surf culture — clean lines, bold photography, easy navigation — felt like a natural fit for a theme concept. Barrel was designed for surf shops that wanted something simple, edgy, and visually driven without sacrificing usability.
The theme was built entirely in PHP, HTML, and CSS — from a detailed mockup through wireframes to a fully functional WordPress theme. The layout was deliberately row-based, keeping the structure clean and the div management manageable while still giving shop owners plenty of widget areas to work with. My professor used it as an example of strong student work, which made the challenge feel worth it.
The Assignment
Build a WordPress theme from scratch — concept, design, and code.
The brief was intentionally open-ended: choose a concept, design a theme around it, and build it in PHP from the ground up. No templates, no page builders — just a working WordPress theme built with real code.
The Work
From mockup to functional WordPress theme — designed and built solo.
The process moved from a detailed visual mockup through wireframes and into PHP development. Every major layout decision was made with the end user in mind — a surf shop owner who needed something that looked great, was easy to update, and didn't require a developer to maintain.
Design & Mockup
Adobe Photoshop Adobe IllustratorThe mockup established the full visual direction — bold surf photography, clean typography, a strong header, and a row-based layout that kept the structure simple without feeling sparse. A detailed wireframe followed, mapping out where every div began and ended before a single line of PHP was written.
Image placeholder — Mockup
Image placeholder — Wireframe
The Built Theme
WordPress PHP HTML & CSSThe final theme included a full homepage with featured content areas, shop categories, an about section, contact page, and blog. Multiple widget areas gave shop owners flexibility without complexity. The responsive layout ensured the theme worked cleanly on mobile — important for a surf culture audience that lives on their phones.
Image placeholder — Mockup
Image placeholder — Mockup
Reflection
What this project taught me.
Barrel was one of the most technically challenging things I had tackled up to that point — and one of the most rewarding. Building a WordPress theme from scratch in PHP forced me to think about design and development simultaneously, which deepened my understanding of both. The row-based layout decision that seemed simple on paper turned out to be the right call — it kept the code manageable and the design consistent. Having my professor use it as a class example reinforced something I've carried forward ever since: that doing the work carefully and completely, even when no one is watching, is what separates good work from work that just gets done.