Paynch Button v2.2.0 - Documentación Oficial

📦 Instalación Rápida

Pega este código HTML donde desees que aparezca el botón de pago:

<script src="https://pay.paynch.app/botao/button23.js"
  data-shop="0xE5fF9d546278a7CE0DF261EB85945Df2F0Dcc3c6"
  data-amount="15.00"
  data-order-id="pedido-123"
  data-product-name="Acceso Premium"
  data-redirect="https://tutienda.com/gracias"
  data-theme="light"
  data-language="es"
  data-currency="USDT"
  data-dev-mode="false">
</script>

✨ ¡Listo! Con solo esta línea de código tienes un sistema completo de pagos en criptomonedas con verificación automática y diseño responsivo.

⚙️ Parámetros de Configuración

Parámetros Obligatorios

Parámetro	Tipo	Descripción	Ejemplo
`data-shop` Obligatorio	String	Dirección del contrato de la tienda (dirección Ethereum)	`0xE5fF9d546278a7CE0DF261EB85945Df2F0Dcc3c6`
`data-amount` Obligatorio	Número	Monto en USDT (usa punto como separador decimal)	`15.00` o `99.90`
`data-order-id` Obligatorio	String	ID único del pedido (debe ser diferente en cada transacción)	`pedido-123`, `ORD_abc456`
`data-redirect` Obligatorio	URL	URL a la que redirigir tras confirmar el pago exitoso	`https://tutienda.com/gracias`

Parámetros Opcionales

Parámetro	Tipo	Por defecto	Descripción
`data-product-name` Opcional	String	`"Producto"`	Nombre del producto mostrado
`data-theme` Opcional	String	`"default"`	Tema: `default`, `dark`, `light`
`data-language` Opcional	String	`"en"`	Idioma: `en`, `pt-BR`, `es`
`data-currency` Opcional	String	`"USDT"`	Símbolo del token de pago (Si usas tu propio token para recibir pagos, es necesario ingresar su símbolo)
`data-dev-mode` Opcional	Boolean	`false`	Modo desarrollo (simula transacciones)
`data-script-path` Opcional	URL	`null`	Ruta personalizada del script

📝 Ejemplos Prácticos

Ejemplo 1: HTML estático

<!DOCTYPE html>
<html>
  <head><title>Mi Tienda</title></head>
  <body>
    <h1>Producto Premium</h1>
    <script src="https://pay.paynch.app/botao/button23.js"
      data-shop="0xE5fF9d546278a7CE0DF261EB85945Df2F0Dcc3c6"
      data-amount="25.00"
      data-order-id="pedido-456"
      data-product-name="Producto Premium"
      data-theme="light"
      data-language="es"
  data-currency="USDT"
      data-dev-mode="false">
    </script>
  </body>
</html>

Ejemplo 2: PHP dinámico

<?php
// Configuración del producto
$producto = [
  'nombre' => 'Curso Completo Web3',
  'precio' => 99.90
];
// Generar ID único (guárdalo en BD para validación posterior)
$orderId = uniqid('pedido_');
// Configuración Paynch
$paynchConfig = [
  'contrato' => '0xE5fF9d546278a7CE0DF261EB85945Df2F0Dcc3c6',
  'urlRedirect' => 'https://mitienda.com/gracias'
];
?>
<!-- Botón Paynch -->
<script src="https://pay.paynch.app/botao/button23.js"
  data-shop="<?= htmlspecialchars($paynchConfig['contrato']) ?>"
  data-amount="<?= number_format($producto['precio'], 2, '.', '') ?>"
  data-order-id="<?= htmlspecialchars($orderId) ?>"
  data-product-name="<?= htmlspecialchars($producto['nombre']) ?>"
  data-redirect="<?= $paynchConfig['urlRedirect'] ?>?orderId=<?= urlencode($orderId) ?>"
  data-theme="light"
  data-language="es"
  data-currency="USDT"
  data-dev-mode="false">
</script>

🎨 Temas Visuales

Paynch Button ofrece 3 temas preconfigurados:

Default

Morado moderno vibrante

data-theme="default"

Oscuro

Modo oscuro elegante

data-theme="dark"

Claro

Minimalista claro y limpio

data-theme="light"

💡 Consejo: Elige el tema que mejor combine con el diseño de tu sitio. ¡Todos son 100% responsivos!

✨ Características

⚡ Cero Configuración

Solo una línea de código. Sin imports ni setups complejos.

🔄 Lógica de Reintentos

Sistema inteligente con múltiples rutas de fallback.

🔍 Verificación Automática

Monitorea la blockchain cada 3 segundos hasta confirmar.

📱 100% Responsivo

Funciona perfecto en escritorio, tablet y móvil.

🌍 Multi-idioma

Soporte nativo para inglés, portugués y español.

🎨 3 Temas Listos

Default, Oscuro y Claro – el que mejor se adapte a tu sitio.

🛡️ Seguridad y Mejores Prácticas

Validación de Order ID

❌ NO HAGAS: IDs predecibles o duplicados

                    $orderId = "pedido-1"; // MUY MALO!
$orderId = $_GET['id']; // INSEGURO!
                

✅ SÍ HAZ: IDs únicos e impredecibles

                    // Bueno
$orderId = uniqid('PED_', true);
// Excelente!
$orderId = 'PED_' . time() . '_' . bin2hex(random_bytes(8));
                

Validación en Backend (¡ESENCIAL!)

Siempre valida el pago en el servidor antes de entregar el producto:

<?php
// Página de confirmación (gracias.php)
$orderId = $_GET['orderId'] ?? null;
if (!$orderId) {
  die('ID de pedido inválido');
}
// Consulta a la API de Paynch
$paynchApi = 'https://pay.paynch.app/paynch.php';
$contrato = '0xE5fF9d546278a7CE0DF261EB85945Df2F0Dcc3c6';
$response = file_get_contents(
  "$paynchApi?contract=$contrato&orderId=$orderId"
);
$data = json_decode($response, true);
if ($data['success'] === true && $data['count'] > 0) {
  // ✅ ¡PAGO CONFIRMADO!
  $pdo->prepare(
    "UPDATE pedidos 
     SET estado = 'pagado'
     WHERE order_id = ?"
  )->execute([$orderId]);
  echo '✅ Pago confirmado!';
} else {
  echo '⏳ Esperando confirmación...';
}
?>

Escape de datos (Prevención de XSS)

// 🔐 SIEMPRE usa htmlspecialchars() para valores HTML
data-shop="<?= htmlspecialchars($paynchConfig['contrato']) ?>"
data-order-id="<?= htmlspecialchars($orderId) ?>"
data-product-name="<?= htmlspecialchars($producto['nombre']) ?>"

// 🌐 Para URLs usa urlencode()
data-redirect="<?= $baseUrl ?>?orderId=<?= urlencode($orderId) ?>"

⚠️ IMPORTANTE: Siempre usa punto (.) como separador decimal en data-amount:

✅ Correcto: data-amount="15.00"
❌ Incorrecto: data-amount="15,00"

🚨 Solución de Problemas

Problema: El botón no aparece

Solución:

Verifica que los 3 parámetros obligatorios estén presentes (data-shop, data-amount, data-order-id)
Abre la consola del navegador (F12) y busca errores
Confirma que la URL del script sea correcta

Problema: El pago no es detectado

Solución:

Espera hasta 10 minutos (200 chequeos × 3 segundos)
Verifica que el Order ID sea correcto
Confirma que la transacción fue enviada al contrato correcto
Obtén el orderId (pasado como 'orderid' en la URL) y verifica en el dashboard
Consulta manualmente la API: https://pay.paynch.app/paynch.php?contract=...&orderId=...

Problema: Formato incorrecto del monto

Error común: Usar coma (,) en data-amount

✅ Correcto: data-amount=""
❌ Incorrecto: data-amount=""

Usa nuestra IA si necesitas ayuda

💬 ¿Necesitas ayuda? Nuestra IA está disponible 24/7 para responder dudas de integración y resolución de problemas.
Abrir Chat de Soporte IA

✅ Checklist para Producción

Antes de lanzar en producción, verifica:

Probado con data-dev-mode="true"
Todos los parámetros obligatorios validados
IDs de pedido únicos e impredecibles generados
Validación en backend implementada (¡esencial!)
Flujo completo probado con transacción real
Página de redirección configurada
Todos los datos dinámicos escapados (XSS)
Montos formateados con punto decimal
Probado en móvil y escritorio
data-dev-mode="false" configurado
Contrato utilizado documentado
Logs y monitoreo configurados