Cargo - FormBnB Documentation

Why Use FormBnB with Cargo

Cargo is a popular portfolio builder for designers and creatives, but it doesn’t include a form backend. FormBnB adds:

Contact forms for client inquiries
Unlimited submissions on the free plan
Email notifications on every submission
Spam protection built in
No code or plugins needed

Setup Steps

Create FormBnB Form

Create a new form in your FormBnB dashboard and copy the form slug.

Add HTML Snippet

In the Cargo editor, add a Code / HTML block to your page.

Paste Form HTML

Paste your FormBnB form HTML into the block.

Publish

Publish your site.

Example: Portfolio Contact Form

<form action="https://api.formbnb.com/f/YOUR_ORG/YOUR_FORM" method="POST" style="max-width:480px;font-family:inherit;">
  <input type="text" name="_gotcha" style="display:none">

  <div style="margin-bottom:16px;">
    <label style="display:block;font-size:13px;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;">Name</label>
    <input type="text" name="name" required
      style="width:100%;padding:10px;border:none;border-bottom:1px solid #ccc;font-size:15px;font-family:inherit;background:transparent;">
  </div>

  <div style="margin-bottom:16px;">
    <label style="display:block;font-size:13px;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;">Email</label>
    <input type="email" name="email" required
      style="width:100%;padding:10px;border:none;border-bottom:1px solid #ccc;font-size:15px;font-family:inherit;background:transparent;">
  </div>

  <div style="margin-bottom:16px;">
    <label style="display:block;font-size:13px;text-transform:uppercase;letter-spacing:1px;margin-bottom:6px;">Project Details</label>
    <textarea name="message" rows="5" required
      style="width:100%;padding:10px;border:none;border-bottom:1px solid #ccc;font-size:15px;font-family:inherit;resize:vertical;background:transparent;"></textarea>
  </div>

  <button type="submit"
    style="padding:12px 32px;background:#000;color:#fff;border:none;font-size:13px;text-transform:uppercase;letter-spacing:1px;cursor:pointer;">
    Send Inquiry
  </button>
</form>

Minimal Email Capture

A simple email capture for your portfolio landing page:

<form action="https://api.formbnb.com/f/YOUR_ORG/YOUR_FORM" method="POST"
  style="display:flex;gap:8px;max-width:400px;font-family:inherit;">
  <input type="text" name="_gotcha" style="display:none">
  <input type="email" name="email" placeholder="your@email.com" required
    style="flex:1;padding:10px;border:none;border-bottom:1px solid #ccc;font-size:14px;font-family:inherit;background:transparent;">
  <button type="submit"
    style="padding:10px 20px;background:#000;color:#fff;border:none;font-size:13px;text-transform:uppercase;letter-spacing:1px;cursor:pointer;">
    Submit
  </button>
</form>

Use border-bottom instead of full borders and background: transparent to match Cargo’s minimal design aesthetic.

​Why Use FormBnB with Cargo

​Setup Steps

​Example: Portfolio Contact Form

​Minimal Email Capture

Why Use FormBnB with Cargo

Setup Steps

Example: Portfolio Contact Form

Minimal Email Capture