Get to know our frameworks

Select an app template built on your preferred framework.

Build apps on our native app editor. Use drag and drop elements, Velo code and Wix APIs to develop custom features.

Streamline your app development process with the Wix CLI. Get a familiar developer experience with minimal setup and configuration.

Take full control over your app's tech stack, deployment, and hosting.

App templates

Wix Blocks templates

Wix CLI templates

Self-hosted templates

Kickstart your app development with templates built on your preferred Wix developer tool. Browse templates for practical foundation and get to know the Wix ecosystem.

Wix App Templates for Developers

This example apps can be used as a starting point for building your own app, for concrete examples of how to use Wix framework, or for inspiration.

Choose a template.<0 />Build an app.

Browse by:

How to build it step by step:

This template is built with:

Read how this template was built, step by step.

How we built this template

Deployment instructions:

Choose a package manager and run the command in your terminal.

Copy command

Before you get started, make sure you have the following:

Prerequisite steps

Get started with Wix CLI

Begin by setting up your Next.js project with your preferred hosting platform.

Select your hosting service

Start the deployment flow and set up your template repo on Netlify. After you finish set up, come back here and add your Netlify custom domain.

Copy the code from our Git repo to deploy your app on any platform that supports Next.js.

Start the deployment flow and set up your template repo on Vercel. After you finish set up, come back here and add your Vercel generated URL.

Add the base URL and give your app a name.

App details

Go to the app dashboard and test your app to ensure a smooth integration within the Wix ecosystem. <0>Learn more about app checks and testing</0>

Define your environment

Terminal

Related templates

Note

Warning

Your app name will be used as the namespace suffix.

Name your app to generate a namespace. This lets you refer to your app in code later on.

Go Headless

Build Apps

Client

API Preview

Ricos

Develop Websites

REST

Velo

GraphQL (Alpha)

# Introduction
To use the CRM API, import `wixCrmFrontend` from the `@wix/site-crm` module:

   ```javascript
   import wixCrmFrontend from '@wix/site-crm';
   ```

site-crm

Appends an existing contact or creates a contact if it doesn't exist.

The `appendOrCreateContact()` function returns a Promise
that resolves to a contact ID and identity type when a contact is found or created.

When called, `appendOrCreateContact()` accepts an object with contact information and follows the steps below.
When one of the conditions is met, this process ends and the specified
[data is handled](crm/contacts/appendorcreatecontact#how-the-data-is-handled):

1. **If the current visitor is a logged-in member:** `appendOrCreateContact()` reconciles with the member's associated contact.
2. **If the visitor is not a logged-in member:** `appendOrCreateContact()` tries to reconcile any specified email addresses and/or phone numbers with an existing contact.
3. **If no contact can be reconciled in the previous steps:** `appendOrCreateContact()` tries to reconcile the visitor's session identity with an existing contact.
4. **If no contact can be reconciled and an email address, phone number, or name are provided:** A new contact is created and `appendOrCreateContact()` reconciles with the new contact.
5. **If no contact can be created:** The Promise is rejected.

`appendOrCreateContact()` does not require member authentication,
so it does not return the entire contact object.
The contact's data can be retrieved with
[`getContact()`](https://www.sbdautomotive.com/ja/wg-cgi/dev.wix.com/docs/velo/api-reference/wix-crm-backend/contacts/getcontact)
from `wix-crm-backend`.

#### How the Data Is Handled

If an **existing contact** is found:

- The current visitor's session identity is associated with the contact.
- If a specified property is empty in the existing contact, the property is updated with the specified information.
- For arrays, any specified information is added as new array items. This includes `emails`, `addresses`, `phones`, and `labelKeys`.
- No existing data is overwritten or deleted.

> **Note:**
> If the reconciled contact belongs to a member
> who isn't currently logged in to the site,
> `identityType` is returned as `"NOT_AUTHENTICATED_MEMBER"`.
> In that case, no contact properties are modified.

If a **new contact** is created:

- The new contact's data is populated with the specified contact object.
- The current visitor's session identity is associated with the contact.

appendOrCreateContact

# Introduction
When a visitor first interacts with your site in a number of ways —
such as submitting a contact form or subscribing to a newsletter —
they're added to your site's
[Contact List](https://www.wix.com/my-account/site-selector/?buttonText=Select%20Site&title=Select%20a%20Site&autoSelectOnSingleSite=true&actionUrl=https:%2F%2Fwww.wix.com%2Fdashboard%2F%7B%7BmetaSiteId%7D%7D%2Fcontacts).
Once that happens, their details are available through the Contacts API.

Here are some examples of how a visitor could be converted to a contact:

- The visitor fills in a form with their contact details.
- The visitor signs up as a site member.
- A site contributor [imports a contact](https://support.wix.com/en/article/importing-contacts-by-uploading-a-csv-file-1066522)
  or [adds a contact manually](https://support.wix.com/en/article/manually-adding-contacts).

Contacts

Sends a triggered email to the current contact, unless that contact is marked as unsubscribed.

To learn more about Triggered Emails, see:

- [About Triggered Emails](https://support.wix.com/en/article/about-triggered-emails)
- [Creating a Triggered Email](https://support.wix.com/en/article/creating-a-triggered-email)
- [How to Send a Triggered Email to Contacts with Code](https://support.wix.com/en/article/how-to-send-a-triggered-email-to-contacts-with-code)

Before using the `emailContact()` function, you need to set up at least one
Triggered Email.

Specify which email to send by passing the email's ID in the `emailId` parameter.

You can use this function to send an email the current site visitor only. To receive the email, the site visitor must be subscribed or marked as 'subscription not set'.
If the site visitor is marked as unsubscribed, the email will not be sent.
Read more about how to check the contact's [subscription status](https://www.wix.com/velo/reference/wix-crm-backend/contacts/querycontacts#wix-crm-backend_contacts_querycontacts_supported-query-filters-for-extended-fields).

To send an email to a subscribed contact who is not the
current site visitor, use the wix-crm-backend [`triggeredEmails.emailContact()`](https://www.sbdautomotive.com/ja/wg-cgi/dev.wix.com/docs/velo/api-reference/wix-crm-backend/triggered-emails/emailcontact) function.

If the specified Triggered Email contains [variables](https://support.wix.com/en/article/using-variables-to-add-personalized-text),
you can pass values for those variables using the optional `options` parameter.
You pass the `options` object,
which contains the values to replace the variables
defined in your triggered email.
The values passed must be strings. If the object you
pass to the `variables` object does not contain a `key:value` pair for a
variable in your Triggered Email, the fallback value defined when creating
your Triggered Email is inserted in place of the variable.

Note that Triggered Emails generates a code snippet for each of your email
templates. The generated code includes the email's ID and keys for all the
email's variable names. You can copy and paste the snippet into your code.
Then, you need to define values for the `contactId` property and for each
variable key. To learn how to use the generated snippet in your code, see
[How to Send a Triggered Email with Code](https://support.wix.com/en/article/how-to-send-a-triggered-email-with-code).

emailContact

Fulfilled - When the email is sent.
Rejected - Error message.

Sends a Triggered Email to the currently logged-in site member.

To learn more about Triggered Emails, see:

 + [About Triggered Emails](https://support.wix.com/en/article/about-triggered-emails)
 + [Creating a Triggered Email](https://support.wix.com/en/article/creating-a-triggered-email)
 + [How to Send a Triggered Email to Members with Code](https://support.wix.com/en/article/how-to-send-a-triggered-email-to-members-with-code)

 Before using the `emailMember()` function, you need to set up at least one
 Triggered Email.

 Specify which email to send by passing the email's ID in the `emailId` parameter.

 Specify which member the email is sent to by passing the member's user ID in the `toUser`
 parameter. You can only send the email to the currently logged-in
 member. You can get that member's ID using the [`id`](members.Member.html#id) property
 of the [`currentMember`](#currentMember).

 If the specified Triggered Email contains
 [variables](https://support.wix.com/en/article/using-variables-to-add-personalized-text),
 you can pass values for those variables using the optional `options` parameter.
 You pass a `TriggeredEmailOptions` object
 which contains the values to be inserted into your email in place of the variables
 defined in that email. The values passed must be strings. If the object you
 pass to the `options` parameter does not contain a `key:value` pair for a
 variable in your Triggered Email, the fallback value defined when creating
 your Triggered Email is inserted in place of the variable.

 Note that Triggered Emails generates a code snippet for each of your email
 templates. The generated code includes the email's ID and keys for all the
 email's variable names. You can copy and paste the snippet into your code.
 Then, you need to define values for the `toUser` property and for each
 variable key. To learn how to use the generated snippet in your code, see
 [How to Send a Triggered Email with Code](https://support.wix.com/en/article/how-to-send-a-triggered-email-with-code).

> **Note:**
> The APIs in `wix-crm-frontend` are only partially functional when previewing your site.
> View a published version of your site to see their complete functionality.

emailMember

# Introduction
To learn more about Triggered Emails, see:

 - [About Triggered Emails](https://support.wix.com/en/article/about-triggered-emails)
 - [Creating a Triggered Email](https://support.wix.com/en/article/creating-a-triggered-email)
 - [How to Send a Triggered Email to Contacts with Code](https://support.wix.com/en/article/how-to-send-a-triggered-email-to-contacts-with-code)

Before using `emailContact()` or `emailMember()`, you must set up at least 1 Triggered Email.

> **Note:**
> Triggered Emails are included in the Email Marketing quota. However, similar to automations, Triggered Emails 
> will continue to send without interruption even if you reach your quota.

TriggeredEmails

AddressDetails

Main address line, usually street and number, as free text.

addressLine1

Street address object, with number and name in separate fields.

streetAddress

Free text providing more detailed address information,
 such as apartment, suite, or floor.

addressLine2

string

city

2-letter country code in an
 [ISO-3166 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2) format.

country

Human-readable address string.
 If not provided, the value is generated from the available address data.

formatted

location

AddressLocation

postalCode

Code for a subdivision (such as state, prefecture, or province) in an
 [ISO 3166-2](https://en.wikipedia.org/wiki/ISO_3166-2) format.

subdivision

AddressInfo

address

Address type.
`"UNTAGGED"` is shown as "Other" in the Contact List.

One of:

- `"UNTAGGED"`
- `"HOME"`
- `"WORK"`
- `"BILLING"`
- `"SHIPPING"`

latitude

number

longitude

ContactIdentification

ID of the contact that was found or created.

contactId

Identity type of the returned contact.

One of:

- `"CONTACT"`: The returned contact ID belongs to a new or existing contact.
- `"MEMBER"`: The returned contact ID belongs to the currently logged-in site member.
- `"NOT_AUTHENTICATED_MEMBER"`: The returned contact ID belongs to a site member who is not currently logged in.

identityType

ContactInfo

addresses

Contact's birthdate, formatted as `"YYYY-MM-DD"`.

 Example: `"2020-03-15"` for March 15, 2020.

birthdate

company

emails

Set of key-value pairs.

Contact's
[extended fields](https://www.sbdautomotive.com/ja/wg-cgi/dev.wix.com/docs/velo/api-reference/wix-crm-backend/contacts/introduction/about-extended-fields),
which allow you to store additional information about your contacts.

To view or create extended fields, use
[`findOrCreateExtendedField()`](https://www.sbdautomotive.com/ja/wg-cgi/dev.wix.com/docs/velo/api-reference/wix-crm-backend/contacts/findorcreateextendedfield),
[`getExtendedField()`](https://dev.wix.com/docs/velo/api-reference/wix-crm-backend/contacts/getextendedfield), or
[`queryExtendedFields()`](https://www.sbdautomotive.com/ja/wg-cgi/dev.wix.com/docs/velo/api-reference/wix-crm-backend/contacts/queryextendedfields).

extendedFields

object

Contact's job title.
 Corresponds to the **Position** field in the Dashboard.

jobTitle

List of contact label keys.
[Contact labels](https://support.wix.com/en/article/adding-labels-to-contacts-in-your-contact-list)
help categorize contacts.

Label keys must exist to be added to the contact.
Contact labels can be created or retrieved with
[`findOrCreateLabel()`](https://www.sbdautomotive.com/ja/wg-cgi/dev.wix.com/docs/velo/api-reference/wix-crm-backend/contacts/findorcreatelabel)
or
[`queryLabels()`](https://dev.wix.com/docs/velo/api-reference/wix-crm-backend/contacts/query-labels).

labelKeys

Contact's locale, formatted as an
 [IETF BCP 47 language tag](https://tools.ietf.org/html/rfc5646).
 Typically, this is a lowercase 2-letter language code,
 followed by a hyphen,
 followed by an uppercase 2-letter country code.

 For example, German from Germany is formatted as `de-DE`,
 and U.S. English is formatted as `en-US`.

locale

name

Name

phones

**Deprecated.** Use `profilePicture` instead.

picture

Picture

profilePicture

EmailInfo

email

Indicates whether this is the contact's primary email address.
 When changing `primary` to `true` for an email,
 the contact's other emails become `false`.

primary

boolean

Email type.

`"UNTAGGED"` is shown as "Other" in the Contact List.

One of:

- `"UNTAGGED"`
- `"MAIN"`
- `"HOME"`
- `"WORK"`

first

last

PhoneInfo

[ISO-3166 alpha-2](https://en.wikipedia.org/wiki/ISO_3166-1_alpha-2) country code.

countryCode

phone

Whether this is the contact's primary phone number.
 When changing `primary` to `true` for a phone,
 the contact's other phones become `false`.

Phone type.

`"UNTAGGED"` is shown as "Other" in the Contact List.

One of:

- `"UNTAGGED"`
- `"MAIN"`
- `"HOME"`
- `"MOBILE"`
- `"WORK"`
- `"FAX"`

image

imageProvider

StreetAddressInfo

TriggeredEmailOptions

An object with `key:value` pairs. Each
 `key` is a variable in the email template created in Triggered Emails, and its
 corresponding `value` is the value to insert into the template in place of the
 variable. The values must be strings.

Example: `{ firstName: 'John', lastName: 'Doe' }`

はじめに