Integraciones sin código (Wix, Shopify, Webflow)
Puede añadir SOAMTAR a cualquier creador de sitios web, incluso sin servidor propio.
Wix (con Velo)
Wix permite ejecutar código en el servidor de forma segura con Velo.
1. Backend (backend/pay.jsw)
Cree un archivo de web method para mantener su clave API en el servidor. Guarde la clave en el Secrets Manager de Wix (con el nombre SOAMTAR_SECRET_KEY), nunca en el código, y calcule el precio en el servidor: cualquiera puede llamar a una web method con cualquier argumento.
import { fetch } from 'wix-fetch';
import { getSecret } from 'wix-secrets-backend';
import wixData from 'wix-data';
// The page can call this with any argument: accept a product id, never a price.
export async function createPayment(productId) {
const product = await wixData.get('Products', productId);
if (!product) throw new Error('Unknown product');
const apiKey = await getSecret('SOAMTAR_SECRET_KEY'); // Wix Secrets Manager
const merchantRef = 'WIX-' + productId + '-' + Date.now();
const response = await fetch("https://app.so-amtar.com/v1/payments", {
method: 'post',
headers: {
"Content-Type": "application/json",
"Authorization": "Bearer " + apiKey,
"Idempotency-Key": merchantRef
},
body: JSON.stringify({
amount: Number(product.price).toFixed(2), // price read on the server
currency: "SLE",
merchant_ref: merchantRef
})
});
const result = await response.json();
// Return only what the page needs, never the raw API response.
return { payment_url: result.data ? result.data.payment_url : null };
}2. Frontend
Llame a su función de backend al hacer clic en el botón.
import { createPayment } from 'backend/pay.jsw';
import wixLocation from 'wix-location';
$w("#payButton").onClick(async () => {
const result = await createPayment("YOUR_PRODUCT_ID");
if (result.payment_url) {
wixLocation.to(result.payment_url);
}
});Shopify (botón personalizado)
Si no usa la aplicación oficial, puede añadir un botón personalizado a su tema.
- Vaya a Tienda online > Temas > Personalizar.
- Añada una sección HTML personalizado.
- Pegue el siguiente código, con un enlace de pago creado en su panel SOAMTAR:
<a href="https://app.so-amtar.com/pay/your-product"
style="background: #FF7900; color: white; padding: 15px 30px; text-decoration: none; border-radius: 5px; font-weight: bold;">
Pay with Orange Money
</a>Webflow / Squarespace / Bubble
En estas plataformas, use un enlace de pago de su panel. No requiere código ni clave API: el cliente introduce su número Orange Money en la página de SOAMTAR y confirma con su PIN.
Botón universal
Pegue este código en un bloque «Embed» o «Code»:
<a href="https://app.so-amtar.com/pay/your-fixed-link"
style="display:inline-block; background:#000; color:#fff; padding:12px 24px; border-radius:8px; text-decoration:none;">
Pay securely with Orange Money
</a>Seguridad sin código
- Claves API: NUNCA pegue una clave
sk_live_…osk_test_…en un bloque HTML ni en el código frontend de Wix/Webflow. Use siempre un entorno de backend (como Velo en Wix) o enlaces de pago generados de antemano. - Webhooks: en las plataformas sin código, recomendamos Zapier o Make para recibir nuestras notificaciones y actualizar su base de datos. Una URL de catch hook acepta todo lo que cualquiera le envíe: antes de actualizar nada, vuelva a leer el pago con
GET/v1/payments/{id}(clave secreta guardada en la conexión del escenario) y use ese estado.