How to integrate Web Pixel extensions in Rails app

Retired Boards Appdev Extensions
1

I have a Ruby on Rails-based Shopify App (based on the official Rails engine provided by Shopify) and I’m looking to enhance it’s functionality by collecting additional data within the Rails app via a Shopify Web Pixel.

I can’t find any documentation on how to upload the JavaScript for the Web Pixel from Ruby/Rails. The docs say to use the Shopify CLI but this seems to assume the whole Shopify app is built in Nodejs rather than Rails – is there a way to standalone upload the Web Pixel from Rails?

I can see the CLI uses an “ExtensionCreate” API – but can’t see this documented anywhere as to what the inputs are, so I could replicate it in Ruby.

2

Hello,

You should use the @Shopify_77 /cli and @Shopify_77 /app npm packages

Extensions can be pushed to a Shopify app using the CLI commands e.g

yarn shopify app deploy

You will need to follow the instructions to add a config file to your codebase.

You can put the extensions in the rails app folder but they are not directly connected to the rails app itself.

You can think of it like the extension and the rails app are both connected to same Shopify app but they are completely separate things

I build rails apps with Shopify extensions and it works fine

3

Thanks for the reply Jordan. I hadn’t tried that command, the docs I was following didn’t mention it – and it worked with one exception: after creating the extension, it fails on creating a new version.

I’m not sure why it bundles a UI extension when it’s just a web pixel, here’s the output of the yarn shopify app deploy command:

? Release a new version of [app-name]?
✔ Yes, release this new version

✔ Created extension [web-pixel-extension-name].

Releasing a new app version as part of [app-name]

[web-pixel-extension-name]. │ Bundling UI extension [web-pixel-extension-name]....
[web-pixel-extension-name]. │ [web-pixel-extension-name]. successfully built

╭─ error ────────────────────────────────────────────────────────────────────────────────────────╮
│ │
│ Version couldn't be created. │
│ │
│ [web-pixel-extension-name] │
│ │
│ Validation errors │
│ • Missing expected key(s). │
│ │
╰────────────────────────────────────────────────────────────────────────────────────────────────╯

It doesn’t give any clarity on what key is missing from where.

FWIW, my shopify.extension.toml file just contains:

type = "web_pixel_extension"
name = "[web-pixel-extension-name]"
runtime_context = "strict"

Any my shopify.app.toml includes:

name = "[app-name]"
client_id = "[redacted]"
application_url = "[redacted]"
embedded = true

[access_scopes]
scopes = "write_pixels,read_customer_events"
use_legacy_install_flow = true

[webhooks]
api_version = "2023-10"

[app_proxy]
url = "[redacted]"
subpath = "[redacted]"
prefix = "apps"

[pos]
embedded = false

If you have any clues from your own setup, that would be appreciated @jordanholmes !

4

@twnsnd I’m trying to do the same thing here. I have a new Rails app from the Shopify rails engine (https://github.com/Shopify/shopify_app) and I’m trying to add an extension to it. When I’m in the rails root directory and I try to create an extension with:

yarn shopify app generate extension --template web_pixel --name web-pixel-name

I get the following error:

yarn run v1.22.21
error Couldn't find a package.json file in "[redacted]"

Is the extension supposed to be a separate codebase from the rails app? Any insight you could provide me as to how you managed to do this? (Assuming you have figured this out since your comment)