Best Men’s Shirts to Wear with Khakis

Vermont Country Store — Oracle Commerce Cloud
Role: Frontend Developer / OCC Implementation
Live URL: [vermontcountrystore.com/signature-products-best-mens-shirts-to-wear-with-khakis](https://www.twine.net/signin

What This Was

A static editorial page in VCS’s Signature Products series built to drive discovery across the men’s shirts catalog by anchoring to a high-intent styling query. The page pairs wardrobe guidance — what shirt types work with khakis and why — with curated links to VCS’s men’s shirts collection, including the exclusive Orton Brothers line, flannels, polos, and button-downs.

What I Built

Structured the page around shirt type as the organizing logic — moving the shopper from casual to dressed-up across VCS’s catalog range: pocket tees, polos, short-sleeve button-downs, flannels, and Henley styles. Each shirt type was matched to a khaki use case (weekend, work-casual, outdoor) with direct product cross-links.

As with all OCC static pages in the Signature Products series, content architecture, copy direction, and cross-link strategy were developer-level decisions. Copy was written to match VCS’s voice — practical, unpretentious, built for a customer who values quality and longevity over trend. The Orton Brothers exclusive line was highlighted as a key differentiator, reinforcing private label value within the editorial flow.

Code Sample

The shirt-type-to-occasion mapping block, repeated for each style category:

<div class="style-match-row">
  <span class="shirt-type">Short-Sleeve Button-Down</span>
  <span class="match-arrow">→</span>
  <span class="occasion">Weekend Errands</span>
  <a href="/men/category/orton-brothers" class="cta-link">Shop Orton Brothers</a>
</div>

Constraints

• Vanilla HTML/CSS only — no framework, no custom JS
• Authored entirely through OCC Admin content editor
• Bound to VCS’s global stylesheet — no shared CSS modifications
• Images sourced from OCC media asset library
• SEO-optimized: question-adjacent H1 targeting men’s styling search intent

Why It’s Interesting

This page is a good example of using editorial format to serve both SEO and private label merchandising goals simultaneously. The styling guide format captures mid-funnel search traffic (“what to wear with khakis”), while the content is structured to foreground VCS’s exclusive Orton Brothers line — turning an organic content page into a direct driver for proprietary product discovery, all within the constraints of a static OCC template.

Oracle Commerce Cloud OCC Admin ATG HTML CSS Enterprise Ecommerce Content Architecture UX Writing SEO Private Label Merchandising

Role — Frontend Developer