Simulador Paga+Tarde

En Paga+Tarde hemos diseñado una herramienta para tu web con la que tus clientes podrán simular fácilmente una financiación a su medida.

Instrucciones de instalación

Instalación para módulos

Si usas Paga+Tarde con uno de nuestros módulos, puedes seguir el manual específico para tu plataforma o instalar el simulador usando las instrucciones para la instalación manual.

Instalación manual

Estas son las instrucciones para instalar la última versión del simulador (versión 3)

Mejoras introducidas con respecto a la versión 2

 

- Actualización del simulador en el cambio de precio base.

Utilizando nuestra función de actualización, los simuladores de tu página se refrescarán acorde al total que se muestra por pantalla. Aplícala, por ejemplo, cuando el usuario añada más productos a la cesta.


    <script>
    pmtClient.simulator.reload();
    </script>
    
 

- Estilos responsive

Hemos mejorado la hoja de estilos para que nuestros simuladores se ajusten a contenedores de cualquier ancho, soportando hasta un mínimo de 320px

El Simulador Paga+Tarde puede incrustarse prácticamente en cualquier lugar dentro de tu web, soportando distintas instancias en una misma página. El requisito indispensable es que todos vayan identificados con la clase css PmtSimulator.

Sigue sólo 3 pasos para configurarlo:

PASO 1.

Incluye nuestro script en todas las páginas que compongan tu web. Puedes copiar y pegar el siguiente código:

<script type="text/javascript"
src="https://cdn.pagamastarde.com/pmt-js-client-sdk/3/js/client-sdk.min.js">
</script>

PASO 2.

Añade tantos simuladores como necesites. Puedes añadir más de uno por página; simplemente deberán ir identificados con la clase css PmtSimulator

Tipo
Gama de colores
Simulador
 
Código a utilizar:
        
        <div class="PmtSimulator"
        data-pmt-num-quota="4" data-pmt-max-ins="12" data-pmt-style="blue"
        data-pmt-type="1"
        data-pmt-discount="0" data-pmt-amount="pmt-total" 
        data-pmt-expanded="no">
        </div>
      
 

PASO 3.

¡Añade tu Public Key* e inicia el Simulador!

Necesitarás hacer uso de las funciones que hemos creado para ello justo antes de la etiqueta </body> y después de la llamada al script descrita en el PASO 1:

  <script>
  (function(){
    pmtClient.setPublicKey('public_key');
    pmtClient.simulator.init();
  })();
  </script>

*Puedes consultar tu Public Key en tu área privada dentro de nuestro Back office

Casos especiales

Simulador de texto descriptivo

En este caso, el simulador no se inyectará dentro del div parametrizado sino que se añadirá a continuación de una etiqueta (típicamente de texto). Ejemplo:

Contaremos con la clase js-pmt-payment-type, de uso obligatorio. Necesitaremos añadirla a la etiqueta donde queramos visualizar el texto descriptivo. Ejemplo:

    <span class="pvp" style="display:none">432,45€</span>
    <span class="js-pmt-payment-type">Paga +Tarde</span>
    <div class="PmtSimulator" data-pmt-max-ins="12"
      data-pmt-num-quota="4"
      data-pmt-style="grey"
      data-pmt-type="4"
      data-pmt-discount="0"
      data-pmt-amount="pvp">
    </div>

Indicando la cantidad con la que calcular las cuotas

En la sección anterior comentábamos cómo debemos indicar al simulador la cantidad de la que partir para el cálculo de las cuotas. Utilizaremos el argumento data-pmt-amount con tres opciones:

1. Clase css:

  <span class="pvp" style="display:none">432,45€</span>
  <div class="PmtSimulator" data-pmt-max-ins="12"
  data-pmt-num-quota="4"
  data-pmt-style="grey"
  data-pmt-type="1"
  data-pmt-discount="0"
  data-pmt-amount="pvp">
  </div>

NOTA: el bloque que contiene el importe (el en este caso) debe estar al mismo nivel que el simulador. Si no está en el mismo nivel, el simulador no va a encontrar el bloque y va a mostrar el precio por defecto.

2. Id:

    <span id="pvp" style="display:none">432,45€</span>
    <div class="PmtSimulator" data-pmt-max-ins="12"
    data-pmt-num-quota="4"
    data-pmt-style="grey"
    data-pmt-type="2"
    data-pmt-discount="0"
    data-pmt-amount="pvp">
  </div>

NOTA: el bloque que contiene el importe (el en este caso) debe estar al mismo nivel que el simulador. Si no está en el mismo nivel, el simulador no va a encontrar el bloque y va a mostrar el precio por defecto.

3. Cantidad. Podemos indicar directamente el valor como parámetro:

  <div class="PmtSimulator" data-pmt-max-ins="12"
  data-pmt-num-quota="4"
  data-pmt-style="grey"
  data-pmt-type="3"
  data-pmt-discount="0"
  data-pmt-amount="432.45">
  </div>

Formato de moneda

Sea cual sea la manera elegida para indicar la cantidad base para los cálculos, ésta deberá respetar el formato de moneda soportado:

- Símbolos de moneda válidos:

- Separador de decimales: , (coma) o . (punto)

- Separador de miles: No soporta. La cantidad deberá introducirse sin caracter separador.

Problemas frecuentes

Consulta nuestro F.A.Q. de problemas comunes del simulador si tiene alguna incidencia con la instalación.

 

Para configuraciones customizadas por favor consulta con soporte@pagamastarde.com