Feyer is a musician based in New York City. He needed a new website to coincide with the release of his first full album.

Date: January 2012
Tech Stack: WordPress.org, WP Toolset
Responsibilities: Front-End Development, Design, Tutorials, Server Management
Type: Commercial

Project Link:
Feyer Music

Music
Feyer's new album, Signals Internalized, was a primary focus of his career as well as the website's branding. I added an easy way for fans to listen and then stream or buy the album officially.

Press Page
With modularity and flexibility in mind, the Press page has a front-end design that works with any content thrown into it. It also has a simplified and specialized backend workflow, making it easy for Feyer to edit.

Custom Press Loop

User Scenario

Feyer just had a press article written about his new song. He wants to quickly add it to his website without needing to worry about messing up the formatting and/or presentation of the other Press items.

Custom Press Loop Steps
  1. Feyer adds a new Press post and fills in a few designated fields are filled in with relevant information.
  2. The new post is active on the website and Feyer can go back to entertaining his fans.

How I Built the Custom Press Loop

Enlarge
A press post's custom field group.

During initial website creation, a new post type ("Press") was created.

  • Keeping the press posts away from the default posts meant that core WordPress functionality was not touched.
  • Creating a new post type enabled the creation of new custom fields (pictured to the side). These custom fields allowed for standardization and validation of information.

Enlarge
The result of step ①'s custom fields being filled out.

A view template for individual Press posts was created. This utilized the custom fields.


Enlarge
The main Press page with each Press post using the same view template.

A page template with a custom loop containing the Press posts got assigned to the Press Archive page. This ensured that as soon as a new Press post got added, it showed up on the website with designated formatting.

Typical Setups and Their Drawbacks

WordPress Set-ups

Oftentimes when WordPress sites have a Press page, they have two options (with their own drawbacks).

1: Build out a page with a visual editor plugin: This seems simple at first, but making sure that every item has the same visual settings can become a challenge the larger the Press list grows.

2: Use the core WordPress post functionality: This has the same scale problem as the first option, but also an create a challenge down the road if the client wants to actually use the default blog post functionality. Not only that, but out-of-the-box URL slugs will still read as post, instead of press.

Other Site Builders

Many website builders nowadays advertise building tools that don't require coding, however actually using these tools to get exact results you want can be difficult. This problem is increased further when mobile is factored in, and clients aren't sure why a change in desktop view also made a change in mobile view.

Additionally, there are many websites that don't allow for the editing of CSS, which makes it very difficult for clients to achieve their exact design visions.

Closing Notes

Overall, the upfront cost of this method was steeper than just starting off with a visual/WYSIWYG builder, however it absolutely saved time and stress in the long run.


Personality
I decided to take advantage of Feyer's frequent use of Instagram by adding his Instagram feed on the website. It's the perfect way to allow fans to get to know him while keeping the website updated with new content regularly.