➤ Step 1: Open SmileGen

1. Log in to your BiteBot or SmileGen dashboard.

2. From the left sidebar, click SmileGen.

3. Make sure you are working on desktop view for the best experience.

➤ Step 2: Open the Embed Options

1. In the top-right corner of SmileGen, click “Embed on Website.”

2. A panel will open showing the different embed configuration options.

➤ Step 3: Enter Your Location ID

Every account has a unique Location ID.

• Enter your Location ID into the first field.

Check this article to find it: https://bitebot.freshdesk.com/a/solutions/articles/156000377985

➤ Step 4: Choose Your Form Type

You can choose between two types of forms:

1. Admin Form (for internal use)

• Allows video transformations

• Unlimited usage

• Intended for you and your staff only

2. Patient Form (recommended for websites)

• Patients can only do image transformations

• Max 3 transformations per day

• Best for embedding on a website or landing page

For public use, select Patient Form.

➤ Step 5: Choose Your Theme

You can select:

• Dark Theme

• Light Theme

The preview will show you what each theme looks like.

➤ Step 6: Set Your Width & Height

• Width is percentage-based (e.g., 100%)

• Height is pixel-based (e.g., 1000)

Adjust these values depending on how much space you want the form to occupy.

➤ Step 7: Generate Your Embed Code

Once your selections are ready:

1. Click Generate Code

2. Copy the iFrame code that appears

3. Give this code to your web developer, or paste it yourself if you manage your own site

This code works on ANY website platform (WordPress, Wix, Webflow, Shopify, etc.).

➤ Installing on BiteBot Landing Pages (For Full BiteBot Customers)

If you’re using BiteBot’s built-in landing pages, you can add the form directly inside the page builder.

1. Open the Landing Page

Select the page where you want to embed the SmileGen form.

2. Add a Code Block

• Delete any section you want to replace

• Click the “+” to add a new element

• Select Code Block

• Click Open Code Editor

3. Paste Your Embed Code

Paste the iFrame code you generated earlier.

4. Preview the Custom Code

If the form doesn’t appear immediately:

• Click the “Preview Custom Codes” button

• The SmileGen form will load on the page

5. Customize the Surrounding Content

For example, you can add a heading like:

“Preview your smile in 30 seconds using our AI tool”

Save and preview your page to confirm everything is displaying correctly.

You're All Set!

Your SmileGen form is now embedded and ready for patients to use.
Visitors can:

• Upload a photo

• Select a transformation

• Submit their info

• View their AI-generated results