Project 3: WordPress Variety Pack

🌎 Overview

Create two separate WordPress installs on your server. Then, use a different theme on each install to create:

• A commerce site
• A content site

🧠 Rationale

Two big thoughts behind the design of this project:

1. WordPress is an incredibly powerful and versatile tool! So, we wanted to give you an opportunity to get a sense of some of the different ways in which it can be used. A news site and an e-commerce site might seem pretty different at first blush (and they are!), but as you build the two together, we hope you’ll get an excellent sense of how the same tool—WordPress—is well-adapted for both.
2. As with many of the projects in this course, there’s immense value in doing something (in this case, creating a new WordPress install, finding a theme, customizing it, working with plugins, etc.) multiple times. The first time you do any new thing, you’re sort of just getting your bearings. The second (and any subsequent) time you do it, you’re reinforcing learning, optimizing workflows, and gaining new insights. Hopefully, this assignment—combined with your WordPress playground—will give you some of that invaluable practice.

🏗 Structure

Each install should be done in a separate folder inside your project-three folder:

• webdev/project-three/content
• webdev/project-three/commerce

Both of these installs must be separate from your WordPress playground install. When following the WordPress Starter Steps for these two new installs, you’ll need to specify these in the directory field under location following the specified file path outlined above. Pay attention here: moving a WordPress site is totally possible, but a little bit of a pain. Better to do it right the first time!

You’ll also update the index.html page at yoursite.com/webdev/index.html to contain your reflection for Project Three.

📺 Content

As always, you can choose any topic you like for your sites. You’re welcome to dream up your own publication/store or knock off an existing one.

For both sites, you’ll need to create enough content (articles or items for sale) to create a convincing home page, but only 3-4 of those articles/items for sale need to be fully complete. For example: aim for 6-8 items in your store and 8-10 news stories on your news site.

Note: Some themes come with demo content. You may use the demo content to help you get started working with a theme, but you may not use the theme's demo content as your content for this project.

For your content site, it’s fine for most stories to contain only a headline, featured image, and intro paragraph—the things that make a story look complete on the home page. But, pick 3-4 stories to flesh out more fully so that you can get a sense of all the ways you can use WordPress to shape a story—different blocks, page templates, etc. Note: You do NOT have to write the content yourself; it’s fine if you borrow content from the web, but throw a little acknowledgment in there so your source is clear. I’m more concerned with how you are constructing the page than the content of your news stories! 1

For your commerce site, it’s similarly fine for most items for sale to contain only a name, featured image, and price. But, do pick a few items (say, 3-4) to fully flesh out—perhaps include marketing copy, a video embed, customer testimonies, and customizable varieties (sizes, etc.). Also, for your commerce site, it’s important to note that we expect you not to actually set up a functioning store. 🤑 2

📓 Grading (15 points total)

✅ Required Elements (7.5 points)

Content site

Each content site must include

• A home page
• A page focused on a specific topic (a section/feature/etc.), using categories
  • Watch this short video explaining how to display posts on a page
• Multiple stories (roughly 8-10) 3
• 3-4 story posts fully fleshed out
• Use of a variety of blocks
• Customization of the theme using additional CSS

Commerce site

Each commerce site must include:

• A home page
• A page listing multiple products (a collection/section/etc.)
• Multiple products for sale (around 6-8)
• 3-4 of those products are fully fleshed out
• Use of a variety of blocks
• Customization of the theme using additional CSS

😍 Qualitative Elements (3 points)

In general, I’ll be assessing your projects qualitatively on the appropriateness of your chosen themes to each site’s purpose and your intelligent use of WordPress features (custom CSS, plugins, widgets, etc.). And as always, I’ll be assessing overall effort and care, as well as creativity and ambition.

Additional qualitative elements for each site might include:

Content site

• The use of additional media types typically seen on real content sites such as videos, interactive infographics, and audio snippets
• The use of tools that real media publications might include such as suggested / related story blocks, email newsletter sign-ups, etc.
• Creative and appropriate use of plugins/widgets/custom CSS

Commerce site

• The use of additional media types typically seen on commerce sites (videos, GIFs, 3D views)
• The creation of content typically found on e-commerce sites (product stories, sales, customer reviews, etc.)
• Creative and appropriate use of plugins/widgets/custom CSS

🤔 Reflection (1.5 points)

As usual, your reflection should generally discuss:

• New skills acquired
• Struggles faced
• Things you’re proud of (specifically address how you integrated the qualitative elements of the assignment)
• Additional things you’d like to learn/work on in the future

Write a reflection for both sites you create. Be sure to include the names of any plugins that you incorporated and the names of the themes that you used. Remember, your reflection doesn’t have to be long, but it should be thoughtfully constructed, and specific, and it should directly address how you moved beyond the required elements to create an exceptional website.

🛝 Playground (3 points)

Practicing is really important! Make sure that you’ve uploaded a playground for Bootstrap. Submission for this includes linking your work to your course homepage and uploading the files to the playground folder:

yoursite.com/webdev/playground

Submission

In addition to making sure that your sites can be found in the directory outlined under the Structure section, you should make sure your projects are linked on both the project-three home page and your course homepage.

Remember, you will not need to upload the WordPress sites to your server– that automatically happens when you create the installation. However, you WILL need to upload the project-three homepage and re-upload the wevdev homepage.

Your instructor will evaluate your project by visiting those URLs, so to double-check that everything’s in the right place, visit those URLs yourself, ideally in a separate browser or an incognito/private window to ensure that you aren’t falling victim to any caching issues. Check it once, and then check it again! If I can’t access your work it will be considered late.