Frontend: Wix Lightbox form with input fields.
Backend: Wix server-side function to securely send API requests.
Security: Smeetz API key is stored in the backend, never exposed on the client side.

1. Setup instructions

Step 1: Create the lightbox form

Go to + Add → Interactive → Lightboxes.
Choose a template or blank layout.
Rename it to RegisterPopup.
Add input fields:
- First Name - mandatory → ID: #firstName
- Last Name - mandatory → ID: #lastName
- Email - mandatory → ID: #email
Add a button:
- Label: Send
- ID: #sendButton

Make sure the IDs match exactly. They are case-sensitive.

Step 2: Create backend function

In the Code Files → Backend section, create a new .jsw file:
- Name: smeetzApi.jsw
Paste the following code:

// backend/smeetzApi.jsw
import { fetch } from 'wix-fetch';

export async function createCustomer(firstName, lastName, email) {
    const url = "https://api.smeetz.com/b2b2/prod/en/public/v1/customer";
    
    const payload = {
        firstName: firstName,
        lastName: lastName,
        title: "",
        email: email,
        phone: "",
        phoneVerified: "",
        gender: "",
        birthDate: "",
        allergies: "",
        remark: "",
        status: "2",
        company: "",
        taxNumber: "",
        emailMarketingOrganiser: 1,
        address: "",
        city: "",
        zipCode: "",
        country: "",
        language: "en"
    };

    try {
        console.log("Sending payload to Smeetz:", payload);

        const response = await fetch(url, {
            method: "POST",
            headers: {
                "Content-Type": "application/json",
                "x-public-api-key": "get your API key from Integrations"
            },
            body: JSON.stringify(payload)
        });

        if (!response.ok) {
            const text = await response.text();
            throw new Error(`API Error: ${text}`);
        }

        return response.json();

    } catch (error) {
        console.error("Error creating customer:", error);
        throw error;
    }
}

status: "2" – indicates that the customer is being recorded as a Marketing Qualified Lead (MQL).
emailMarketingOrganiser: 1 – means the customer is opted in to receive marketing emails.
- Set to 0 if you do not want the customer to be automatically subscribed to marketing campaigns.

📌 For more information on this API endpoint, you can refer to 🔗 this documentation page

Important: Never place your API key on the frontend. It must remain in the backend .jsw file, and you can get it from Integrations → Api Key

Step 3: Connect frontend to backend

Open your Lightbox code file (RegisterPopup.js) and paste:

import { createCustomer } from 'backend/smeetzApi.jsw';

$w.onReady(() => {
    $w('#sendButton').onClick(async () => {
        console.log("Button clicked");

        const firstName = $w('#firstName').value;
        const lastName = $w('#lastName').value;
        const email = $w('#email').value;

        console.log("Input values:", firstName, lastName, email);

        if (!firstName || !lastName || !email) {
            console.log("Validation failed");
            return;
        }

        $w('#sendButton').disable();
        $w('#sendButton').label = "Sending...";

        try {
            const result = await createCustomer(firstName, lastName, email);
            console.log("Backend result:", result);

        } catch (error) {
            console.error("API call failed:", error);

        } finally {
            $w('#sendButton').enable();
            $w('#sendButton').label = "Send";
        }
    });
});

2. How it works

User opens the registration form (Lightbox).
User enters First Name, Last Name, Email (which should all be mandatory fields)
User clicks Send.
The frontend code collects the input values and sends them to the backend function.
The backend function:
- Builds the payload for the Smeetz API.
- Sends a POST request to https://api.smeetz.com/b2b2/prod/en/public/v1/customer.
- Returns the response (success or error) to the frontend.
Frontend updates the button label and logs the result.

3. Notes for maintenance

IDs must match: Inputs (#firstName, #lastName, #email) and button (#sendButton).
Backend key security: The API key should only be in smeetzApi.jsw.
Error handling: Currently logged to the console. You can later integrate error pop-ups.
Form extensions: You can add additional fields (phone, company, etc.) and update the backend payload.

4. Conclusion

This integration provides a seamless way to capture customer information from your Wix website and automatically sync it with the Smeetz platform. By using a secure backend function, the API key remains protected while ensuring that all new registrations are recorded accurately.

The system is flexible and can be easily extended to include additional customer fields, custom validation, or marketing preferences. With this setup, your team can efficiently manage leads, track Marketing Qualified Leads, and maintain a streamlined connection between your website and Smeetz.

Integrate Wix subscription form with Smeetz customer API