# Share Popup

## Overview

This popup allows you to share the app with a friend via email, Twitter, or Facebook. It also contains UI elements to copy a code to a clipboard (e.g., promo code, referral code), and a short form.&#x20;

![](/files/n3WoqicMbxLEs1GVTPaB)

## Structure

The popup includes the following:

* Copy to clipboard input and button
  * &#x20;There is an HTML element that copies the input's text to the user's clipboard using a javascript action.
* Share by Email button
  * Recipient email input
  * Body message multiline input
  * From input
  * Clicking **Button Share** will trigger a **send\_email** API workflow
    * To use API workflows in your app, you need to be subscribed to at least a Personal Plan (Bubble editor > Settings > App plan)
    * You need to have set up your SendGrid email account (please read the [quickstart guide here](https://docs.airdev.co/canvas/v/2.0.0/quickstart-guide#step-2-set-up-your-email))
* Share to Twitter link
* Share to Facebook link
* Share to LinkedIn link
* Send email form elements
  * There is a collapsible group (**Group Collapsible email details** shown in the screenshot below) which contains three input elements. This small form can be made visible if you prefer to have the user stay in the app in order to share something, instead of having the user click the Share by Email button and type their share message in an external email service.&#x20;

![](/files/9FxpIcEbun7TCik8HQ2Q)

## How to set up

* Edit the copy to clipboard input text's default value to be the unique code that the user will copy
* Update the recipient email input, body message multiline input, and from input
* Edit the **send\_email** API workflow if needed
* Add a workflow on the page to show **Popup sharePopup**
* Set the collapsible invite by email group to be visible and update the workflows to send an email.


---

# 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.airdev.co/canvas/canvas-library/popups/share-popup.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.
