Overview
WordPress is much more than a blogging platform. It’s a powerful content management system (CMS) that can support everything from online publications to e-commerce stores. As AI becomes more integrated into website-building workflows, it’s also important to understand when these tools are useful, when they aren’t, and how to use them responsibly.
For this project, you’ll create one WordPress website that combines content publishing and e-commerce. You’ll explore WordPress’s native features, customize your website using the Block Editor and Site Editor, incorporate WooCommerce, and experiment with different approaches to building and managing your website, including AI-assisted workflows if you choose.
The goal isn’t to build the next Amazon or New York Times. It’s to get comfortable working with WordPress, understand what it can do, and develop the skills and judgment to make thoughtful decisions about the tools you use.
Rationale
Three big thoughts behind this project:
- WordPress is incredibly versatile. A news publication and an online store might seem pretty different, but WordPress can handle both within the same installation. Building a website that combines these functions will help you understand how WordPress manages different types of content.
- There’s a lot of power built right into WordPress. Before reaching for another plugin or third-party tool, it’s worth understanding what WordPress can already do. We’ll focus on native blocks, patterns, templates, navigation, and customization tools to help you develop a solid foundation.
- Building websites requires both creativity and technical judgment. AI is becoming another tool in the web developer’s toolkit, but it doesn’t replace the need to understand how websites work or make thoughtful creative decisions. This project encourages you to experiment with different approaches, evaluate their usefulness, and develop confidence in your own WordPress skills.
As always, there’s tremendous value in experimenting. Your WordPress Playground will give you additional opportunities to explore features and try things without worrying about breaking your main project.
Structure
Create one new WordPress installation on your server using the WordPress Starter Steps.
Your installation should live at:
yoursite.com/webdev/project-three/
This should be a separate installation from your existing WordPress Playground.
Choose a topic that can reasonably support both editorial content and an online store. For example:
- A music publication with articles, reviews, and merchandise
- A travel website with destination guides and travel products
- A food website with recipes, restaurant features, and kitchen supplies
- A photography website with tutorials, photo essays, and prints
- A fictional brand with a blog, news updates, and products
Feel free to get creative! Your content and products don’t have to be real, but your website should feel like a cohesive experience.
Remember, this is a web development course, not a content writing course! You’re responsible for developing your website’s concept, audience, visual identity, and overall experience, but you don’t have to write every word from scratch. You may create original content, use appropriately credited existing material, or use clearly labeled AI-generated sample content. The goal is to give yourself realistic material to work with as you learn WordPress.
You’ll also update your Webdev homepage at yoursite.com/webdev/index.html with a link to your completed project and reflection.
Content
Your website should combine two distinct experiences: a content section and a commerce section.
Content Section
Create a blog, publication, news section, or another collection of editorial content.
Aim for approximately 6–8 posts, with at least 3 fully developed posts.
Your content section should include:
- A page that displays your posts
- At least two categories to organize your content
- A category-focused page or section that displays relevant posts
- Featured images and excerpts
- A variety of WordPress blocks within your posts
Not every post needs to be a masterpiece! It’s fine for some to contain a headline, featured image, and introductory paragraph. However, your three fully developed posts should demonstrate your ability to create engaging layouts using different blocks, media, and formatting options.
You may use AI-generated sample copy to help populate your website, but any AI-generated content should be clearly labeled (for example, “This is sample copy generated by AI”). If you borrow sample content from elsewhere on the web, be sure to cite your source.
Don’t simply leave the default sample content that comes with a WordPress theme or template in place. The goal of this assignment isn’t to produce polished writing, but to gain hands-on experience building and designing pages and posts in WordPress. Your content gives you something to work with as you experiment with blocks, layouts, formatting, and other design features. What’s important is that you’re actively creating and customizing those experiences rather than relying on prebuilt content and layouts.
In other words, you don’t have to create original content, but you do need to do the work of building and customizing how that content is presented.
Important: Your articles should be created as WordPress posts, not pages. Explore how WordPress organizes and displays posts automatically.
Commerce Section
Install and configure the WooCommerce plugin to add an online store to your website.
Create approximately 4–6 products, with at least 2 fully developed product listings.
Your commerce section should include:
- A shop page displaying your products
- Product images, descriptions, and prices
- At least one product category
- Two detailed product listings with additional content or features
- An appropriately customized shop experience
Consider experimenting with product variations, galleries, detailed descriptions, reviews, or other WooCommerce features.
You do not need to configure real payments, process transactions, or launch an operational business. This is a demonstration store.
As with your editorial content, product names and descriptions may be fictional, original, or AI-assisted. Your focus should be on learning how WooCommerce organizes products and supports an effective shopping experience, not on writing perfect marketing copy.
Exploring WordPress’s Built-In Tools
WordPress has evolved considerably, and many features that once required plugins can now be accomplished using tools built directly into WordPress. These are sometimes called native features. Before adding plugins or other third-party tools, it’s worth exploring what WordPress can already do on its own.
For this project, explore and incorporate:
- Block Editor: Use a variety of blocks to create interesting, purposeful page layouts.
- Site Editor: Choose a compatible block theme and customize your site’s overall appearance.
- Global Styles: Establish a consistent visual identity using typography, colors, and spacing.
- Patterns: Create or customize at least one pattern that can be used within your site.
- Navigation: Build a functional navigation system that connects the content and commerce portions of your website.
- Templates: Explore how WordPress templates control the appearance of different types of content.
- Custom CSS: Make at least one meaningful CSS customization beyond the theme’s default settings.
Try to use native WordPress features whenever possible. Additional plugins are welcome when they serve a specific purpose, but installing plugins isn’t a substitute for understanding WordPress itself.
Exploring AI-Assisted WordPress Workflows
Building a website involves more than adding content to pages. You’ll encounter design decisions, technical challenges, unfamiliar features, and opportunities to improve how your website works. Part of becoming a confident web developer is learning how to use tools and resources that can help you work more effectively.
AI is increasingly becoming part of that toolkit. For this project, you’ll explore how tools like ChatGPT, Claude, or WordPress AI integrations can support your website-building process, while keeping your own creativity, judgment, and technical understanding at the center of your work.
Complete two focused experiments that explore how AI or other tools can help you accomplish a task, solve a problem, or improve your WordPress website.
Your experiments might involve:
- Content: Use AI to generate sample copy, post excerpts, or product descriptions. Evaluate the results, make any necessary adjustments, and incorporate clearly labeled sample content into WordPress.
- Design: Ask AI to suggest different approaches to a page layout, navigation structure, or visual hierarchy. Evaluate its recommendations and implement your own design decisions using WordPress.
- Troubleshooting: Use AI to help diagnose a WordPress problem, explain an error message, or troubleshoot a CSS issue. Test its suggestions and document what worked (or didn’t!).
- Learning WordPress: Ask AI to explain an unfamiliar feature, such as Query Loops, templates, or patterns. Use what you learn to experiment with the feature yourself.
- Accessibility and usability: Use AI to help identify potential accessibility concerns or suggest improvements to your website’s organization or usability. Evaluate and test its recommendations before implementing changes.
At least one experiment should focus on design, functionality, troubleshooting, or learning WordPress rather than simply generating content.
Your experiments can build on features you’re already required to use in this assignment. For example, you might use AI to help you understand Query Loop configurations or troubleshoot a CSS customization. You don’t need to add entirely new features just to satisfy this requirement.
For each experiment, document the following in your reflection:
- What you wanted to accomplish or learn
- What tool you used and how you used it (include an example of your prompt or interaction, if applicable)
- What the tool suggested or helped you discover
- How you evaluated, tested, or modified its suggestions
- What you learned from the experience
Remember, the goal isn’t to let AI build your website for you. It’s to explore how emerging tools can support your workflow while you continue developing your own WordPress skills. You should be able to explain and understand the changes you make to your website, even when AI helps you figure out how to make them.
Prefer not to use AI? That’s okay! You can meet these requirements by completing two similar workflow experiments using other resources, such as WordPress documentation, tutorials, or developer tools. For example, you might compare different approaches to building a Query Loop, follow documentation to troubleshoot a CSS problem, or explore how a WordPress pattern can streamline your design process. The same expectations for experimentation, evaluation, implementation, and reflection apply.
For more context about AI-assisted workflows, creative ownership, and professional website development, review our companion lesson on AI and WordPress.
Grading (15 points total)
✅ Required Elements (7.5 points)
WordPress Setup and Design (1.5 points)
- One WordPress installation in the required directory
- A cohesive homepage and functional navigation
- A customized block theme using the Site Editor and Global Styles
Content Section (2 points)
- A content page displaying approximately 6–8 posts
- At least 3 fully developed posts
- At least two categories
- Effective use of blocks, featured images, and other media
Commerce Section (2 points)
- WooCommerce installed and configured
- A shop page with approximately 4–6 products
- At least 2 fully developed products
- Appropriate use of product categories and WooCommerce features
Native WordPress Features (1 point)
- A customized pattern and meaningful CSS modification
- Demonstrated exploration of templates, blocks, and other native tools
AI Exploration (1 point)
- Completion of two AI experiments
- Evidence of evaluating and manually improving AI output
- Documentation of experiments in your reflection
Qualitative Elements (3 points)
As always, I’ll assess your project qualitatively based on effort, creativity, ambition, and your intelligent use of WordPress.
A strong project should feel like a cohesive website rather than two unrelated assignments sharing the same installation.
Consider ways to go beyond the required elements:
- Create custom layouts or reusable patterns
- Incorporate video, audio, galleries, or other media
- Improve your website’s accessibility and responsive design
- Explore additional WooCommerce features
- Incorporate appropriate plugins that add meaningful functionality
- Use a Query Loop block to display posts dynamically, including a category-specific collection.
- Install and explore the WordPress AI plugin to experiment with AI integration
- Develop a distinctive visual identity
The goal is to show that you’ve taken the time to understand and thoughtfully apply what WordPress has to offer.
Your creative decisions should remain your own, whether or not you use AI assistance. I’m interested in how you use the tools available to you, how you solve problems, and how you develop a website that reflects your own ideas and intentions.
WordPress Playground (3 points)
Keep experimenting with your existing WordPress Playground!
Your Playground is a separate space for exploring WordPress features, experimenting with themes and plugins, and testing ideas without worrying about breaking your main project.
Continue developing your Playground throughout this project. You should demonstrate meaningful experimentation with features or tools beyond those required for your main website.
Your Playground will be evaluated based on the extent of your exploration, experimentation, and effort. Simply maintaining the installation without adding anything new won’t earn full credit.
Reflection (1.5 points)
As usual, your reflection should address:
- New skills acquired
- Struggles faced
- Things you’re proud of, especially how you went beyond the required elements
- Your two WordPress workflow experiments: what you tried, what happened, and what you learned
- Additional things you’d like to explore in the future
Include the name of your WordPress theme and any plugins you used.
If you used AI during the project, briefly explain what you used it for and how you incorporated or modified its output. Remember to clearly label AI-generated sample content on your website and cite any borrowed content from other sources. If you chose not to use AI, you don’t need to justify that decision.
Your reflection doesn’t need to be long, but it should be thoughtful, specific, and demonstrate what you learned through the process.
Your reflection should be accessible on your Webdev homepage.
Submission
Your completed WordPress website should be accessible at:
yoursite.com/webdev/project-three/
Make sure your project and reflection are linked from your Webdev homepage at:
yoursite.com/webdev/index.html
You’ll also submit your project through our Project 3 homepage, following the usual course submission process.
Remember, your WordPress website is already on your server once you’ve created the installation. However, you’ll still need to update and upload your Webdev homepage and any additional HTML files required for your reflection or project links.
Your instructor will evaluate your project by visiting your submitted URLs. Before submitting, open your site in a private or incognito browser window and make sure everything works, including your navigation, content pages, product listings, Playground, and reflection.
Check it once, and then check it again! If your instructor can’t access your work, it will be considered late.