Skip to main content
All CollectionsSharing Your Card
Embedding Your Digital Business Card on an HTML website

Embedding Your Digital Business Card on an HTML website

Embedding Your Business Card on an HTML Website

Sebastien Barrau avatar
Written by Sebastien Barrau
Updated this week

Easily add your digital business card to your personal or company website using a simple embed script from businessCards.io.


🎨 Customize Your Button

  1. Log into your account.

  2. Open the business card you would like to embed on your site.

  3. Click Get Embed Button on your card page.

  4. Customize:

    • Background Color

    • Text Color

    • Button Text (leave blank to use just the icon)

    • Button Position (Inline, Bottom Right, Bottom Left)

🧩 Add the Embed Code

After customizing, copy the embed code. Here's how to add it based on the button position:


🔹 Inline Position

If you selected Inline, place the embed code exactly where you want the button to appear:

<!-- Example: inside a div -->
<div class="contact">
<script src="https://businesscards.io/js/businesscard_embed.js"
data-card-slug="your-card-slug"
data-button-color="#4F46E5"
data-button-text-color="#FFFFFF"
data-button-text="View Business Card"
data-button-position="inline">
</script>
</div>

🔹 Bottom Right or Bottom Left Position

If you chose Bottom Right or Bottom Left, you can place the embed code anywhere inside the <body> tag, preferably near the end:

<!-- Example: at the end of your body -->
<body>
...
<script src="https://businesscards.io/js/businesscard_embed.js"
data-card-slug="your-card-slug"
data-button-color="#4F46E5"
data-button-text-color="#FFFFFF"
data-button-text="View Business Card"
data-button-position="bottom-right">
</script>
</body>

✅ You’re Done!

Your button will now show up based on the selected position and style. Clicking it opens your digital business card directly on your site.

Did this answer your question?