Proteside Sello Proteside
Muestra el sello estático opcional que indica a los clientes que el checkout está monitoreado.
El sello Proteside es un fragmento de HTML estático y opcional que pegas donde quieras en el checkout (por ejemplo, en el pie de página). Muestra a los clientes que la página está monitoreada y lleva a la página pública de verificación de la tienda.
El sello es independiente del SDK: no tiene JavaScript, no hace solicitudes de imagen y no depende del snippet de instalación. El SDK no muestra ningún sello automáticamente.
Obtener el sello
Abre los ajustes de la tienda
En el dashboard, ve a Ajustes → Tienda, sección Sello Proteside.
Revisa la página de verificación
En Página de verificación, abre el enlace de tu tienda (https://safe.proteside.com/ seguido del identificador de
la tienda) y confirma que carga. Usa Copiar enlace si quieres compartir la dirección en otro lugar.
Copia el fragmento
Haz clic en Copiar en el bloque de código, debajo de la Vista previa del sello.
Pégalo en el checkout
Pega el fragmento en el punto de la página donde debe aparecer el sello y publica.
El fragmento
El sello es un enlace con estilos inline y el escudo de Proteside en SVG. El dibujo del escudo está abreviado abajo; copia el fragmento completo del dashboard.
<!-- Proteside Security Badge -->
<a href="https://safe.proteside.com/mi-tienda" target="_blank" rel="noopener noreferrer"
aria-label="Protegido por Proteside — haga clic para verificar" title="Protegido por Proteside"
style="display:inline-flex;align-items:center;gap:7px;padding:6px 11px 6px 8px;background:#0D1117;border:1px solid rgba(45,140,240,.30);border-radius:9px;box-shadow:0 2px 10px rgba(0,0,0,.45);text-decoration:none;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;">
<span style="width:6px;height:6px;border-radius:50%;background:#3FB950;flex-shrink:0;"></span>
<svg width="16" height="20" viewBox="…" xmlns="http://www.w3.org/2000/svg"><!-- escudo --></svg>
<span style="font-size:11px;font-weight:700;color:#E6EDF3;letter-spacing:.10em;text-transform:uppercase;line-height:1;white-space:nowrap;">Proteside</span>
</a>- El texto accesible (
aria-labelytitle) sale en el idioma en que usas el dashboard (portugués, español o inglés). Si la tienda atiende en otro idioma, ajusta esos dos atributos. - El sello tiene colores oscuros fijos.
Sello fijo en la esquina de la pantalla
Para dejar el sello fijo en la esquina inferior derecha, agrega al principio del atributo style del <a>:
position:fixed;bottom:0;right:0;z-index:2147483647;margin:16px;Un sello fijo, con z-index alto, queda por encima de otros elementos. Evita posicionarlo sobre los campos de pago:
el SDK alerta sobre los elementos posicionados que cubren campos sensibles.
CSP
Como usa atributos style="…", el sello necesita style-src 'unsafe-inline' o style-src-attr 'unsafe-inline' en la
Content Security Policy. No necesita img-src, porque el escudo es un SVG inline. Consulta
Content Security Policy y headers.