A list of all Manifold services.


Catalog Curation

Specifying products will start with no products, and let you manually specify every product that should be shown.

A common usecase is using products in conjuction with hide-categories (below).


Hide categories

Hiding the categories is a great way to have a more compact display. It’s recommended if you’re only displaying a few products via products (above):

<manifold-marketplace hide-categories></manifold-marketplace>

Hide search

This attribute hides the search bar (always shown by default).

<manifold-marketplace hide-search></manifold-marketplace>

Hide template cards

Add the hide-templates attribute to hide external service template cards (GitHub, Stripe, etc.). This attribute will also hide the cards’ respective categories if no other products are using them.

<manifold-marketplace hide-templates></manifold-marketplace>

Featuring products

You can add a β€œFeatured” tag to select products by specifing a comma-separated list:

<manifold-marketplace featured="piio,zerosix"></manifold-marketplace>


Slots in web components allow you to place content in the middle of a web component. Each component will have different areas. Any HTML element can be used, so long as it has slot="[slot-name]" as a property. Read more about slots.

  <div slot="sidebar">
    This will appear in the sidebar (if visible)


This component emits custom events when it updates. To listen to those events, add an event listener either on the component itself, or document:

document.addEventListener('manifold-marketplace-click', { detail } => {
  console.log(detail); // { productLabel: "jawsdb-mysql", productName: "JawsDB MySQL", productId: "234w1jyaum5j0aqe3g3bmbqjgf20p" }

The following events are emitted:

Event Name Description Data
manifold-marketplace-click Fires whenever a user has clicked on a product. productId, productLabel, productName
manifold-template-click Fires whenever a user has clicked on a custom template (assuming it’s not hidden with hide-templates). category


By default, service cards will only emit the manifold-marketplace-click event (above). But it can also be turned into an <a> tag by specifying product-link-format and template-link-format:

<!-- <a href="/product/jawsdb-mysql"> -->

:product will be replaced with the url-friendly slug for the product, as will :template for custom resource templates.

Note that use of either of these two attributes will disable the custom events unless preserve-event is passed as well.