Use a third party JS SDK into Velo code via Custom Code from Site Configuration

I’m having trouble with
Briefly explain what’s not working or where you’re stuck

Im trying to inject a third-party JS SDK with

<script type="text/javascript" src="``https://js.openpay.mx/openpay.v1.min.js``"></script>

But as the Velo editor does’t allow that, then I’m looking into a way to integrate, run and use on Velo code. I’ve tryed HTML embedded, Custom Code via Site Settings → $w.onReady() , and List Custom Embeds | API Reference

Working in

Wix Editor, Dev Mode, Velo.

e.g. Wix Studio Editor, Wix Editor, Dev Mode, CMS, etc.

What I’m trying to do
Describe the goal or outcome you’re hoping for

Import succesfully the JS SDK like a normal web workflow and continue using it into code.

What I’ve tried so far
Let us know what you’ve already tested, changed, or searched

This AI says it. What it proposes doesn’t work.

**
Does anyone know how or had this issue? Thanks!** :grinning_face_with_smiling_eyes:

AI sometimes get things wrong, and you’re right in this case :sweat_smile:

Based on the script provided, I’m guessing you’re aiming to integrate a third-party payment processor? If so, you’re likely better off exploring adding a Payment Provider Service Plugin - Tutorial: Payment Provider Service Plugin | Velo

This way, you’ll be able to use all of the Wix features for things like Stores and Bookings - and the payment processor will be available in the checkout :slight_smile:

1 Like

Via plugins it seems you can’t add libraries like

<script type="text/javascript" src="``https://js.openpay.mx/openpay.v1.min.js``"></script>

And then,

OpenPay.setId('MERCHANT_ID'); ​OpenPay.setApiKey('PUBLIC_API_KEY');

(Documentation says it needs to be implemented like that, not an AI)

TypeScript is not allowed. This would work in an iframe via HTML, but how to get it to work in Wix Velo/SDK?

As side note, the site has custom checkout, which means all the payment options from the dashboard are disabled, as we don’t want to ruin UI by using the default checkout interface.