The Guide To Using Componentized Pages
Grid
The grid is a group of components that are displayed together on the page in one section. All of the items in the grid should be the same type of component.
Heading: Appears above the grid
Heading Font
Subheading
Subheading Logo: Use for partner/sponsored pages
Layout: If you are creating a grid of cards (such as articles, classes, and/or products), you can choose Tile Hero for a fancier layout similar to the mindbodygreen homepage. Otherwise, choose Standard.
Background Color
Mobile Horizontal Scroll: On mobile devices, should there be one row that scrolls horizontally, or should the items all appear on the page each below each other?
Navigation Anchor: Allows you to scroll to this section from a nav bar/butotn
CTA Button: You can add a button below the grid
Items: Add items here. They should all be the same component type
Column Count: Control the number of items on each row for different screen sizes.
Person Grid
The heading for the grid
The subheading
Caley Alyssa
mbg Class Instructor & Yoga Teacher
Amy Shah, M.D.
Double Board-Certified MD & Functional Medicine Expert
Ash Wilking
RUMBLE BOXING INSTRUCTOR & NIKE TRAINER
Alisa Vitti
Women's Hormone and Functional Nutrition Expert
Biet Simkin
mbg Class Instructor & Meditation Teacher
Tile Hero Grid
Jamie Schneider
Which Mask Material Is Best For Your Skin? A Dermatologist Explains
Maskne. Need we say more?
Alexandra Engler
Why This Little Area On The Face Always Gets Dry & Red + How To Fix It
There are a few areas of skin that tend to get drier faster than others: knuckles, elbows, corners of the mouth, and—you guessed it—the nose.
Alexandra Engler
The Truth About Sensitive vs. Sensitized Skin + What To Do About It
Alexandra Engler
Sensitive Skin? Here Are 11 Stunning Eczema-Friendly Makeup Products
Alexandra Engler
Sensitive Armpits? Here Are 7 Top-Rated Natural Deodorants, Sans Baking Soda
Jamie Schneider
Are You Showering In Hard Water? Here's A Quick Test To Find Out
Product Highlights Grid
Our magnesium+ formula
MADE IN THE USA
B. LACTIS B420
Maintain healthy weight*
B. lactis B420 is a bacteria strain that encourages healthy weight through reduction in abdominal fat mass and waist circumference.*
10 BILLION CFUs | USA
JUJUBE
Calm overactive mind
Jujube is a fruit used in Traditional Chinese Medicine for calming and sedation, and supports healthy cortisol levels.*
225 mg
PHARMAGABA
Enhance sleep quality
PharmaGABA® is an extensively studied neurotransmitter shown in clinical trials to enhance natural sleep quality.*
100 mg
Testimonials Grid
Testimonials
What experts are saying about sleep support+
Any ounce of bloat I felt disappeared.
Melissa Wood
Health & Fitness Coach
If there's one product I'm crazy passionate about, it's a good quality probiotic. From the second I tried mindbodygreen's, any ounce of bloat I felt disappeared. probiotic+ optimizes my digestion, and I just overall feel amazing when I take it. The best part is knowing that I can always trust mindbodygreen with sourcing the best possible ingredients!
Any ounce of bloat I felt disappeared.
Melissa Wood
Health & Fitness Coach
If there's one product I'm crazy passionate about, it's a good quality probiotic. From the second I tried mindbodygreen's, any ounce of bloat I felt disappeared. probiotic+ optimizes my digestion, and I just overall feel amazing when I take it. The best part is knowing that I can always trust mindbodygreen with sourcing the best possible ingredients!
Any ounce of bloat I felt disappeared.
Melissa Wood
Health & Fitness Coach
If there's one product I'm crazy passionate about, it's a good quality probiotic. From the second I tried mindbodygreen's, any ounce of bloat I felt disappeared. probiotic+ optimizes my digestion, and I just overall feel amazing when I take it. The best part is knowing that I can always trust mindbodygreen with sourcing the best possible ingredients!
Articles Grid
Grid of Cards (Row of 4)
How Do You Know If You Have Sensitive Skin? Dermatologists Weigh In
Rebecca Dancer
Reviewed by Keira Barr, M.D.
Grids With Videos
Grids can also have videos either directly or on a card.
Jamie Schneider
Which Mask Material Is Best For Your Skin? A Dermatologist Explains
Maskne. Need we say more?
Alexandra Engler
Why This Little Area On The Face Always Gets Dry & Red + How To Fix It
There are a few areas of skin that tend to get drier faster than others: knuckles, elbows, corners of the mouth, and—you guessed it—the nose.
Alexandra Engler
The Truth About Sensitive vs. Sensitized Skin + What To Do About It
Alexandra Engler
Sensitive Skin? Here Are 11 Stunning Eczema-Friendly Makeup Products
Alexandra Engler
Sensitive Armpits? Here Are 7 Top-Rated Natural Deodorants, Sans Baking Soda
Grid of Cards (Row of 4)
How Do You Know If You Have Sensitive Skin? Dermatologists Weigh In
Rebecca Dancer
Reviewed by Keira Barr, M.D.