This package is deprecated. To integrate a third party script with your Nuxt project, follow our docs here: https://docs.getnacelle.com/nuxt/external-scripts.html
Adds Vue.js components for integrating Swell loyalty and referrals in your Nacelle Nuxt project.
- A Nacelle project set up locally. See https://docs.getnacelle.com for getting started.
- A Swell app installed and setup on your Shopify store.
Once you hace Nacelle and Swell set up you can install this module in your project from npm
:
npm install @nacelle/nacelle-swell-nuxt-module --save
After the package has installed, open nuxt.config.js
. Under modules
add @nacelle/nacelle-swell-nuxt-module
to the array. It should look something like this:
modules: [
'@nuxtjs/pwa',
'@nuxtjs/dotenv',
'@nacelle/nacelle-nuxt-module',
'@nuxtjs/sitemap',
'@nacelle/nacelle-swell-nuxt-module'
],
Then add your Swell GUID to your environment variables .env
file.
SWELL_GUID=xxxxxxxxxxxxx
To make the Swell widget visible in your store, open up layouts/default.vue
and paste <swell-widget />
just before the closing div
in the template.
To complete the integration a liquid snippet needs to be added to your Shopify theme.
Open your Shopify theme code editor under "Actions > Edit Code". Under "Snippets" click "Add new snippet". Name the snippet swell-nacelle-init.liquid
, paste the following code found here.
Open layout/theme.liquid
and and before the closing body
tag paste {% include 'swell-nacelle-init' %}
. Your Shopify account pages will now set the correct Swell data to be used in your Nacelle store.