Portfolio: per-agency Website Relaunch

Project Overview

A highly customized, performance-oriented WordPress theme developed for a digital agency. The project focuses on a modular design system, allowing for flexible page creation while maintaining strict design guidelines and high performance.

Technology Stack

• Core: WordPress (Custom Theme Development)
• Backend: PHP, MySQL (MariaDB)
• Frontend: SCSS (SASS), JavaScript (ES6+), Anime.js
• CMS Customization: Advanced Custom Fields (ACF) Pro
• Build Tools: NPM (node-sass, postcss, uglify-js, svgo)
• Environment: Docker (Docker Compose)

Key Features

Modular Design System

Implemented a comprehensive library of reusable content modules using ACF Flexible Content. This allows content editors to build unique page layouts by combining pre-defined, styled components.

Custom Content Management

Extended WordPress core functionality with Custom Post Types (CPTs) to structure complex data:

• Cases: Portfolio items with dedicated archive and detail views.
• Services (Leistungen): Detailed service descriptions.
• Jobs (Karriere): Recruitment section with location filtering.
• Staff: Team member profiles.
• Locations (Orte): Taxonomy for filtering content by agency location.

Performance & Optimization

• SVG System: Custom SVG icon management to inline SVGs for fast loading and styling flexibility.
• Asset Optimization: Automated build pipeline for minifying CSS and JS, and optimizing SVGs.
• Bloat Removal: Extensive cleanup of default WordPress assets to minimize request count and page size.

Development Workflow

• Dockerized Environment: Consistent local development environment ensuring parity with production.
• Component-Based Architecture: Template parts organized by functionality, promoting code reusability and maintainability.
• SCSS Architecture: Modular CSS structure with separate builds for frontend and admin styles.