# AI Agent Tools: OpenAI & Claude

{% hint style="warning" %}
It is recommended to regularly check the status of Bubble, OpenAI, and Anthropic (Claude) to ensure the proper functioning of all template resources, as well as to add credits to OpenAI and Anthropic accounts.

**Bubble Status:** [**https://status.bubble.io/**](https://status.bubble.io/)\
**OpenAI Status:** [**https://status.openai.com/**](https://status.openai.com/)\
**Anthropic Status:** [**https://status.anthropic.com/**](https://status.anthropic.com/)

**OpenAI Billing:** [**https://platform.openai.com/settings/organization/billing/overview**](https://platform.openai.com/settings/organization/billing/overview)\
**Anthropic Billing:** [**https://console.anthropic.com/settings/billing**](https://console.anthropic.com/settings/billing)
{% endhint %}

{% hint style="success" %}
**Test Users**\
\
**Admin**\
email: <john-doe@mailto.plus>

pass: 12345678\
\
**User**\
email: <charlie@mailto.plus>

pass: 12345678
{% endhint %}

### 1. Installing the Template & Disabling the Demo Version

{% embed url="<https://www.youtube.com/watch?v=_2rjAeDTYug>" %}

{% hint style="warning" %}
To disable demo mode, go to ***Data > Option Sets > Styles & Config*** and set the ***Demo Mode*** attribute to **"no".**
{% endhint %}

### 2. Setting up OpenAI API

{% embed url="<https://youtu.be/22t8spqm-po?si=-jmRdmhrRGgGJyfq>" %}

**Generate API Key:** <https://platform.openai.com/settings/organization/api-keys>

{% hint style="warning" %}
**Authorization:** Bearer \[API KEY HERE]

**Content-Type:** application/json
{% endhint %}

### 3. Setting up Claude API

{% embed url="<https://youtu.be/OTvob4vBmtM?si=DP4gOY1t0qk7Q1SF>" %}

**Generate API Key:** <https://console.anthropic.com/settings/keys>

{% hint style="warning" %}
**x-api-key:** \[API KEY HERE]

**anthropic-version:** 2023-06-01

**content-type:** application/json
{% endhint %}

### 4. Setting up Stripe

{% embed url="<https://youtu.be/GBXYF8ZWGuU?si=2K4yw3gikiMZ6P_i>" %}

{% hint style="warning" %}
**Content-Type:** application/x-www-form-urlencoded
{% endhint %}

**Testing Stripe Connect:** <https://docs.stripe.com/connect/testing>

**Customer Portal:** <https://dashboard.stripe.com/test/settings/billing/portal>

**Developers:** <https://dashboard.stripe.com/test/developers>

### 5. Deploy to Live

{% embed url="<https://youtu.be/mXHF2ott4r0?si=nnDzJxQRgAC0Frz2>" %}

### 6. Copying the database

Copy Development data into the Live database.

{% embed url="<https://manual.bubble.io/help-guides/maintaining-an-application/database-maintenance/copying-the-database>" %}

### 7. Styles (Optional)

#### Choose a color palette for your app if you want to customize it

{% embed url="<https://manual.bubble.io/help-guides/design/styling/color-variables>" %}

#### Configure the colors for each chart type

<figure><img src="https://518164421-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT1Q1qC2wVXGuHGdhKlFm%2Fuploads%2FTIOfxoAKFIZ2MbuNBHn0%2FNew_Color_Chart.png?alt=media&#x26;token=c2fc7bcb-27fd-4c0c-99e4-83df475490dd" alt=""><figcaption></figcaption></figure>

#### Set up contact information, social media, the login page banner, disable the template's trial version, and make other adjustments.

<figure><img src="https://518164421-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT1Q1qC2wVXGuHGdhKlFm%2Fuploads%2FgJJn53LZ6Zd4SD4mZCkI%2FNew_Styles_Config.png?alt=media&#x26;token=8d487902-3d8b-4c50-99ee-e46487549ed4" alt=""><figcaption></figcaption></figure>

<figure><img src="https://518164421-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FT1Q1qC2wVXGuHGdhKlFm%2Fuploads%2FsxVoiFr6jNBCzY9FkBV3%2FNew_Styles_Config_Modify.png?alt=media&#x26;token=752032a3-b607-4df6-bc40-e50972f9247e" alt=""><figcaption></figcaption></figure>

### 8. PWA (Optional)

{% content-ref url="../../help-guide/getting-started/pwa" %}
[pwa](https://bb-docs.gitbook.io/bubweb-doc/help-guide/getting-started/pwa)
{% endcontent-ref %}


---

# 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://bb-docs.gitbook.io/bubweb-doc/templates/openai-and-claude/ai-agent-tools-openai-and-claude.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.