Carrd

Add GoPayLocal to any Carrd site using Carrd’s built-in Embed element.

Installation

1. Get your API key from the GoPayLocal dashboard

2. Add an Embed element to your site

   In the Carrd editor, click + to add a new element and choose Embed.

   Set the type to Code, then paste the following into the code field:

   <script
     src="https://api.gopaylocal.com/v1/banner/script.js?key=gpl_pk_live_abc123"
     async
   ></script>

   Replace gpl_pk_live_abc123 with your actual API key.

3. Position the Embed element

   Place the Embed element anywhere on the page — the banner will render in a fixed position over your site. You can hide the element in the layout if you don’t want a visible placeholder.

4. Configure discounts in the GoPayLocal dashboard

5. Publish your site

That’s it. Visitors from countries with lower purchasing power will see a localized pricing banner.

Tip

Carrd’s Pro Standard plan (and above) is required to use Embed elements with external scripts. If you’re on the free plan, you’ll need to upgrade.

Data Attributes

You can also use GoPayLocal data attributes to dynamically update prices displayed in your Carrd text elements. Add a second Embed element with:

<script>
  document.querySelectorAll('[data-gopaylocal-price]').forEach(function(el) {
    // Prices are updated automatically once the banner script loads
  });
</script>

Then add data-gopaylocal-price="9.99" as a custom attribute to any text element showing a price.

Note

Carrd has limited support for custom attributes on elements. For full data-attribute support, use the JS SDK embed pattern above alongside the banner script.