Mountain American Medical Technology — Website Content Guide

This site is built so that everyday content edits happen in one place: src/data/site-content.ts. You do not need to touch React components, CSS, or HTML to update products, training links, downloadable resources, navigation, or contact details.

Quick rule: If you want to change words, links, or lists on the site, edit src/data/site-content.ts. If you want to change layout, colors, or fonts, ask Lovable or a developer.

Where the content lives

Open src/data/site-content.ts in the Lovable editor (or any code editor). Everything is stored as plain text arrays and objects. The site reads from these objects automatically.

The most common sections to edit are:

Updating products

Products live inside the joernsGroups array. Each group has a label (e.g., “Bed Systems”) and its own products array.

Add a new product

Copy an existing product block, paste it inside the correct products array, and change the values:

{
  name: "Product Name",
  description: "Short description of the product.",
  icon: "BedDouble",
  image: "https://www.joerns.com/wp-content/uploads/2023/10/photo.png",
  productUrl: "https://www.joerns.com/product/product-name/",
},

• name — the product title shown on the card.
• description — one or two sentences shown under the title.
• icon — use "BedDouble" for beds, "Layers" for surfaces/mattresses, or "MoveVertical" for lifts/handling. This is only a fallback if the image fails to load.
• image — the real Joerns product photo URL. The site will display this photo on the card.
• productUrl — the link to the product page on joerns.com. It opens in a new tab automatically.

Remove a product

Delete the entire { ... } block for that product, including the trailing comma.

Change a product photo

Replace the image: URL with a new Joerns photo URL. Make sure the URL starts with https:// and ends in .png, .jpg, or .webp.

Add a new product group

If you ever need a whole new category (for example, “Respiratory”), add a new top-level object to joernsGroups:

{
  key: "respiratory",
  label: "Respiratory",
  icon: "Activity",
  products: [
    {
      name: "New Product",
      description: "Description here.",
      icon: "Activity",
      image: "https://www.joerns.com/wp-content/uploads/2023/10/photo.png",
      productUrl: "https://www.joerns.com/product/new-product/",
    },
  ],
},

Updating the training / video link

The site no longer hosts its own video library. Instead, the Training section links to Joerns’ official training video page.

To change that link, edit the brand object at the top of src/data/site-content.ts:

export const brand = {
  // ... other fields ...
  joernsTrainingUrl: "https://www.joerns.com/resources/?doc_cat=training",
};

Replace the URL with the new Joerns training page URL. The Training section button will use it automatically.

Updating resources / downloads

Downloadable resources are listed in the resources array near the bottom of src/data/site-content.ts.

Add a new download

{
  title: "Resource Title",
  description: "One-line summary of what the file covers.",
  href: "/resources/filename.pdf",
},

• title — the link text shown on the site.
• description — a short sentence explaining the file.
• href — the path to the PDF. If the file lives in the project’s public/resources/ folder, use /resources/filename.pdf.

Upload the actual PDF

1. Place the PDF in public/resources/ (create the folder if it does not exist).
2. Make sure the href in resources matches the filename exactly, including capitalization and spaces.

Example: a file named support-surface-selection-guide.pdf in public/resources/ should use:

href: "/resources/support-surface-selection-guide.pdf",

Remove a resource

Delete the entire { ... } block for that resource.

Updating other common content

Company contact info

Edit the brand object:

export const brand = {
  name: "Mountain American",
  nameSecondLine: "Medical Technology",
  phone: "(385) 323-1315",
  email: "consult@mountainamericanmedical.com",
  location: "Salt Lake City, UT — serving the Mountain West and West Coast",
  // ...
};

Navigation links

Edit the nav array. Each entry looks like:

{ label: "Home", href: "/#top" },

• Use /#section-id for homepage anchor links.
• Use /page-name for separate pages like /products.

Hero stat boxes

Edit the heroStats array. Keep four items for the best visual balance.

Solutions cards

Edit the solutions array. Each solution has a heading and an items array. Each item needs:

{
  icon: "Activity",
  title: "Card Title",
  description: "Card description text.",
}

Allowed icon names come from the Lucide icon set. Common ones already used: Activity, Layers, GraduationCap, BedDouble, MoveVertical, Grid2X2.

Tips for safe edits

1. Keep commas in the right places. Every object in an array ends with a comma except the last one.
2. Use straight quotes. Copy/paste from Word or email can turn " into curly quotes (“ ”). Curly quotes will break the file.
3. Check URLs. Product and training links should start with https://.
4. Match filenames exactly. PDF names in href must match the actual file name in public/resources/.
5. Preview before publishing. Save the file, then look at the live preview. If something looks wrong, undo the last change and compare with the block above or below it.

Publishing changes

In Lovable, edits to src/data/site-content.ts are picked up automatically in the preview. To make them live on your public site, click Publish in Lovable.

If you are working locally, push the edited file to GitHub and redeploy.

Need help?

If a product photo is not showing or a download link is broken, check the URL/filename first. If the layout looks off after an edit, the most common cause is a missing or extra comma, bracket, or quote.