Skip to main content
Get VIZOCHOK up and running in your storefront in just a few minutes.

​
Prerequisites

  • A VIZOCHOK tenant account with API keys (contact us or use the admin panel)
  • A web page or storefront where you want to embed the widget
1

Get Your API Keys

Log into the VIZOCHOK Admin Panel and navigate to Settings > API Keys.You’ll need two keys:
  • Public key (pk_...), used in the widget, safe to expose in frontend code
  • Secret key (sk_...), used for server-to-server API calls, keep this private
Never expose your secret key (sk_...) in client-side code. The secret key is for backend-to-backend communication only.
2

Install the Widget

Choose your preferred installation method:
npm install @vizochok/widget
3

Initialize the Widget

Add the following code to your page:
import { VIZOCHOKWidget } from '@vizochok/widget';

const widget = new VIZOCHOKWidget({
  apiKey: 'pk_your_public_key',
  apiUrl: 'wss://api.vizochok.com/ws',
  userId: 'customer-123',       // your customer's unique ID
  locale: 'uk',                 // 'uk' or 'en'
});

widget.mount();
The userId should be a stable identifier for the customer (e.g., their account ID). This enables per-user rate limiting and conversation history.
4

Upload Your Product Catalog

The AI assistant needs product data to search and recommend products. Upload your catalog using the REST API:
curl -X PUT https://api.vizochok.com/api/v1/catalog/products \
  -H "Authorization: Bearer sk_your_secret_key" \
  -H "Content-Type: application/json" \
  -d '{
    "products": [
      {
        "sku": "milk-001",
        "name": "Milk 2.5% Lactel",
        "category": "Dairy",
        "unit": "pcs"
      }
    ]
  }'
For full details on catalog format and bulk uploads, see the Catalog Upload guide.
Without a catalog, the assistant will respond with “no catalog data available” when users ask about products.
5

Test It Out

Open your page in a browser. You should see the VIZOCHOK chat button in the bottom-right corner.Click it and try asking:
  • “What milk do you have?”
  • “Find me something for breakfast”
  • “Add 2 bottles of water to my cart”
If you haven’t uploaded a product catalog yet, the assistant will let you know there’s no catalog data available. Head to the Catalog Upload guide to load your products.

​
What’s Next?

Upload Your Catalog

Load your product data so the AI can search and recommend products.

Set Up Webhooks

Connect your backend for real-time prices, stock, and cart operations.

Customize the Widget

Match the widget’s look and feel to your brand.

Widget Configuration

Explore all available configuration options.