> ## Documentation Index
> Fetch the complete documentation index at: https://www.ayrshare.com/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Bubble.io

> Utilisez le plugin Bubble Ayrshare ou l'API Connector pour gérer les comptes de réseaux sociaux de vos utilisateurs

## Aperçu

[Bubble.io](https://www.bubble.io), une plateforme no-code populaire, vous permet de créer des applications web et mobiles sans écrire une seule ligne de code.
En intégrant l'API de réseaux sociaux d'Ayrshare, vous pouvez gérer les comptes de réseaux sociaux de vos utilisateurs directement dans votre application Bubble.

Il existe deux façons d'y parvenir :

<ul className="custom-bullets">
  <li>
    **Plugin Bubble Ayrshare** : cette option conviviale nécessite une configuration minimale. Cependant, elle a
    des fonctionnalités limitées par rapport au Bubble API Connector.
  </li>

  <li>
    **Bubble API Connector** : pour plus de flexibilité et de contrôle, utilisez le Bubble API Connector.
    Cette approche vous permet d'interagir directement avec l'API d'Ayrshare, permettant un plus large éventail de
    fonctionnalités dans votre application Bubble.io.
  </li>
</ul>

Ce guide vous guidera à travers les deux options d'intégration.

## Démarrage rapide : le plugin Bubble.io Ayrshare

[Bubble est l'une des plateformes de développement logiciel no-code les plus puissantes](https://www.ayrshare.com/blog/the-definitive-bubble-review-a-flexible-no-code-app-builder-growing-over-50/). Le moyen le plus simple de commencer est avec le [plugin Bubble.io](https://bubble.io/plugin/ayrshare-social-media-api-1607956467620x490188301088063500) d'Ayrshare. Voir ci-dessous pour une [intégration Bubble plus avancée](/packages-guides/bubble#the-bubble-api-connector-plugin).

<div class="video-container">
  <iframe width="520" height="315" src="https://www.youtube.com/embed/x5e2pcKhkPI" title="Bubble Social Plugin" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" />
</div>

Créez d'abord un compte sur [ayrshare.com](https://www.ayrshare.com). Puis connectez vos comptes de réseaux sociaux.

<Card title="Connecter les comptes sociaux" icon="link" href="/dashboard/connect-social-accounts/overview" horizontal />

Une fois vos comptes connectés, vous pouvez naviguer vers le tableau de bord API et copier votre API key.

<Tip>
  Rappelez-vous que lorsque vous collez votre API key dans votre application Bubble, vous devez inclure le mot « Bearer » devant votre API key.

  Par exemple :

  `Bearer bf55cc6f-76ac-46ce-b497-439d766f6c12`
</Tip>

Ajoutez le plugin Ayrshare via le marketplace des plugins Bubble à votre application Bubble. Dans le champ « API Key » du plugin, saisissez votre API Key.

Vous pouvez maintenant envoyer des publications via votre application Bubble vers vos comptes de réseaux sociaux.

L'image ci-dessous est un exemple d'appel de workflow dans Bubble au plugin pour une publication avec une image.
La vidéo ci-dessus explique cela plus en détail. Assurez-vous d'utiliser les types de paramètres suivants :

<ul class="custom-bullets">
  <li>post : un texte formaté en JSON-safe</li>

  <li>
    platforms : une liste de textes où chaque texte est entre guillemets, comme
    `"facebook","instagram"`
  </li>

  <li>media : une URL de texte formatée en JSON-safe</li>
  <li>date : une date/heure formatée en JSON-safe</li>
</ul>

<img class="center" src="https://mintcdn.com/ayrshare-docs/6mPR4kmwNEz1kMbX/images/packages-guides/bubble-ayrshare-example.webp?fit=max&auto=format&n=6mPR4kmwNEz1kMbX&q=85&s=e36f8c8ecd4ca4447b5b36ba77c06dcd" alt="Bubble Ayrshare Plugin Call Example" width="547" height="361" data-path="images/packages-guides/bubble-ayrshare-example.webp" />

Le plugin Ayrshare vous permet de publier et supprimer des publications. Pour libérer toute la puissance d'Ayrshare, nous vous recommandons d'utiliser le plugin Bubble API Connector et de le configurer avec les points de terminaison dont vous avez besoin pour votre application.

## Le plugin Bubble API Connector

Alternativement, vous pouvez utiliser le plugin Bubble API Connector pour accéder à toute la puissance de l'API Ayrshare. Voici une vidéo qui vous permettra de commencer à utiliser le Bubble API connector avec Ayrshare et vous guidera dans la publication de plusieurs images par publication.

<Info>
  L'API Connector de Bubble peut parfois être délicat, où l'oubli d'une seule guillemet fermante ou d'un espace peut
  provoquer l'échec de la connexion. Nous vous recommandons de regarder attentivement les vidéos ci-dessous et de les revoir si
  quelque chose ne fonctionne pas.
</Info>

<div class="video-container">
  <iframe width="560" height="315" src="https://www.youtube.com/embed/5xXvIDViUzY" title="Create a Post from Bubble" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" />
</div>

Ci-dessous se trouve une autre vidéo tutoriel montrant comment obtenir des statistiques de profil social dans Bubble.

<div class="video-container">
  <iframe width="560" height="315" src="https://www.youtube.com/embed/OunO2IS-A7Y" title="Get Analytics in Bubble" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" />
</div>

## Publier sur plusieurs comptes de réseaux sociaux

Voici un article avec un aperçu :

<Card title="Publier sur plusieurs comptes depuis Bubble" icon="link" href="https://www.ayrshare.com/post-to-multiple-social-media-accounts-from-bubble/" horizontal />

## Valider les données de publication Bubble

Lors de la publication vers Bubble via l'API Connector, il peut être difficile de déterminer si vous envoyez du JSON valide. Souvent, si le JSON publié sur Ayrshare est invalide, la réponse sera en HTML.

Ayrshare dispose d'une URL /validateJSON vers laquelle vous pouvez publier au lieu du point de terminaison /post habituel. Elle renverra « Valid » ou « Not Valid ». Assurez-vous de définir le Content-Type sur `text/plain` au lieu du `application/json` habituel.

Cliquez sur le lien Dépannage pour « Response Returns as Bad Request » pour voir les détails.

<Card title="Dépannage" icon="link" href="/help-center/technical-support/response_returns_as_bad_request" horizontal />

## Télécharger des fichiers médias dans Bubble

Utilisez le File Uploader de Bubble pour télécharger vos fichiers médias. Ces fichiers sont stockés sur Amazon S3. Vous recevrez en retour une URL qui peut être utilisée dans le paramètre de corps `mediaUrls` du point de terminaison `/post`.

## Générer un token JWT dans Bubble

Pour générer un token JWT dans Bubble, vous devez d'abord Stringify la private.key que vous envoyez au point de terminaison [/profiles/generateJWT](/apis/profiles/generate-jwt).

**Étape 1 :** allez sur [https://onlinetexttools.com/json-stringify-text](https://onlinetexttools.com/json-stringify-text) et collez votre private.key dans la section de texte d'entrée à gauche. Puis copiez le texte stringifié à droite dans votre presse-papiers.

<img class="center" src="https://mintcdn.com/ayrshare-docs/6mPR4kmwNEz1kMbX/images/packages-guides/jwt-token.webp?fit=max&auto=format&n=6mPR4kmwNEz1kMbX&q=85&s=01928d50ee7f94b05c7ce241f34ca904" alt="Verify your JWT Token" width="800" height="359" data-path="images/packages-guides/jwt-token.webp" />

**Étape 2 :** dans votre application Bubble, créez un nouvel appel avec l'API Connector comme indiqué ci-dessous. Le texte dans le champ `privateKey` de la zone Body est le texte stringifié que vous avez créé à l'étape 1 ci-dessus.

Incluez également votre `domain` et `profileKey` fournis, comme indiqué ci-dessous.

<img class="center" src="https://mintcdn.com/ayrshare-docs/6mPR4kmwNEz1kMbX/images/packages-guides/Enter%20the%20JWT%20Token%20in%20Bubble.webp?fit=max&auto=format&n=6mPR4kmwNEz1kMbX&q=85&s=73120fa7aa6b671ebabe1ec0dcd15ad4" alt="Enter the JWT Token in Bubble" width="800" height="738" data-path="images/packages-guides/Enter the JWT Token in Bubble.webp" />

**Étape 3 :** cliquez sur le bouton **Initialize call** et enregistrez la réponse. Le champ `url` dans la réponse est celui sur lequel votre utilisateur cliquera pour accéder à la page de liaison des comptes de réseaux sociaux.

<img class="center" src="https://mintcdn.com/ayrshare-docs/6mPR4kmwNEz1kMbX/images/packages-guides/Verify%20API%20connector%20return%20in%20Bubble.webp?fit=max&auto=format&n=6mPR4kmwNEz1kMbX&q=85&s=c32681f3e73024eb8c4f561595f222f6" alt="Verify API connector return in Bubble" width="800" height="572" data-path="images/packages-guides/Verify API connector return in Bubble.webp" />

## Permettre aux utilisateurs de lier leurs comptes sociaux

Si vous utilisez le Launch Plan, le Business Plan ou le Enterprise Plan, cette vidéo vous montre comment configurer Bubble pour permettre à tous vos utilisateurs de lier leurs comptes sociaux.

<div class="video-container">
  <iframe width="560" height="315" src="https://www.youtube.com/embed/C2QWLMkBbKg" title="Social Media Account Linking" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" />
</div>

## Réécrire du texte et publier sur les réseaux sociaux avec l'IA dans Bubble

Comment vous pouvez utiliser Ayrshare et Bubble.io pour créer une application de réécriture et de publication sociale. L'application prend du texte, le réécrit de 5 façons différentes et le publie sur vos comptes sociaux.

<div class="video-container">
  <iframe width="560" height="315" src="https://www.youtube.com/embed/Szrt6hUEzkw" title="Rewrite your Text" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" />
</div>

## Bubble API Connector

Nous recommandons d'utiliser le [Bubble API Connector](https://manual.bubble.io/account-and-marketplace/building-plugins/adding-api-connections) pour effectuer vos appels d'API Ayrshare.

Veuillez noter que Bubble expirera tous les appels API après 150 secondes, puis réessaiera l'appel une fois de plus. Les grandes vidéos peuvent prendre plus de 150 secondes, ce qui amènera Bubble à essayer automatiquement la publication une fois de plus et à entraîner une erreur de publication en double. Nous recommandons d'utiliser une [publication planifiée](/help-center/technical-support/response_bad_gateway_502_or_504_error) pour les vidéos plus volumineuses.

## Articles utiles du blog Bubble

* [Créer une application mobile de publication sur les réseaux sociaux sans code](https://www.ayrshare.com/blog/build-a-social-media-posting-mobile-app-with-no-code/).
* [Comment créer une application de planification sur les réseaux sociaux sans code.](https://www.ayrshare.com/blog/how-to-create-a-social-media-scheduling-app-with-no-code/)
