# Web Portal

## Overview

The Bounce Web Portal is a no-code, turn-key solution for bringing all the exciting value and utility of Bounce Link and Flex to your fans and customers, through a fully brand-able, web-based portal of connected experiences, rewards and other features.

With zero integration cost and maximum flexibility, the web portal is the quickest way to add phygital and cross-world experiences to your physical products and digital assets.

<figure><img src="/files/YwyIxSfQf0o1UddP8r01" alt="" width="188"><figcaption><p>Bounce Web Portal featuring Bounce Dragon</p></figcaption></figure>

## Web Portal variants and use cases

Web Portals come in two flavors that share the came configuration and styling:

* `main` - The main portal version is a full-page, standalone portal that includes user authentication, claim flows and all connected experiences
* `modal` - The modal portal is a compact version of the main portal, meant to be embedded inside other web and mobile applications, e-commerce marketplaces (as an iFrame) and games (as web views) and makes it possible to add Bounce utility to assets on any platform.&#x20;

<figure><img src="/files/4PnjWvFSbSRKE5vi6U0g" alt=""><figcaption><p>Main and Modal variants of the Bounce Web Portal</p></figcaption></figure>

The modal version of the Portal can be rendered for a specific asset and user and support `pre-authentication`, to prevent the need for double authentication when using Bounce in an embedded scenario.

Use this option to create more seamless experiences for your users after purchase of a digital asset, in-game achievement or e-commerce order.

## Anatomy of the Web Portal

The web portal is a customizable, auto-generated web page that showcases each Bounce-linked physical or digital asset and all associated content and experiences.&#x20;

Much like a Linktree page, it can be fully customized in both look-and-feel and enabled features to make it feel like a native part of your product and brand experience.

<figure><img src="/files/UKQZPTrE96gjuFtDfFVb" alt=""><figcaption><p>Bounce Web Portal customization options</p></figcaption></figure>

### Authentication

The Bounce Web Portal connects to both Link phygital collectibles and Flex digital content and experiences, making it possible for owners of digital and physical assets to claim their exclusive experiences and rewards.

To facilitate claiming, ownership verification, trading and experience access, the Web Portal can manage authentication using one of two methods:

* `Wallet` - Use any compatible blockchain wallet to connect
* `OAuth` - Use any supported OAuth provider (such as social login) to connect

The list of supported wallets and OAuth providers can be customized for every project.

### Connected Experiences

Bounce Flex allows creators of digital experiences in metaverse, gaming and social spaces to offer dynamic, exclusive content that is unlocked and customized by Bounce Link assets or any other digital collectible.

The list of Experience Blocks enabled for each project will show up automatically in the body of the Web Portal.

Since not all experiences are available for every single project, each connected platform can be enabled or disabled, linked to in-platform worlds, levels and assets, and text and images for the Experience Block customized.

{% content-ref url="/pages/FcwAfuHVAerASO9V41vE" %}
[Experience Blocks](/integration-guides/web-portal/experience-blocks.md)
{% endcontent-ref %}

### Branding

The following styling and content components can be customized in the Web Portal (for both the `main` and `modal` variants):

* Logo image, size and position
* Color palette
* Background color, image or gradient
* Main asset image source and asset layout
* Copy and images for all body, buttons and experience blocks
* Footer links
* <mark style="color:orange;">`Coming soon`</mark> - Custom CSS and HTML

### Domain mapping

A custom web experience is not complete until it is accessible from your brand's own domain. Bounce Web Portals can be easily mapped to any approved domain or subdomain, configured via Developer Settings.

This allows you to mask the Bounce Web Portal URL:

```
https://portal.letsbounce.gg/{partner_id}/{project_id}/{asset_id}
```

With the following (phygital is only used as an example subdomain):

```
https://phygital.example.com/{{asset_id}}
```

Note that the URL route parameters `partner_id` and `project_id` are no longer necessary as they are automatically detected by the URL's origin according to the assigned Bounce project.&#x20;

`asset_id` is optional and can be used to direct the portal to a specific asset page.

This makes for a cleaner, more memorable URL.&#x20;

### Web Portal Security

To ensure that only domains verified by your project can access the Web Portal, the origin is checked with every load before redirection.

Access from unauthorized domains will result in an error.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.letsbounce.gg/integration-guides/web-portal.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
