diff --git a/ghost/admin/app/components/settings/signup-form-embed.js b/ghost/admin/app/components/settings/signup-form-embed.js
index 5b01f61869..f1260ac0c9 100644
--- a/ghost/admin/app/components/settings/signup-form-embed.js
+++ b/ghost/admin/app/components/settings/signup-form-embed.js
@@ -40,15 +40,15 @@ export default class SignupFormEmbed extends Component {
         const siteUrl = this.config.blogUrl;
         const scriptUrl = this.config.signupForm.url.replace('{version}', this.config.signupForm.version);
 
-        // We need to fallback to name if slug is not set, because of newly created labels
-        const labels = this.labels.map(l => l.slug || l.name).join(',');
-
         const options = {
             site: siteUrl,
-            labels,
             color: this.settings.accentColor
         };
 
+        for (const [i, label] of this.labels.entries()) {
+            options[`label-${i + 1}`] = label.name;
+        }
+
         if (this.style === 'all-in-one') {
             options.logo = this.settings.icon;
             options.title = this.settings.title;
diff --git a/ghost/signup-form/src/utils/options.tsx b/ghost/signup-form/src/utils/options.tsx
index 85185e9b06..7fe82764a8 100644
--- a/ghost/signup-form/src/utils/options.tsx
+++ b/ghost/signup-form/src/utils/options.tsx
@@ -2,14 +2,22 @@ import React from 'react';
 import {SignupFormOptions} from '../AppContext';
 
 export function useOptions(scriptTag: HTMLElement) {
-    const buildOptions = React.useCallback(() => ({
-        title: scriptTag.dataset.title || undefined,
-        description: scriptTag.dataset.description || undefined,
-        logo: scriptTag.dataset.logo || undefined,
-        color: scriptTag.dataset.color || undefined,
-        site: scriptTag.dataset.site || window.location.origin,
-        labels: scriptTag.dataset.labels ? scriptTag.dataset.labels.split(',') : []
-    }), [scriptTag]);
+    const buildOptions = React.useCallback(() => {
+        const labels = [];
+
+        while (scriptTag.dataset[`label-${labels.length + 1}`]) {
+            labels.push(scriptTag.dataset[`label-${labels.length + 1}`] as string);
+        }
+
+        return {
+            title: scriptTag.dataset.title || undefined,
+            description: scriptTag.dataset.description || undefined,
+            logo: scriptTag.dataset.logo || undefined,
+            color: scriptTag.dataset.color || undefined,
+            site: scriptTag.dataset.site || window.location.origin,
+            labels
+        };
+    }, [scriptTag]);
 
     const [options, setOptions] = React.useState<SignupFormOptions>(buildOptions());
 
diff --git a/ghost/signup-form/test/e2e/form.test.ts b/ghost/signup-form/test/e2e/form.test.ts
index c3fd7b66c2..c834a45b2f 100644
--- a/ghost/signup-form/test/e2e/form.test.ts
+++ b/ghost/signup-form/test/e2e/form.test.ts
@@ -77,7 +77,7 @@ test.describe('Form', async () => {
         });
 
         test('Send a label when submitting the form', async ({page}) => {
-            const {frame, lastApiRequest} = await initialize({page, title: 'Sign up', labels: 'Hello world'});
+            const {frame, lastApiRequest} = await initialize({page, title: 'Sign up', 'label-1': 'Hello world'});
 
             // Fill out the form
             const emailInput = frame.getByTestId('input');
@@ -96,8 +96,8 @@ test.describe('Form', async () => {
             expect(lastApiRequest.body).toHaveProperty('email', 'jamie@example.com');
         });
 
-        test('Send multiple labels when submitting the form', async ({page}) => {
-            const {frame, lastApiRequest} = await initialize({page, title: 'Sign up', labels: 'Hello world,and another one'});
+        test('Sends multiple labels when submitting the form', async ({page}) => {
+            const {frame, lastApiRequest} = await initialize({page, title: 'Sign up', 'label-1': 'Hello world', 'label-2': 'and another one'});
 
             // Fill out the form
             const emailInput = frame.getByTestId('input');
@@ -116,6 +116,27 @@ test.describe('Form', async () => {
             expect(lastApiRequest.body).toHaveProperty('email', 'hey@example.com');
         });
 
+        test('Does not send labels when not the right numbering is used', async ({page}) => {
+            // Skip setting label-1, so label-2 is ignored
+            const {frame, lastApiRequest} = await initialize({page, title: 'Sign up', 'label-2': 'and another one'});
+
+            // Fill out the form
+            const emailInput = frame.getByTestId('input');
+            await emailInput.fill('hey@example.com');
+
+            // Click the submit button
+            const submitButton = frame.getByTestId('button');
+            await submitButton.click();
+
+            // Showing the success page
+            await expect(frame.getByTestId('success-page')).toHaveCount(1);
+
+            // Check the request body
+            expect(lastApiRequest.body).not.toBeNull();
+            expect(lastApiRequest.body).toHaveProperty('labels', []);
+            expect(lastApiRequest.body).toHaveProperty('email', 'hey@example.com');
+        });
+
         test('Cannot submit the form with invalid email address', async ({page}) => {
             const {frame, lastApiRequest} = await initialize({page, title: 'Sign up'});
 
diff --git a/ghost/signup-form/test/utils/e2e.ts b/ghost/signup-form/test/utils/e2e.ts
index 798e7828b2..09ef7db288 100644
--- a/ghost/signup-form/test/utils/e2e.ts
+++ b/ghost/signup-form/test/utils/e2e.ts
@@ -6,7 +6,7 @@ type LastApiRequest = {
     body: null | any
 };
 
-export async function initialize({page, ...options}: {page: any; title?: string, description?: string, logo?: string, color?: string, site?: string, labels?: string}) {
+export async function initialize({page, ...options}: {page: any; title?: string, description?: string, logo?: string, color?: string, site?: string, 'label-1'?: string, 'label-2'?: string}) {
     const url = `http://localhost:${E2E_PORT}/signup-form.min.js`;
 
     await page.goto('about:blank');