CJW Dev Handoff · Mockup spec — not production

Dev Handoff · 03 Components

Every reusable block, with a live demo and Elementor mapping.

The mockup is composed almost entirely from the components below. Build each one as an Elementor template (or saved widget) once, then reuse across pages. The "Elementor" column tells you which widget family and which Global Style applies.

Component · header-utility-strip

Header — utility strip

Slim navy bar above the main nav. Carries the franchise endorsement (left) and clinic phone + address (right). Hidden on small screens.

Live demo

AMyoCore™FRANCHISE

5840 W Northwest Hwy, Irving|(469) 525-5300

Props / data fields

endorsementWordmark	image	MyoCore SVG; 'A …Franchise' wraps it
phone	string
addressShort	string

Elementor mapping

Theme Builder → Header (above-header section). Two columns. Hide on mobile.

Component · primary-cta

Primary CTA — Book $108 evaluation

Single highest-intent action across the site. Gold fill, navy text. Repeats in hero, sticky banner, end-of-page CTA, header (md+).

Live demo

Props / data fields

label	string	Default: "Book $108 Evaluation"
href	url	/contact or external scheduler
size	h-10 / h-12 / h-14

Elementor mapping

Use Elementor Button widget. Apply Global Style → 'Primary Gold'.

Component · trust-strip

Trust strip (3 bullets)

Sits under the hero headline. Three short phrases, each with a small gold check icon — VA & Medicare Accepted, Same-Day Appointments, No Referral Needed.

Live demo

✓VA & Medicare Accepted
✓Same-Day Appointments
✓No Referral Needed

Props / data fields

items

string[]

Exactly 3 items

Elementor mapping

Icon List widget with custom check icon (gold-700). Inline display on tablet+, stacked on mobile.

Component · talk-to-cj-inline

Talk to CJ — inline card

Conversational AI entry point in the homepage hero, under the trust strip. Gold mic avatar, 3 sample-ask chips, primary voice CTA, secondary chat CTA, AI disclaimer + clinic phone.

Live demo

●

Hi, I'm CJ.

Ask about hours, insurance, or booking.

Do you take Medicare?Same-day available?What's the eval?

Props / data fields

samplePrompts	string[]	3–4 short questions
voiceProvider	talktofred.ai \| vapi \| elevenlabs
phoneFallback	string	business.phone

Elementor mapping

Custom HTML/CSS block OR purchased CJ-provider iframe widget at 380×460px on desktop / full width on mobile. Match colors via Global Style.

Component · talk-to-cj-pill

Talk to CJ — floating pill

Persistent bottom-right entry to the same widget. Hidden while the popover is open (no stacked CTAs). Should be hidden on / (homepage hero already has the inline card).

Live demo

Props / data fields

hideOnPaths	string[]	Default: ["/"]
label	string	Default: "Talk to CJ"

Elementor mapping

Sticky position via Elementor Pro motion settings, or use a Hello+ floating button widget set to bottom-right. On click, open the popup containing the inline card.

Component · service-card

Service card

Used on Home, /services index, and 'Related services' on Service Detail. Image (object-top), service name, short blurb, optional duration/price chip.

Live demo

Spinal adjustments

Hands-on, drop-table, and instrument-assisted. Matched to your body.

Learn more

Props / data fields

name	string
short	string
photoSrc	url
duration?	string
price?	string
href	url

Elementor mapping

Loop Grid bound to a Service CPT. ACF fields: short, duration, price, hero_image.

Component · phone-frame

PhoneFrame video tile (9:16)

Reels-style 9:16 phone-frame container that holds an HTML5 video with poster. Used on /library and embedded on Service Detail pages. Optional 'Read full article' link below.

Live demo

What is ART?

0:38 · Education

Props / data fields

src	url (mp4)
poster	url (jpg)
title	string
duration	string
href?	url	Deep-link to /library/:slug
linkLabel?	string

Elementor mapping

Custom HTML widget OR Elementor Video widget inside a 9:16 rounded container. Add overlay caption + 'Read full article →' link below.

Component · patient-quote-card

Patient quote card

Hand-curated review card on /reviews. Avatar circle, 5-star row, condition tag, body, attribution, source label.

Live demo

Marcus T.

Sciatica · Google review

"Three months of sleeping in a recliner. Two visits and I was back in my own bed."

Props / data fields

name	string	First name + last initial only
rating	1–5
tag	enum: "Low back pain" \| "Sciatica" \| …
body	string
source	enum: "Google" \| "Facebook"
photoSrc?	url

Elementor mapping

Custom Post Type 'Patient Quote' with ACF fields. Loop Grid sorts by featured/date.

Component · filter-chips

Condition filter chips

Used on /reviews above the quote grid (and reusable on /library). Pills with live count badges. Active state filled navy with white text.

Live demo

All stories26Low back · 8Sciatica · 4Sports · 5Auto · 3

Props / data fields

options	{ key, label, count }[]
active	string
onChange	(key) => void

Elementor mapping

Use a Tab widget with custom CSS to render as pills. Or use a Filter widget if Loop Grid is in play.

Component · faq-accordion

FAQ accordion

Used on Service Detail, About, Insurance, Contact, BlogPost. Single-open behavior. Plain question + paragraph answer.

Live demo

Do I need a referral?

No. Texas is a direct-access state.

What if my insurance won't cover it?

Props / data fields

items

{ q: string; a: string }[]

Elementor mapping

Elementor Accordion widget. Apply Global Style → 'Editorial Accordion'.

Component · cta-banner

End-of-page CTA banner

Repeats on every public page above the footer. Dark navy with grain, headline, two buttons, address line.

Live demo

Ready to feel like yourself again?

Props / data fields

headline	string
primary	{ label, href }
secondary	{ label, href }

Elementor mapping

Theme Builder → Footer top-section. Static block with 2 buttons. Reuse Global Styles.

Component · footer

Footer

Logo + tagline (column 1), site nav (column 2), services (column 3), NAP + hours + endorsement (column 4). Bottom rule: legal + social.

Live demo

CJW Chiropractic

Las Colinas, Irving TX

About
Insurance
Library
Reviews

Spinal adjustments
ART
Sports

5840 W Northwest Hwy

(469) 525-5300

Mon–Fri · 8a–6p

Props / data fields

navItems	{label, href}[]
services	Service[]
socialLinks	{platform, href}[]

Elementor mapping

Theme Builder → Footer (4-col grid). Hello Biz default footer disabled.