Add AppAdSwap to a Carrd site

By Luis Krin · Updated · All install guides

The snippet

Every platform needs the same two things: a slot where the card shows, and the script. Replace SITE_ID with your site's ID. The Sites page in your dashboard shows this snippet with the ID already filled in.

HTML
<div data-appadswap="SITE_ID" data-format="card"></div>
<script src="https://appadswap.com/w.js" async></script>

On Carrd, the whole snippet goes into one Embed element set to Code. Carrd only allows script tags in embeds on its Pro Standard and Pro Plus plans, so check your plan first.

Before you start

Carrd's plans page describes embeds as a way to "directly embed your own code (including script tags) as well as external content", and lists them under Pro Standard and Pro Plus. Pro Lite doesn't list embeds, and the free plan doesn't include them. If your plan doesn't have them, the card can't run on that Carrd site, and an upgrade is the only way.

Step 1: add the embed

  1. In the Carrd editor, press the + button to add an element, and choose Embed.
  2. Set its Type to Code.
  3. Paste the whole snippet, slot and script together:
<div data-appadswap="SITE_ID" data-format="card"></div>
<script src="https://appadswap.com/w.js" async></script>

Step 2: choose the style

Carrd's embeds have a style setting that controls how the code is placed on the page.

  • Inline keeps the code where you put the element, so the slot shows in its place. Use this for the card.
  • Hidden is for code with nothing visible to show. It suits the corner card, where the script is the whole snippet and there is no slot:
<script src="https://appadswap.com/w.js" data-appadswap="SITE_ID" data-format="corner" async></script>

Carrd guides from other vendors say a script that expects an element to be on the page can fail when it's set to Hidden, which is why the card uses Inline.

Step 3: publish and check

Publish the site. Carrd's editor preview isn't the published page, so open the live address. The Sites page in your dashboard flips from unverified to live on its own once the widget has loaded.

If it doesn't work

  • The Embed element is greyed out or missing. Your plan doesn't include embeds.
  • The card is missing on the published page. Check that the embed's type is Code and that its style is Inline.
  • The card is far wider than you want. Embeds take the width of their container. Put the embed inside a container element with the width you want.
  • You registered a custom domain, but you're testing on the carrd.co address. The widget has to load on the address you registered in your dashboard.

Source

Carrd's plans page. Next: other install guides, or add your app.

Other platforms.

Installed?Add your app.

Add your appAll install guides