[📖] Steps for adding Partytown to a plain (not headless) Shopify 2.0 Theme that does NOT use Builder.io

[bryanyi]

Suggestion

I'd like to implement Partytown to a plain Shopify 2.0 theme that does not use Builder.io nor is it headless. Just plain Shopify 2.0 which has that strict file structure that any Shopify developer is familiar with (/assets, /layout, /templates, /snippets, etc).

Is there a way to accomplish this? If so, how?

From what I'm reading, Partytown depends on having some type of public folder to put the /~partydown directory in, but Shopify 2.0 themes don't have a /public folder that can be referenced.

That leaves us referencing any javascript file from the /assets folder, but that requires Liquid syntax to reference the file such as <script type="text/javascript" src="{{ 'partytown.js' | asset_url }}"></script>, which doesn't work.

In addition, subfolders are not allowed in the /assets directory.

So I can't do this: <script type="text/javascript" src="{{ '~partytown/partytown.js' | asset_url }}"></script>

...without getting this error:

[development] (assets/~partytown/partytown.js) "assets/~partytown/partytown.js" contains illegal characters and Theme files may not be stored in subfolders\

I tried to copy & paste the minified Partytown files inside of theme.liquid inside of script tags, but that didn't work either.

Any suggestions or workaround to implement Partytown to Shopify 2.0 would be appreciated!

[JulianSchnehage]

@malipetek made a repo and a screencast demonstrating how to make a simple app to load partytown.js from your myshopify.com URL:

https://github.com/malipetek/shopify-partytown

Still have the issue of trying to add type="text/partytown" to scripts loaded by apps in {{ content_for_header }} and some CORS errors

[j0Shi82]

Somebody asked me the same thing on the Shopify community forums because I'm currently building OS 2.0 with Partytown.

I'm almost finished working on a showcase called Partydawn, an example of Shopify's Dawn theme with Partytown integration. So far I've successfully implemented Google Analytics and Facebook, Google Tag Manager, Matomo, and Klaviyo. There are different ways to work with Shopify OS 2.0 and Partytown. You can move Shopify's own tracking logic (Trekkie) into Partytown and use the standard integrations for GA4 and Facebook (which then will run within the Web Worker as well).

You can also write own Web Pixels, hook into costumer events, and forward them to tracking installed with Partytown using an event bridge that utilizes the sessionStorage API.

And you can of course load scripts directly with the text/partytown property, wired to Shopify's Customer Privacy API if needed.

It's a bit of a headache to get there, but definitely possible. I guess I could contribute to the documentation and write something up.

[wrknd]

Somebody asked me the same thing on the Shopify community forums because I'm currently building OS 2.0 with Partytown.

I'm almost finished working on a showcase called Partydawn, an example of Shopify's Dawn theme with Partytown integration. So far I've successfully implemented Google Analytics and Facebook, Google Tag Manager, Matomo, and Klaviyo. There are different ways to work with Shopify OS 2.0 and Partytown. You can move Shopify's own tracking logic (Trekkie) into Partytown and use the standard integrations for GA4 and Facebook (which then will run within the Web Worker as well).

You can also write own Web Pixels, hook into costumer events, and forward them to tracking installed with Partytown using an event bridge that utilizes the sessionStorage API.

And you can of course load scripts directly with the text/partytown property, wired to Shopify's Customer Privacy API if needed.

It's a bit of a headache to get there, but definitely possible. I guess I could contribute to the documentation and write something up.

This would be highly appreciated 💚

[j0Shi82]

Somebody asked me the same thing on the Shopify community forums because I'm currently building OS 2.0 with Partytown. I'm almost finished working on a showcase called Partydawn, an example of Shopify's Dawn theme with Partytown integration. So far I've successfully implemented Google Analytics and Facebook, Google Tag Manager, Matomo, and Klaviyo. There are different ways to work with Shopify OS 2.0 and Partytown. You can move Shopify's own tracking logic (Trekkie) into Partytown and use the standard integrations for GA4 and Facebook (which then will run within the Web Worker as well). You can also write own Web Pixels, hook into costumer events, and forward them to tracking installed with Partytown using an event bridge that utilizes the sessionStorage API. And you can of course load scripts directly with the text/partytown property, wired to Shopify's Customer Privacy API if needed. It's a bit of a headache to get there, but definitely possible. I guess I could contribute to the documentation and write something up.

This would be highly appreciated 💚

https://github.com/j0Shi82/shopify-partydawn

There's a working example at https://partydawn.myshopify.com/ (password: partydawn).

[j0Shi82]

https://partytown.builder.io/shopify-os2

If you need assistance for themes other than Dawn, I'd be happy to help. Just reach out or open an issue within Partydawn.