The product banner and switcher is two add-on features available in 3D (shortlink and 3D Quick-view only), Augmented Reality (AR) and Virtual Try-On (VTO) experiences. It may display key product information such as the name, image, product variants, and a link back to the product detail page. This creates a smoother customer journey, especially when users access these features from external sources like email, B2B catalogs, QR-codes, or social media.
What the product banner does
Shows the product title, product image, product price or description
Includes a link back to the product page (only if product catalog method is used)
Appears in both 3D, AR and VTO for enhanced context
What the product switcher does
Displays a list of related product variants (e.g., grouped by an attribute on your choice, such as color or style)
Lets users switch between options directly within the 3D or VTO experience
Automatically updates the visual based on the selected variant
Requirements for activation
The product banner can either display information that you have added as meta fields, or it can dynamically retrieve the information from your product catalog. Here's how it works:
From meta-fields
Meta-fields can be added to each model at the time of order request, or added afterwards one-by-one on each product page.
The product image is automatically generated from the 3D model. To display a title, you need a meta-field which is exactly named
product_title. To display a text underneath the title, you need a meta-field which is exactly namedproduct_description. You may use the description to display the color or type of the product.The options that appear in the product switcher are determined by you. Type the same value in meta-fields on different products, exactly named
product_group_labelfield (e.g. if user try a product with a value 'blue'product_group_label, the system will show other products with the same value inproduct_group_label)
From product feed
The product banner will show if product from your product catalog has a matching 3D model in the Fibbl platform, based on the Product ID (e.g., SKU, ID, Item Group ID). And if the product catalog you upload contains the following attributes:
id(used to match the model to the feed item)titleimage_linklink(PDP URL)
The product switcher will show if above is true, and also if a Group Label Attribute has been set in the product catalog settings. Choose any field in your product feed to group product variants together (e.g. if user try a product with a value 'blue'
custom_label_0, the system will show other products with the same value incustom label_0)
Once conditions are met, the product banner and switcher will appear automatically—no code required.
ℹ️ Important notice
If the conditions for displaying product banners and switches based on a product catalog are met, it trumps the meta field configuration. The specific meta fields are a way for you to showcase contextual information even before it is in a structured product feed that contains additional data, especially valuable for B2B processes and when it's very early in the product lifecycle.
⚠️ Limitation:
For augmented reality placement, the product banner only works for end-users with iOS devices as this isn't supported by Android native system yet.
When it comes to 3D Viewer experiences, product banner and switcher only works in a 3D experience created from a shortlink or via the component 3D Quick-view – not in the components fibbl-model-viewer or fibbl-layer.