Skip to main content

Shopify

Integrate Neuroon into your Shopify store in minutes.

Installation​

1. Add code to theme​

  1. Go to Online Store → Themes → Edit code
  2. Open the theme.liquid file
  3. Add before </head>:
<link rel="stylesheet" href="https://cdn.neuroon.ai/widget.css">
  1. Add before </body>:
<div id="neuroon-search"></div>

<script
  src="https://cdn.neuroon.ai/widget.js"
  data-token="{{ shop.metafields.neuroon.token }}"
  data-container="#neuroon-search">
</script>

2. Configure the token​

  1. Go to Settings → Metafields → Shop
  2. Create a metafield:
    • Namespace: neuroon
    • Key: token
    • Type: Single line text
  3. Save your Neuroon token
Alternative

If you prefer not to use metafields, you can put the token directly:

data-token="your_token_here"

Product Synchronization​

Option 1: Manual sync​

  1. Export your products from Products → Export
  2. Upload the CSV at Neuroon Dashboard → Products → Import

Configure a webhook for real-time synchronization:

  1. Go to Settings → Notifications → Webhooks
  2. Create a webhook:
    • Event: Product creation
    • URL: https://api.neuroon.ai/webhooks/shopify/{your_shop_id}
    • Format: JSON
  3. Repeat for Product update and Product deletion

Theme Customization​

To replace Shopify search with Neuroon:

  1. Find the file containing your search bar (usually header.liquid)
  2. Comment out or remove the existing search form
  3. Add the Neuroon container:
{%- comment -%} Native Shopify search (commented) {%- endcomment -%}
{%- comment -%}
<form action="/search" method="get">
  <input type="text" name="q">
</form>
{%- endcomment -%}

{%- comment -%} Neuroon Widget {%- endcomment -%}
<div id="neuroon-search"></div>

Custom styles​

Add styles in theme.liquid or a CSS file:

/* Customize the widget */
.neuroon-widget {
  --nrn-primary: {{ settings.colors_accent_1 }};
}

Troubleshooting​

Widget doesn't load​

  1. Verify the token is correct
  2. Check console for errors
  3. Ensure the script is before </body>

Products don't appear​

  1. Verify products are synced in the Dashboard
  2. Check that products are published in Shopify
  3. Review webhook logs