> ## Documentation Index
> Fetch the complete documentation index at: https://beta-docs.replo.app/llms.txt
> Use this file to discover all available pages before exploring further.
# Klaviyo
> Connect Klaviyo to power email and SMS, and embed Klaviyo signup forms on your Replo pages.
export const TryPromptButton = ({prompt, imageSrc, imageAlt = "Template preview", imageStyles = {}, buttonCta = "Build in Replo"}) => {
const [isLoading, setIsLoading] = useState(false);
const [error, setError] = useState(null);
const API_BASE = "https://api.replo.app";
const APP_URL = "https://dashboard.replo.app";
const LoaderIcon = ;
const ChevronIcon = ;
async function postJSON(url, body, headers = {}, timeoutMs = 120000) {
const controller = new AbortController();
const timeoutId = setTimeout(() => controller.abort(), timeoutMs);
try {
const response = await fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/json",
...headers
},
body: JSON.stringify(body ?? ({})),
signal: controller.signal
});
const responseText = await response.text();
if (!response.ok) throw new Error(`API Error: ${response.status}`);
return responseText ? JSON.parse(responseText) : {};
} finally {
clearTimeout(timeoutId);
}
}
async function handleTryPrompt(event) {
event.preventDefault();
event.stopPropagation();
setIsLoading(true);
setError(null);
try {
const body = {
prompt,
file: null
};
const {seed} = await postJSON(`${API_BASE}/api/v1/marketing/issue-marketing-site-jwt`, body);
if (!seed) throw new Error("No seed returned from API");
const url = new URL(APP_URL);
url.searchParams.set("type", "agent");
url.hash = `seed=${encodeURIComponent(seed)}`;
window.open(url.toString(), "_blank");
setIsLoading(false);
} catch (caughtError) {
console.error("Failed to generate prompt:", caughtError);
const message = caughtError instanceof Error ? caughtError.message : null;
setError(message ?? "Something went wrong. Please try again.");
setIsLoading(false);
}
}
return
{}
{imageSrc && }
{}
{}
{}
{error &&
{error}
}
;
};
[Klaviyo](https://www.klaviyo.com) is an email and SMS marketing platform for personalized campaigns and automation. With Replo you can connect your Klaviyo account so Replo can act on your behalf, and embed Klaviyo signup forms directly on your pages.
## Connect Klaviyo
Klaviyo connects by signing in; there are no API keys to copy.
In Replo, open the [Integrations app](/apps/integrations) and find **Klaviyo**.
Click **Connect**, sign in to Klaviyo, and approve access. This links your Klaviyo account to your Replo project.
You can also connect straight from chat; if you ask Replo to use Klaviyo before it's connected, it drops the connection card right into the conversation.
```text theme={null}
Connect my Klaviyo account
```
## Embed Klaviyo forms on your pages
You can add a Klaviyo signup form to any page by asking Replo in chat. There are two ways to do it.
### Option 1: Reference the form ID
Ask Replo to add a form by its ID:
```text theme={null}
Add a Klaviyo signup form with ID ABC123 below my hero section
```
### Option 2: Paste the embed code
Copy the embed code from Klaviyo and paste it directly in chat:
```text theme={null}
Add this Klaviyo form:
```
### Finding your Klaviyo form ID
1. In Klaviyo, go to **Signup Forms**.
2. Click the form you want to embed.
3. Click **Publish** in the top-right corner.
4. Select the **Embed** tab.
5. Your form ID is the part after `klaviyo-form-` in the embed code (for example, `ABC123` in ``).
Only **Embed** type forms can be placed directly on Replo pages. Pop-up and flyout forms are triggered automatically by Klaviyo's script and don't require manual placement.