> For the complete documentation index, see [llms.txt](https://connect.socios.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://connect.socios.com/partner-web-app/integration.md).

# Integration

Integrating the Socios.com Partner Web App

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="https://31329255-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMDcaoJLMj5Y3jzFMTONF%2Fuploads%2Fjdxv6ChJXZ92yNZQZp7S%2Fimage.png?alt=media&amp;token=d1385639-535d-4251-87cc-68965fa8529b" 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="https://31329255-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMDcaoJLMj5Y3jzFMTONF%2Fuploads%2Fryfl554IaoYLU7FpMd5i%2FSFP%201.png?alt=media&amp;token=f2b4ae53-8d34-4dc3-be68-c324c6a52dfa" alt=""><figcaption></figcaption></figure> <figure><img src="https://31329255-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMDcaoJLMj5Y3jzFMTONF%2Fuploads%2FoCN4qUiMXEOosIQYpLs5%2FSFP%202.png?alt=media&amp;token=4ba3df7c-c6cd-4374-be7e-7dcbb0718153" alt=""><figcaption></figcaption></figure> <figure><img src="https://31329255-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FMDcaoJLMj5Y3jzFMTONF%2Fuploads%2F430cN4t8Off4nTVFQAXp%2FSFP%203.png?alt=media&amp;token=0ccb83c3-7ddc-4848-bde4-5320413649de" alt=""><figcaption></figcaption></figure></div>


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

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

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://connect.socios.com/partner-web-app/integration.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.
