> ## 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

> Use o plugin Ayrshare do Bubble ou o API Connector para gerenciar as contas de redes sociais dos seus usuários

## Visão Geral

O [Bubble.io](https://www.bubble.io), uma popular plataforma no-code, permite construir aplicativos web e mobile sem escrever uma única linha de código.
Ao integrar a API de redes sociais da Ayrshare, você pode gerenciar as contas de redes sociais dos seus usuários diretamente no seu app Bubble.

Existem duas formas de conseguir isso:

<ul className="custom-bullets">
  <li>
    **Plugin Bubble Ayrshare**: Esta opção fácil de usar requer configuração mínima. No entanto, tem
    funcionalidade limitada em comparação com o Bubble API Connector.
  </li>

  <li>
    **Bubble API Connector**: Para maior flexibilidade e controle, utilize o Bubble API Connector.
    Essa abordagem permite interagir diretamente com a API da Ayrshare, habilitando uma gama maior de
    funcionalidades no seu app Bubble.io.
  </li>
</ul>

Este guia irá orientá-lo por ambas as opções de integração.

## Início Rápido: O Plugin Ayrshare do Bubble.io

[O Bubble é uma das plataformas de desenvolvimento de software no-code mais poderosas](https://www.ayrshare.com/blog/the-definitive-bubble-review-a-flexible-no-code-app-builder-growing-over-50/). A maneira mais simples de começar é com o [Plugin Bubble.io](https://bubble.io/plugin/ayrshare-social-media-api-1607956467620x490188301088063500) da Ayrshare. Veja abaixo uma [integração mais avançada com Bubble](/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>

Primeiro, crie uma conta em [ayrshare.com](https://www.ayrshare.com). Depois conecte suas contas de redes sociais.

<Card title="Conectar contas sociais" icon="link" href="/dashboard/connect-social-accounts/overview" horizontal />

Uma vez que suas contas estiverem conectadas, você pode navegar até o API Dashboard e copiar sua API key.

<Tip>
  Lembre-se de que ao colar sua API key no seu app Bubble, você deve incluir a palavra "Bearer" na frente da sua API key.

  Por exemplo:

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

Adicione o plugin Ayrshare via o marketplace de plugins do Bubble ao seu app Bubble. No campo do plugin "API Key" insira sua API Key.

Agora você pode enviar posts via seu app Bubble para suas contas de redes sociais.

A imagem abaixo é um exemplo de chamada de workflow no Bubble para o plugin com uma publicação com imagem.
O vídeo acima explica isso com mais detalhes. Certifique-se de estar usando os seguintes tipos de parâmetro:

<ul class="custom-bullets">
  <li>post: um texto formatado como JSON-safe</li>

  <li>
    platforms: uma lista de textos onde cada texto tem parênteses ao redor, tal como
    `"facebook","instagram"`
  </li>

  <li>media: uma URL de texto formatada como JSON-safe</li>
  <li>date: uma data/hora formatada como 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="Exemplo de Chamada do Plugin Bubble Ayrshare" width="547" height="361" data-path="images/packages-guides/bubble-ayrshare-example.webp" />

O Plugin Ayrshare permite publicar e excluir posts. Para desbloquear todo o poder da Ayrshare, recomendamos que você use o Bubble API Connector Plugin e o configure com os endpoints necessários para seu app.

## O Plugin Bubble API Connector

Alternativamente, você pode usar o Plugin Bubble API Connector para acessar todo o poder da API Ayrshare. Aqui está um vídeo para você começar a usar o Bubble API connector com a Ayrshare e que mostra como publicar várias imagens por post.

<Info>
  O API Connector do Bubble às vezes pode ser complicado; a falta de uma única aspa de fechamento ou espaço pode
  causar falha na conexão. Recomendamos assistir aos vídeos abaixo com atenção e revisar novamente se
  algo não estiver funcionando.
</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>

Abaixo há outro vídeo tutorial mostrando como obter análises de perfil social no 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>

## Publicar em Múltiplas Contas de Redes Sociais

Aqui está um artigo com uma visão geral:

<Card title="Publicar em Múltiplas Contas a Partir do Bubble" icon="link" href="https://www.ayrshare.com/post-to-multiple-social-media-accounts-from-bubble/" horizontal />

## Validar Dados de Post do Bubble

Ao publicar no Bubble via API Connector, pode ser difícil determinar se você está enviando um JSON válido. Muitas vezes, se o JSON enviado à Ayrshare for inválido, a resposta será HTML.

A Ayrshare tem uma URL /validateJSON que permite enviar em vez do endpoint /post padrão. Ela retornará "Valid" ou "Not Valid". Certifique-se de definir o Content-Type como `text/plain` em vez do típico `application/json`.

Clique no link Troubleshooting para "Response Returns as Bad Request" para ver os detalhes.

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

## Enviar Arquivos de Mídia no Bubble

Use o File Uploader do Bubble para enviar seus arquivos de mídia. Esses arquivos são armazenados no S3 da Amazon. Você receberá de volta uma URL que pode ser usada no parâmetro `mediaUrls` do body do endpoint `/post`.

## Gerar Token JWT no Bubble

Para gerar um Token JWT no Bubble, primeiro você precisa fazer o Stringify da private.key que você envia para o endpoint [/profiles/generateJWT](/apis/profiles/generate-jwt).

**Passo 1:** Vá para [https://onlinetexttools.com/json-stringify-text](https://onlinetexttools.com/json-stringify-text) e cole sua private.key na seção de input de texto à esquerda. Em seguida, copie o texto stringified do lado direito para a área de transferência.

<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="Verifique seu Token JWT" width="800" height="359" data-path="images/packages-guides/jwt-token.webp" />

**Passo 2:** No seu app Bubble, crie uma nova chamada com o API Connector conforme mostrado abaixo. O texto no campo `privateKey` na área Body é o texto stringified que você criou no passo 1 acima.

Inclua também o `domain` e o `profileKey` fornecidos conforme mostrado abaixo.

<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="Insira o Token JWT no Bubble" width="800" height="738" data-path="images/packages-guides/Enter the JWT Token in Bubble.webp" />

**Passo 3:** Clique no botão **Initialize call** e salve a resposta. O campo `url` na resposta é o que seu usuário clicará para acessar a página de vinculação de contas sociais.

<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="Verificar retorno do API connector no Bubble" width="800" height="572" data-path="images/packages-guides/Verify API connector return in Bubble.webp" />

## Permitir que Usuários Vinculem Suas Contas Sociais

Se você estiver usando o Plano Launch, Plano Business ou Plano Enterprise, este vídeo mostra como configurar o Bubble para permitir que todos os seus usuários vinculem suas contas sociais.

<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>

## Reescrever Texto e Publicar em Redes Sociais com IA no Bubble

Como você pode usar Ayrshare e Bubble.io para criar um app de reescrita e publicação social. O app recebe um texto, reescreve-o de 5 maneiras diferentes e publica em suas contas sociais.

<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

Recomendamos usar o [Bubble API Connector](https://manual.bubble.io/account-and-marketplace/building-plugins/adding-api-connections) para fazer suas chamadas de API Ayrshare.

Observe que o Bubble irá dar timeout em todas as chamadas de API após 150 segundos e então tentará a chamada mais uma vez. Vídeos grandes podem levar mais de 150 segundos, o que fará com que o Bubble tente automaticamente o post novamente, resultando em um erro de post duplicado. Recomendamos usar um [post agendado](/help-center/technical-support/response_bad_gateway_502_or_504_error) para vídeos maiores.

## Artigos Úteis do Blog Bubble

* [Construa um App Mobile de Publicação em Redes Sociais Sem Código](https://www.ayrshare.com/blog/build-a-social-media-posting-mobile-app-with-no-code/).
* [Como Criar um App de Agendamento de Redes Sociais Sem Código.](https://www.ayrshare.com/blog/how-to-create-a-social-media-scheduling-app-with-no-code/)
