AI-personalized resource center

Context

As part of a full redesign of the Mechanical Contractors Association of America’s website, the association needed to replace its legacy resource system. Years of member resources — training videos, webbooks, PDFs, management methods, safety materials — spanning multiple member organizations and topic areas had become hard to find, hard to browse, and hard for MCAA’s team to curate. The brief: migrate 900+ resources out of the legacy WordPress site without losing anything, give members a fast, modern way to search and browse the full library, and put day-to-day curation in the hands of MCAA’s editorial team — no developer required.

What I built

A Vue.js application embedded directly in MCAA’s WordPress site, with SearchBlox as the search engine for fast, relevant results across the full library. A custom migration script moved 900+ resources out of the legacy WordPress site into the new structure.

The Vue frontend talks to a custom WordPress REST endpoint rather than to SearchBlox directly. The endpoint builds the SearchBlox query from whatever the frontend asks for — a curated row, a keyword search, a set of taxonomy filters — then transforms the raw response into a single normalized shape that accounts for the different resource formats: streaming video, downloadable video, PDF, and multi-format resources. The frontend renders one consistent card model regardless of what the underlying resource is, and the search integration stays server-side.

Rather than a hard-coded page, the entire directory is a custom WordPress block configured through ACF fields — so curation lives with MCAA’s editors, not developers.

An editor-curated landing experience: members arrive to streaming-service-style rows of resources. Each row runs its own SearchBlox query, so it stays fresh automatically as new content is published. Rows can be driven by any taxonomy or combination of taxonomies, or editors can hand-pick specific posts and give the row a custom title — for featured collections and campaign-driven curation.

AI-powered personalization for logged-in members. I extended MCAA’s SSO process to capture custom member attributes at login, then used those attributes with OpenAI to perform a vector-based sort of the resource library — surfacing the resources most relevant to each member’s profile, with no manual tagging or rules to maintain.

A persistent filter panel with full keyword search across all resources and faceted filtering by taxonomy. Keyword and taxonomy filters combine for precise results.

Format-aware resource cards, driven by the normalized REST response: each card presents actions tailored to what the resource actually is — stream a video directly, download the video file, download a PDF — and when a resource is available in many formats, a popup shows every option in one place. Every card also links through to a full detail page.

Stack

Vue.js frontend embedded in WordPress as a custom block

SearchBlox search engine (per-row queries, keyword + faceted search)

Custom WordPress REST endpoint (SearchBlox query builder + format-aware response transformation)

OpenAI (vector-based personalization sort)

Advanced Custom Fields (editor configuration)

Custom SSO extension capturing member attributes at login

Custom migration script (legacy WordPress → new resource structure)

Outcomes

900+ resources migrated cleanly out of the legacy system, as part of a modern site built to grow with the organization.

Members get a fast, searchable, streaming-style browsing experience — and, when logged in, a personalized view of the library shaped by their own member profile.

MCAA’s editorial team can reshape the entire landing experience — reorder rows, swap taxonomies, feature hand-picked content — through familiar WordPress editing tools, with zero code changes.

Live at mcaa.org/resources.