# Integration

You can seamlessly incorporate our Partner Web App into your website.&#x20;

To achieve this, you must use this Partner URL:&#x20;

```url
https://app.socios.com/partner/[PARTNER_ID]?partnerWebAppId=[PARTNER_ID]
```

An example URL would be the one from the Bern football club [BSC Young Boys](https://www.bscyb.ch/):

{% code overflow="wrap" fullWidth="false" %}

```url
https://app.socios.com/partner/5796d2d6-da2a-4914-82fe-3eeaba3c1bca?partnerWebAppId=5796d2d6-da2a-4914-82fe-3eeaba3c1bca
```

{% endcode %}

You can retrieve the `Partner ID` you want by browsing on app.socios.com and looking for the specific partner detailed page. The id will be located after `/partner/` in the URL.

They designed the integration to look like this:

<figure><img src="/files/wECy4dFajqPSeG1yDVGB" alt=""><figcaption></figcaption></figure>

Try it for yourself: <https://ybo.bscyb.ch/>

## Web integration

You can insert the Partner Web App into an iframe for a responsive website.&#x20;

The necessary HTML code is:

{% code overflow="wrap" %}

```html
<iframe src="https://app.socios.com/partner/[PARTNER_ID]?partnerWebAppId=[PARTNER_ID]" width="100%" height="800px" allow="camera 'src'; publickey-credentials-get 'src'"></iframe>
```

{% endcode %}

### **SEO Optimisations**

Here are two ways to improve the findability of your Fan Token page from search engines:

* Fill the `<title>` HTML tag with "\[Partner shortname] Fan Token", so that it  appears clearly in the browser tab. \
  For instance, for Apollon Limassol fan token: `<title>APL Fan Token</title>`
* Make sure to mention this string in the URL of the page. \
  For instance: <https://www.apollon.com.cy/en/apl-fan-token/>

## Mobile integration

For mobile apps, you can create a native WebView using the following URL:

```url
https://app.socios.com/partner/[PARTNER_ID]?partnerWebAppId=[PARTNER_ID]
```

This way the web app will be seamlessly implemented within your mobile app. It can work on both native or hybrid mobile app.

Of course, building a native WebView requires much more work than just using this URL -- starting with the fact that a native implementation will require you to develop it twice (iOS + Android).

See for instance how French rugby club Stade Français did it:

<div><figure><img src="/files/P3bTZYiYaOR6adWN7K6N" alt=""><figcaption></figcaption></figure> <figure><img src="/files/BCh1NLhaOQB2NTZIReig" alt=""><figcaption></figcaption></figure> <figure><img src="/files/cS7KlK9veupDKRwewvBI" alt=""><figcaption></figcaption></figure></div>


---

# 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://connect.socios.com/partner-web-app/integration.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.
