MXP Demo Site

Welcome

Welcome to the Demo Website! This site is designed to showcase the features and functionalities of the Mars Experience Platform in a realistic environment. You will find interactive elements and sample content that visually accompany the Mars Brand Site Storybook.

Although this site is built on the Pet Nutrition system and utilizes a sample brand theme, the individual components are designed to flex across all brand segments. If you have any questions or need assistance during your visit, please feel free to reach out to your Mars representative.

Components

A

Accordion

A vertically stacked list of items to help arrange content compactly and display only when the user wants to see the details.

Age
Calculator

An interactive tool available on the Pet Nutrition platform is designed to inform users about the age of his/her pets based on their answers to pre-defined questions.

Alert
Banner

A prominent visual element designed to capture user attention and convey important information. It can drive to any page on or off the site. It is also referred to as a notification bar or announcement banner.

Article
Card

Article Cards drive to associated Article Detail Pages.

B

Breadcrumbs

A navigational aid helps users understand their location within the site's hierarchy by providing a visual trail to show the path taken to reach the current page.

BCS
BCI Tool

A weight management tool designed for Pet Nutrition brands.

Back
to Top

A navigational element that allows users to return quickly to the top of the page upon click when scrolling content.

Breed
Selector

An interactive tool available on the Pet Nutrition platform is designed to help potential pet owners find the most suitable breed based on their answers to pre-defined questions.

(open in new tab)

C

Campaign
Form

A type of display tool used to collect information from visitors to meet specific brand campaign requirements.

Carousel
Component

A display of media (images and/or videos) with associated descriptions users can flip through. It can house multiple media items in a single component without the page growing too long.

Carousel
Filter

Dynamically creates a carousel based on the site taxonomy/filters.

Circular
Image Tabs

Designed to display extensive information for multiple items upon user interaction in a concise format.

Compare
Grid

Provides a comparison (side-by-side) view of product specifications.

Contact
Help Banner

Provides a quick way to contact the brand and corporate by phone, email, or social media without taking them to the Contact & Help page.

Contact
Form

A webform component that allows users to communicate with the brand directly through the website.

Content
Feature

A large component used to grab a user’s attention and redirect them to an Article or Campaign. Designed to highlight and drive specifically to content (not directly to products) within the site. It’s full-width, so using captivating imagery is recommended.

Cookie
Banner

Automatically appears when a visitor comes to any brand site for the first time. Its primary purpose is to inform users about the use of cookies on the site and allows them to give consent for Mars to collect their data.

Entity
Locator

This tool helps users find retail store information and map directions based on their location.

Entry
Gate

The initial point of access to the website when a user visits for the first time. Consumer entry data is required for select markets based on regulatory guidelines.

External
Link Pop Up

The user interface element helps creating caution and appears when a user clicks on a link that directs them to a website outside the current domain.

Error
Page Block

Automatically appears when users click/tap on a page that is broken, not linked, or malfunctioning.

13 results

All products..

Feedback
Block

This module serves as a customer service function, allowing users to submit feedback or contact a brand to provide additional information.

Flexible
Driver

A flexible component used to break up the page and drive to off-site or on-site content. It supports a smaller image treatment (no full-width background image) that is less visually immersive.

Flexible
Framer

Most commonly used component across the brand sites and is incredibly flexible (true to its name) with multiple variations for different content needs, from driving to brand initiatives (on or off-site) or to specific products.

Food
Finder Tool

An interactive tool on the Pet Nutrition platform is designed to provide product suggestions based on customer data.

Subheading

Item title 1

This is the description

Subheading

lorem ipsum2

This is the description

Master

Testing for image in home page standard

NUTRO™ GREATER

Healthy Soil Feeds our Future

Learn More

Passion for GreatFood

Show Read more text in description for mobile Show Read more text in description for mobile

SHOP NOW (opens in new window)

LET'S GROW HEALTHY PETS™

At NUTRO™, we believe in growing healthy dogs. Whether your dog is a small breed, a large breed or anywhere in between, NUTRO™ dog food harnesses the goodness of nature to help them live a full and active life.

Nutro

At NUTRO™, we believe in growing healthy dogs. Whether your dog is a small breed, a large breed or anywhere in between, NUTRO™ dog food harnesses the goodness of nature to help them live a full and active life.

(opens in new tab)

95427 7 M3P MULTI NR PortfolioCulinaryWet Hero Carousel Component MBL 767x530 Slide 3 FNL

test only image

Testing homepage hero block

video

homepage hero no block

95427 7 M3P MULTI NR PortfolioCulinaryWet Homepage Hero Block TAB 768x580 FNL

GET YOUR DING BACK image+text

Flexible Driver

This is for testing purpose

Explore

Eyebrow

Header Test 1

A Special Animal-Assisted Therapy Program Greece

This provides an opportunity to expand this highly significant initiative, with even more dogs and a greater number of patients. The support and funding from the Royal Canin Foundation enable to ensure the continuous and smooth operation of the program, as well as the training and care of therapy dogs, until 2025.

EXPLORE

Disease Detection By Dogs France

WHAT DOES THE PROJECT SOLVE?Kdog wants to develop a clear and effective methodology for medical detection by dogs through 5 research programs, while ensuring it is repeatable, reliable, and ethical, wherever it is implemented.

EXPLORE

9 TIPS FOR KEEPING YOUR DOG HEALTHY

9 TIPS FOR KEEPING YOUR DOG HEALTHY AND SAFE THIS WINTER

EXPLORE

NEW

Eyebrow

Article Page

Article description: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

EXPLORE