Case Study Nonprofit

Patients find a provider and a clinic in a few taps, in English or Spanish

For a community health center, the website is how people get to care. We built Friend Family Health Center's site around the questions a patient arrives with, and so that staff can keep every answer current themselves.

  • 2018 client since
  • 6 clinic listings, each with a map
  • 10 specialties to filter by
  • 2 languages on every page

For a community health center, the website is how people get to care

Friend Family Health Center, which now goes by Friend Health, runs community health clinics in Chicago. Its stated mission is "To improve community health by providing access to high-quality, whole person care."

A health center's website has a practical job. The person using it is usually a patient, or someone looking after one, often on a phone, with a plain question: who can I see, where are they, and when are they open? The health center tells patients that appointments are encouraged and walk-ins are welcome, so a wrong address or an old set of hours can mean a wasted trip.

Behind the site is a small staff with plenty else to do. Providers join and leave. Clinics change their hours. Each of those changes has to show up everywhere the public might look.

A list of providers is no help if you cannot tell who is near you

The health center has several clinics and a wide range of care, from pediatrics to dental care to behavioral health. A parent looking for a pediatrician close to home should not have to read every provider's page to find one. They need to say where they are and what they need, and see who fits.

Language matters too. The health center offers its site in Spanish as well as English, and a patient who prefers Spanish should not have to hunt for that choice. If the switch is buried in a footer, the people who need it most are the least likely to find it.

Then there is the staff's side. The same provider shows up in the directory, on the page for each clinic where they practice, and on the page for each service they offer. If those are three separate places to update by hand, sooner or later one of them is wrong, and the patient who trusted it makes the wasted trip. Staff needed to make routine changes themselves, without calling a developer each time someone joined the practice.

We built it around the questions a patient arrives with

Who can I see? The provider directory opens with two choices: a clinic and a specialty. A patient picks one or both, and the list narrows to the providers who match. Each provider is shown with their specialties and the clinics where they practice, so the answer to "who, and where" is on one screen.

The provider search on the health center's website, with one menu for location and one for specialty
Two choices narrow the list: a clinic and a specialty.

Where, and when? Every clinic has its own listing with the address, the phone number, the hours for each day, the services offered there, and a link that opens directions. A map at the top of the page shows all of the clinics at once, so someone new to the health center can see which one is closest.

A map of Chicago with a marker for each of the health center's clinics
The clinic map sits at the top of the locations page.

Can I read this in Spanish? The language switch sits in the header of every page, beside the main menu. We put it there so it is one of the first things a Spanish reader sees. The translation is automatic, so a page staff publish in English is available in Spanish right away.

Staff enter each fact once. Providers, clinics, and services are linked behind the scenes. When a provider joins, staff create one entry and choose that person's clinics and specialties. The directory, the clinic pages, and the service pages all read from that entry, so there is nothing to keep in step by hand. Staff also build and rearrange pages from a set of ready-made sections, so a new program page does not wait on us.

Staff keep it current, and patients get a straight answer

Today a patient can get from the home page to a provider at a nearby clinic, with that clinic's hours and a map, in a few taps, in English or Spanish. When a provider joins or a clinic's hours change, staff make the change once, and it is right everywhere.

We are still the health center's web team. Our part now is the quiet work underneath: hosting, updates, and small changes when staff ask for them. The site carries the organization's new name, and the job it does for patients is the same as it was on the first day.

What changed

  • A patient narrows the provider list by clinic, by specialty, or both
  • Every clinic shows its address, hours, phone number, services, and a map
  • Spanish is one tap away, in the header of every page
  • Staff add a provider once, and it appears everywhere it should

Under the hood

For the developer evaluating us
  • 3linked content types
  • 13page layouts staff can build
  • 117custom fields in 7 groups
  • 50+style source files
  • 76.9KBfront-end JavaScript, total
  • 18plugins, kept lean

What We Built

  • Provider directory filtered by clinic and specialty
  • Clinic pages with hours, services, and maps
  • English and Spanish switch in the site header
  • Linked providers, clinics, and services, entered once
  • Page sections staff assemble without a developer

The content model

Three custom content types (personnel, services, and locations) are joined by ACF relationship fields. A personnel entry points to its services and locations, and each of those points back, so every listing is a query and nothing is duplicated. A toggle on each personnel entry controls whether that person appears in the public directory.

The provider directory

A dedicated page template with two dropdowns, populated from the location and service content types. A selection runs a query against the relationship fields and returns matching providers as a responsive grid.

Clinic maps

Each location stores a geocoded address in an ACF Google Maps field. The same field drives the map of all clinics and each clinic's own listing, so an address is entered once.

Translation

GTranslate, configured for English and Spanish, with the switcher placed in the site header.

Theme and front end

A custom theme written from scratch on Bootstrap 5, with no starter theme underneath. Bootstrap's own JavaScript handles the interactive pieces, so jQuery is not loaded and the whole front-end JavaScript payload is 76.9KB. Pages are assembled from 13 ACF flexible layouts with shared options for background, width, and spacing.

Hosting

Managed cloud hosting behind Cloudflare Enterprise (WAF and CDN), with Breeze page caching, Imagify image optimization, and Imunify360 on the server.

Figures current as of September 26, 2026

More stories like this

Want a web partner who picks up the phone?

Tell us what your site needs to do, and we will tell you how we would approach it.