Embedding A Campaign

Overview

Embedding your campaign allows you to leverage the traffic your website already receives to boost engagement. This guide will walk you through embedding your campaign, managing Facebook integrations, validating your embed code, and enabling Cloudflare Turnstile.

Step 1: Publishing Your Campaign

1. In the Campaign Builder, click the blue Publish Campaign button in the top-right corner.
2. In the pop-up, click the blue Embedded on Website button.
3. Enter the URL of your webpage where the campaign will appear.
   • You can update this URL later if needed.
4. Click Next.

Step 2: Customize Your Campaign URL

• You can customize the URL visitors will use when sharing or accessing the stand-alone version of your campaign.
• To customize the subdomain:
  • Click on the default subdomain (e.g., m) and type your desired subdomain into the field.
  • Click the checkmark to save.
• If you’re on the Pro Plan or higher, you can customize the domain:
  • Click the domain in the displayed URL.
  • Select from the available domain options in the dropdown.

Note: For details about custom domains, refer to the Publishing to a Custom Domain help doc.

5. Once complete, click Publish.

Step 3: Facebook Integration (Optional)

If your campaign uses Facebook features like Login Fields or voting restrictions, you’ll need to add your Facebook App settings before publishing:

1. Provide your Facebook App ID and App Secret.
   • If you don’t have an app, you’ll need to create one.
   • For guidance, check out the Facebook App Setup Video.
2. Click Next.
3. Follow the steps to make your Facebook App live, then click Publish.

Step 4: Grabbing Your Embed Code

Once published:

1. Ensure Website is selected at the top.
2. Click the blue Copy button to copy the iFrame code.
   • Paste this code into the HTML of your webpage.

Advanced Settings

Before embedding, review these Advanced Settings:

• Auto-resize (default): Automatically resizes the iFrame based on the campaign size and available space.
• Fixed size: Select the Fixed size option and enter specific dimensions (width and height).
• Omit JavaScript: If your CMS removes JavaScript:
  • Check the Omit JavaScript box.
  • You must use a fixed height, as auto-resizing relies on JavaScript.

Note: If you make changes in Advanced Settings, re-copy the embed code to ensure updates are applied.

Step 5: Validating Your Embed Code

After embedding the code, validate it to ensure everything works correctly:

1. Open the Publication Manager by clicking the blue flag in the Campaign Builder.
2. Click Click to validate embed code (in blue).
3. Based on the results:
   • Green Box: An exact match was found (embed is working perfectly).
   • Yellow Box: A partial match was found. Instructions will be displayed to help fix the issue.
   • Red Box: Embed code was not found. Troubleshooting steps will appear.

If you’re unable to troubleshoot, contact ShortStack support at theteam@shortstacklab.com for assistance.

Step 6: Enabling Cloudflare Turnstile for Embeds

Cloudflare Turnstile prevents bots from interacting with your campaign by verifying users are human. By default, this is disabled for embedded campaigns, but you can enable it:

1. Open the Campaign Settings (gear icon at the top of the Builder).
2. In the pop-up, go to the Other section.
3. Check the box to Enable if my campaign is embedded.
4. In the dropdown, select the Cloudflare Turnstile Mode:
   • Invisible is recommended for embedded campaigns.

Note: Cloudflare Turnstile is available on the Pro Plan and higher.

Final Notes

Once your campaign is embedded, you can manage your publications by clicking the bookmark icon in the Campaign Builder. From there, you can view and manage all published campaigns.