> ## Documentation Index
> Fetch the complete documentation index at: https://docs.actionx.top/llms.txt
> Use this file to discover all available pages before exploring further.

# Example showcase

> Browse the Example section and open each demo as its own documentation page.

This page demonstrates a simple but important point: Mintlify pages are not limited to static Markdown. You can combine standard MDX content with custom coded components to build richer product demos directly inside your documentation.

This section reuses one handbag Q\&A scenario and one shared product dataset, then turns that same payload into many different product experiences. Each demo now lives on its own page, so the left documentation sidebar works as the primary example menu.

Use this overview page as a quick map, then open the individual demos from the cards below or from the sidebar.

## What this pattern is good for

* Showing multiple integration outcomes without sending readers to an external demo site
* Comparing many presentation patterns while keeping one underlying product dataset
* Explaining how the same ActionX result can power links, cards, galleries, or follow-up actions
* Prototyping lightweight UI ideas directly in docs before moving them into an application
* Teaching partners and developers that Mintlify can host custom coded presentation layers inside a normal documentation page

## Browse by category

### Soft placement

<Columns cols={3}>
  <Card title="Soft mention" href="/examples/soft-placement/soft-mention">
    Blend one subtle product suggestion into the answer before using explicit links.
  </Card>

  <Card title="Contextual entity links" href="/examples/soft-placement/contextual-entity-links">
    Embed linked brands and product names naturally inside the answer itself.
  </Card>

  <Card title="Contextual links with ad hover" href="/examples/soft-placement/contextual-links-with-ad-hover">
    Add a tiny AD marker after the linked entity and reveal the product card on hover.
  </Card>

  <Card title="Clickable recommendation block" href="/examples/soft-placement/clickable-recommendation-block">
    Turn one recommendation paragraph into a larger, softer click target.
  </Card>

  <Card title="Inline recommendation insert" href="/examples/soft-placement/inline-recommendation-insert">
    Insert one compact recommendation card into the middle of a longer answer.
  </Card>
</Columns>

### Answer-native

<Columns cols={3}>
  <Card title="Text links" href="/examples/answer-native/text-links">
    Keep the answer intact and only upgrade product names into links.
  </Card>

  <Card title="Inline product cards" href="/examples/answer-native/inline-cards">
    Add visual product cards directly after the answer.
  </Card>

  <Card title="Reason chips" href="/examples/answer-native/reason-chips">
    Explain each recommendation with compact tags.
  </Card>

  <Card title="Expandable picks" href="/examples/answer-native/expandable-picks">
    Collapse the shortlist until the user wants more detail.
  </Card>

  <Card title="Hover sync answer" href="/examples/answer-native/hover-sync-answer">
    Sync answer reasoning with a richer product panel.
  </Card>

  <Card title="Chat carousel" href="/examples/answer-native/chat-carousel">
    Keep the chat framing and move the products into a horizontal shelf.
  </Card>
</Columns>

### Browsing-native

<Columns cols={3}>
  <Card title="Product gallery" href="/examples/browsing-native/product-gallery">
    Render the same payload as a straightforward recommendation grid.
  </Card>

  <Card title="Editorial spotlight" href="/examples/browsing-native/editorial-spotlight">
    Feature one hero recommendation and supporting picks.
  </Card>

  <Card title="Bento discovery grid" href="/examples/browsing-native/bento-discovery-grid">
    Use an editorial bento layout to make the catalog feel richer.
  </Card>

  <Card title="Lookbook strip" href="/examples/browsing-native/lookbook-strip">
    Push the imagery forward with a more lifestyle-led presentation.
  </Card>

  <Card title="Compact result shelf" href="/examples/browsing-native/compact-result-shelf">
    Shrink recommendations into a denser page placement.
  </Card>
</Columns>

### Decision-support

<Columns cols={3}>
  <Card title="Comparison table" href="/examples/decision-support/comparison-table">
    Compare style, occasion, and gifting logic side by side.
  </Card>

  <Card title="Attribute scorecards" href="/examples/decision-support/attribute-scorecards">
    Expose ranking logic with compact visual scores.
  </Card>

  <Card title="Persona matcher" href="/examples/decision-support/persona-matcher">
    Re-rank the same shortlist around different user personas.
  </Card>

  <Card title="Occasion switcher" href="/examples/decision-support/occasion-switcher">
    Adapt the framing for birthdays, anniversaries, and holidays.
  </Card>

  <Card title="Shortlist compare tray" href="/examples/decision-support/shortlist-compare-tray">
    Let users save likely picks before comparing them.
  </Card>
</Columns>

### Action-extensions

<Columns cols={3}>
  <Card title="Follow-up service card" href="/examples/action-extensions/follow-up-service-card">
    Attach a post-recommendation service module after the answer.
  </Card>

  <Card title="Gift bundle builder" href="/examples/action-extensions/gift-bundle-builder">
    Turn a recommendation into a lightweight add-on flow.
  </Card>

  <Card title="Save or share wishlist" href="/examples/action-extensions/save-or-share-wishlist">
    Convert recommendations into a softer save-or-share action.
  </Card>

  <Card title="Next-step action sheet" href="/examples/action-extensions/next-step-action-sheet">
    Surface the likely next actions in a compact action layer.
  </Card>
</Columns>
