¿Cómo configurar un TPV CECA como pasarela para un widget de tienda?

Si estás añadiendo un TPV virtual como pasarela de pago y ya has configurado el elemento de pasarela de pago de Codeeta, te queda un último paso por dar para que la configuración del TPV sea completa, consistente en notificar a los de la entidad elegida sobre nuestro servicio para que puedan dar permisos a Codeeta y que el cobro se realice correctamente desde tu widget.

ceca

 

 

En el caso de CECA, esto es lo que debes hacer:

Si quieres utilizar un TPV virtual perteneciente a la CECA (Confederación Española de Cajas de Ahorros) deberás escribir un correo electrónico a soporte.tpv@ceca.es identificándote con las credenciales de tu TPV virtual y solicitando la modificación de los siguientes parámetros:

  • Respuesta requerida: No
  • URL de notificación online: http://services.codeeta.com/cb/Euro6000Callback

Los responsables de la CECA te enviarán un correo confirmándote que han realizado los cambios de configuración que has solicitado y a partir de ese momento tu TPV virtual estará preparado para recibir pagos a través de widgets de Codeeta. Tu TPV virtual de la CECA cuenta con un sitio web para su administración y configuración online. Este sitio web está disponible en las siguientes direcciones web:

Cuando los responsables de la CECA realicen las modificaciones que has solicitado sobre tu TPV virtual, el módulo de administración online deberá reflejar los siguientes valores:

IMAGEN

Recuerda que para utilizar un widget de pago de Codeeta junto con tu TPV virtual perteneciente a la CECA deberás crear un perfil de pagos en Codeeta perteneciente a tu entidad bancaria o, si ésta no aparece en la lista, seleccionar ‘Entidades Euro6000’.

En el perfil de pago debes asignar las credenciales que te fueron proporcionadas cuando se te concedió tu TPV virtual:

IMAGEN

Configuración del TPV virtual de Servired para tu widget de tienda

Si estás añadiendo un TPV virtual como pasarela de pago y ya has configurado el elemento de pasarela de pago de Codeeta, te queda un último paso por dar para que la configuración del TPV sea completa, consistente en notificar a los de la entidad elegida sobre nuestro servicio para que puedan dar permisos a Codeeta y que el cobro se realice correctamente desde tu widget.

servired

Los pasos que debes seguir para terminar la configuración con Servired son los siguientes:

Cuando tu entidad bancaria perteneciente a Servired te proporciona un TPV virtual, éste se encuentra en el entorno de pruebas y no puede recibir pagos reales. Tu entidad bancaria te proporcionará la siguiente información:

  • Número de comercio
  • Número de terminal
  • Moneda del terminal
  • Clave secreta de encriptación
  • Tipo de clave

Servired requiere la realización de una serie de pruebas de validación y verificación como requisito previo al paso al entorno de producción, en el cual el TPV virtual puede recibir pagos reales. Codeeta te permite realizar estas pruebas de forma sencilla, sin necesidad de tener ningún conocimiento de programación, de manera que tu TPV virtual pueda pasar al entorno de producción rápidamente.

Con los datos suministrados podrás configurar tu pasarela de pago en Codeeta. De esta forma, tu perfil de pagos estará configurado para realizar las pruebas requeridas por Servired.

ENTORNO DE PRUEBAS

Hagamos ahora un par de simulaciones. Accede a tu widget. Para ello, visita la dirección donde se aloja tu widget la cual puedes encontrar fácilmente yendo a la sección Exportar y pulsando sobre la opción URL.

Exportación mediante URL
CASO A: Simulación de una operación autorizada

Pulsa sobre el botón de pago de tu widget, una vez hayas rellenado todos los campos obligatorios. A continuación tu TPV virtual presentará la página web en la que tus clientes introducirán sus datos bancarios para realizar sus compras.

Ejemplo de la pasarela de pagos a la que son redirigidos tus clientes

Esta página web es presentada por tu entidad bancaria, no por Codeeta, por tanto los datos bancarios de tus clientes están totalmente seguros. En esta página, introduce los siguientes datos para realizar la primera prueba de integración:

  • Número de tarjeta: 4548812049400004
  • Caducidad: 12/13
  • Código CVV2: 123

Si pulsas “Continuar”, el TPV virtual presentará una página en la que se solicita el código de autorización para comercio electrónico asignado por la entidad bancaria de tu cliente. Introduce el código de autorización 123456.

Segunda pantalla en el pago a través de un TPV de Servired

Pulsa Aceptar para completar la primera prueba. El TPV virtual mostrará a continuación la página en la que se muestra el resultado del pago.

Pantalla de confirmación de pago

CASO B: Simulación de una operación denegada

Accede a la URL de tu widget y pulsa sobre el botón de pago. En esta ocasión, cuando tu TPV virtual presente la página en la que tu cliente introduce sus datos bancarios deberás introducir los siguientes datos:

  • Número de tarjeta: 1111111111111111
  • Caducidad: 12/13

Si pulsas “Continuar”, tu TPV virtual mostrará la página de resultado indicando que la operación no ha podido ser realizada.

Pantalla de error en la introducción de credenciales bancarios

SOLICITUD PARA PASAR AL ENTORNO DE PRODUCCIÓN

Una vez completadas las dos pruebas se puede solicitar a Servired el paso de tu TPV virtual del entorno de pruebas al entorno de producción en el cual ya se podrán recibir pagos reales.

Para realizar esta solicitud debes enviar un correo electrónico a soportevirtual@sermepa.es indicando que quieres realizar el paso al entorno de producción. En el correo debes identificarte indicando tu número de comercio y el resto de datos que te fueron asignados al concederte el TPV virtual en el entorno de pruebas.

Servired realizará entonces unas pruebas de integración entre tu widget y tu TPV virtual. Desde Codeeta aconsejamos que en el email indiques la dirección web de tu widget de pagos de prueba o de tu página web en la que has insertado tu widget y que describas a Servired qué debe hacer para realizar un pago.

Tras realizar la solicitud a Servired para pasar tu TPV virtual al entorno de producción recibirás un correo electrónico confirmándote que éste ya se encuentra en producción. En el correo se te informará de cuál es la clave de encriptación asignada a tu comercio en el entorno de producción. Lo único que debes hacer es acceder al perfil de pagos que creaste inicialmente en Codeeta y cambiar la clave de encriptación que tenías en pruebas por la nueva clave de encriptación de tu comercio. Recuerda también de marcar Real en la opción Entorno. A partir de este momento todos los widgets a los que asocies este perfil de pagos recibirán pagos reales de tus clientes.

Cambio al entorno de producción en la configuración del widget

Para finalizar el paso de tu TPV virtual al entorno de producción, accede a tu widget y realiza dos pagos. Debes realizar un primer pago utilizando una tarjeta de crédito real y un pago denegado utilizando la tarjeta de pruebas 1111111111111111.

En este momento tu TPV virtual de Servired estará operativo en el entorno de producción y puede recibir pagos reales. Recuerda que Servired te proporciona un sitio online de administración de tu TPV virtual en el cual podrás realizar modificaciones en su configuración así como gestionar tus cobros, devoluciones, etc. La dirección web de este módulo de administración online te será proporcionada junto con el email de confirmación del paso a producción.

Configuración del TPV Virtual 4B para tu widget de tienda

Si estás añadiendo un TPV virtual 4B como pasarela de pago y ya has configurado el elemento de pasarela de pago de Codeeta, te queda un último paso por dar para que la configuración del TPV sea completa, consistente en notificar a los de la entidad elegida sobre nuestro servicio para que puedan dar permisos a Codeeta y que el cobro se realice correctamente desde tu widget.

4B

Los pasos que debes seguir para terminar la configuración con 4B son los siguientes:

1.- Accede al módulo de administración de tu TPV virtual en https://tpv.4b.es/config/html/default.html con las credenciales que te proporcionó tu entidad bancaria y pulsa en Cambiar Configuración en el menú situado en la parte izquierda de la pantalla.

2.- Modifica los parámetros que indicamos a continuación asignándoles los siguientes valores:

  • URL que devuelve el desglose de la compra: http://services.codeeta.com/cb/_4BCallback
  • URL que graba el resultado en la BD del comercio (TRANSACCIONES AUTORIZADAS): http://services.codeeta.com/cb/_4BCallback
  • URL que graba el resultado en la BD del comercio (TRANSACCIONES DENEGADAS): http://services.codeeta.com/cb/_4BCallback
  • URL de continuación posterior a la página de recibo:
    - Si el destino de tu widget es una página http: http://services.codeeta.com/cb/_4BCallback/web/continue
    - Si el destino de tu widget es una página https: https://services.codeeta.com/cb/_4BCallback/web/continue

Imagen cómo configurar TPV 4B

3.- Confirma estos cambios pulsando en el botón “Cambiar configuración” situado en la parte inferior de la pantalla. En este momento tu TPV virtual perteneciente a 4B está preparado para recibir pagos mediante widgets de pago de Codeeta.

Recuerda que para utilizar un widget de pagos de Codeeta junto con tu TPV virtual de 4B deberás crear un perfil de pagos perteneciente a tu entidad bancaria o, si ésta no aparece en la lista, seleccionar Entidades 4B. En el perfil de pago debes asignar como clave de comercio aquella que tu entidad bancaria te proporcionó junto con tu TPV virtual.

Estructura de un widget de tienda online de Codeeta

El widget de tienda online o minitienda de Codeeta es un widget multipágina, es decir, contiene varias vistas diferentes a las que se puede acceder mediante distintas acciones. En este caso, existen cuatro pantallas distintas: escaparate, vista del producto, carro de compra y la pantalla que contiene el formulario donde se recogen los datos del cliente.

Escaparate
Esta vista muestra todos los elementos de los que se compone la tienda, o sea, los productos que ofertamos a nuestros clientes y es lo primero que se ve en este tipo de widgets. La estructura que tiene es la siguiente:

Vista del escaparate

1. Título de la tienda virtual.

2. Menú de páginas: en este menú tenemos acceso a la vista del escaparate (por defecto) o a la del carrito de la compra, que indica junto a ella el número de artículos que llevamos adquiridos. La vista activa está resaltada en todo momento con un fondo gris oscuro.

3. Escaparate: muestra los productos que podemos adquirir. Por defecto, éstos se reparten en hileras de tres productos, por lo que si añadimos nuevos artículos a nuestro escaparate aparecerán en una hilera nueva. El número de productos mostrados por hilera dependerá de la anchura del widget: más anchura, más productos por fila.
Los productos que salen en el escaparate muestran en nombre del producto, su precio final (con descuentos aplicados, gastos de envío, etc) y un botón (“Ver producto”) que permite ver en detalle cada artículo.
4. Más productos: este botón permite ir a la siguiente hilera de productos. Si estamos ya en la última fila de artículos, se mostrará en enlace de “Productos anteriores” y si nos encontramos en una línea intermedia se mostrarán ambos simultáneamente, para saltar a hileras anteriores o posteriores:

Productos anteriores

Vista del producto

La vista más completa que podemos ver de un producto se muestra en la siguiente imagen:
Vista del producto

1. Nombre del artículo

2. Menú de páginas: análogo al de la vista anterior, excepto que ahora muestra una nueva opción, “Producto”, que indica que estamos visualizando un artículo. Para volver a al escaparate basta con pulsar “Escaparate” en este menú.

3. Foto del producto: muestra la primera foto de la galería que hayamos creado para el artículo. Poniendo el ratón sobre los extremos de la imagen aparecen dos flechas que permiten ver el resto de imágenes. Opcionalmente puede editarse una presentación para que estas imágenes cambien solas de una a otra.

4. Cajetín de precio: la fila superior indica el precio total del producto y la hilera inferior el descuento aplicado y el ahorro que se ha producido. Los gastos de envío, aunque no se muestran en este desglose, también están aplicados en el precio final.

5. Variantes: en este espacio se encuentran las distintas variantes que se han creado para el producto. Una vez que el cliente haya elegido una opción en el desplegable, el precio total variará en consecuencia.

6. Galería de imágenes: muestra todas las imágenes disponibles para este producto. Pulsando directamente sobre estas miniaturas podremos verlas un poco más grandes en la zona “Foto del producto”. Si hemos habilitado la presentación de imágenes, el orden de las miniaturas señala el orden en el que las imágenes aparecerán en su reproducción.

7. Descripción del producto: texto para describir las características del producto. Aparece un scroll en el lado derecho de esta sección si la extensión excede del espacio habilitado.

8. Botón “Añadir al carro”: permite añadir el producto al carrito de la compra. Tras pulsarlo, una unidad del artículo aparecerá reflejado en la sección del carro de compra y el botón cambiará, apareciendo otro gris en su lugar que nos ofrece la posibilidad de volver al escaparate o ir directamente al carro de compra:
Botón escaparate-carrito de la compra

Carro de compra
Vista carro de la compra
1. Nombre de la tienda virtual.

2. Menú de páginas: análogo a los anteriores. Ahora aparece resaltada la pestaña “Carro de compra” porque es la vista donde nos encontramos. El número de artículos que aparece a su derecha hace referencia a la cantidad de productos que vamos a adquirir y no al número de artículos diferentes que hay en el carro de la compra.

3. Listado de productos adquiridos: aquí se muestran todos los artículos que conforman nuestra compra. Tenemos la opción de eliminar los productos que queramos haciendo clic en el icono en forma de aspa situado en el lado izquierdo de cada elemento. Esta acción eliminará cualquier cantidad adquirida de un producto. Si lo que queremos es reducir (o aumentar) el número de unidades que vamos a comprar, podemos valernos de las flechas situadas a la izquierda de cada cajetín de cantidad. El precio final se verá reflejado en el lado derecho y en el precio total.
4. Vaciar el carro: pulsar este icono supone eliminar todas las unidades de todos los productos adquiridos.

5. Precio total: indica el precio total que tendremos que abonar por nuestra compra.

6. Botón “Comprar”: una vez estemos satisfechos con el contenido de nuestro carrito, pulsar “Comprar” nos lleva al siguiente paso del proceso de compra, esto es, a la cumplimentación del formulario que recoge los datos personales del cliente.

7. Atrás: nos lleva de nuevo al escaparate de la tienda.

Adicionalmente, si situamos el cursor sobre el precio de cada artículo aparecerá un cajetín con el desglose del precio, indicando lo que cuesta una unidad, los recargos según variante y gastos de envío y los descuentos aplicados.

Detalle del precio final

Datos del cliente
Vista de los datos pedidos al cliente
1. Nombre de la tienda virtual.

2. Formulario de recogida de datos del cliente.

3. Botón “Enviar”: al hacer clic en este botón seremos reconducidos a la pasarela de pagos para efectuar el pago. Por defecto esta pasarela de pagos es PayPal pero esta opción puede configurarse con el editor avanzado para eliminarla y/o añadir nuevas (explicado en el tercer apartado de este manual).

4. “Atrás”: pulsarlo nos lleva de vuelta al carro de compra

¿Cómo configurar Paypal como pasarela de pagos para mi tienda online?

CONFIGURAR PAYPAL EN UN WIDGET CREADO A TRAVÉS DEL EDITOR AVANZADO DE CODEETA (para configurar PayPal en un widget creado mediante wizard, haz clic aquí)

1. Inicia sesión en Codeeta

2. Dirígete a la sección donde se encuentran tus widgets de tienda.

Widgets de tienda virtual

3. Elige la opción “Configurar” del widget de pago que has creado con el editor avanzado, para que éste vuelva a abrirse y puedas modificarlo.

Listado de widgets de tienda disponibles

4. Haz clic en el elemento de pasarela de pagos de tu widget (se recuadrará en azul tras ello):

Elemento de pasarela de pagos

5. Habilita la casilla de “Servicios de pago online”. Al hacerlo te aparecerán todos los perfiles de pago que hayas creado, independientemente del widget en el que lo hiciste. Los perfiles de pagos están asociados a tu cuenta, no a un widget concreto. Si no dispones de ninguno o no está el que quieres, haz clic en “Crear perfil”

Crear perfil de pago online

6. A continuación, deberás elegir el tipo de perfil que quieres crear: Paypal, DineroMail o Adyen. Selecciona Paypal.

Selección de Paypal como pasarela de pago

7. Al elegir Paypal aparecerá un formulario en el que debes introducir cómo quieres llamar el perfil que estás creando (esto es sólo para ti, para que identifiques en otros widgets que este es un perfil Paypal) y el correo electrónico que utilizas en tu cuenta Paypal (si no tienes una, puedes hacértela aquí).

Formulario a rellenar para crear el perfil de pago online de Paypal

Ejemplo de formulario cumplimentado para crear un perfil de pago Paypal

8. Ya está, proceso completado. Ahora verás que en tu widget aparece como pasarela de pago Paypal, por lo que tus clientes podrán elegirla para efectuar su pago.

Perfil de pago Paypal creado con éxito

Fíjate que el nombre que hemos puesto en el formulario es el que aparece ahora señalado como perfil de pago online

CONFIGURAR PAYPAL EN UN WIDGET CREADO A TRAVÉS DEL WIZARD DE CODEETA (para configurar PayPal en un widget creado mediante el editor avanzado de Codeeta, haz clic aquí).

1. Inicia sesión en Codeeta

2. Dirígete a la sección donde se encuentran tus widgets de pago.

Widgets de tienda virtual

3. Elige la opción “Configurar” del widget de pago que has creado con el wizard, para que puedas configurarlo a través del editor avanzado.

Listado de widgets de tienda disponibles

4. Busca en tu widget (parte derecha de la pantalla) el elemento de la pasarela de pago (el que tiene el logotipo de Paypal) y pincha en él. Por defecto, el wizard utiliza como pasarela de pago Paypal, con la dirección de correo electrónico que usas en tu cuenta Codeeta. Si no dispones de una cuenta Paypal, Paypal te notificará cuando recibas pagos y te animará a crear una cuenta con la cuenta de correo que usas en Codeeta, puesto que no te dejará retirar el dinero si no posees una. Si es la misma que utilizas en tu cuenta de Paypal, no tienes que hacer nada más, pero si utilizas otra debes modificar el contenido del email. Para ello, haz clic en el icono del lápiz (editar perfil) del perfil de pago Paypal.

Elemento de la pasarela de pagos

5. Sustituye la dirección de correo electrónico que usas en tu cuenta Codeeta por la dirección de correo electrónico que usas en Paypal y guarda los cambios.

6. Ya está, ya tienes configurado correctamente tu pasarela de pagos Paypal.

¿Cómo configurar DineroMail para tu tienda online?

Independientemente de que hayas creado el widget con el editor avanzado o con el wizard de Codeeta, configurar DineroMail como pasarela de pagos requiere los mismos pasos: 

1. Inicia sesión en Codeeta

2. Dirígete a la sección donde se encuentran tus widgets de tienda.

Sección donde se encuentran tus widgets de tienda

3. Elige la opción “Configurar” del widget de pago que has creado con el editor avanzado o a través del wizard, para que puedas modificarlo.

Enlace para configurar el widget

4. Haz clic en el elemento de pasarela de pagos de tu widget (se recuadrará en azul tras ello). Si creaste el widget con el wizard, busca el elemento donde ponga Paypal:

Elemento de la pasarela de pagos

Elemento de la pasarela de pagos en un widget creado mediante el wizard de Codeeta

5. Habilita la casilla “Servicios de pago online”. Al hacerlo te aparecerán todos los perfiles de pago que hayas creado, independientemente del widget en el que lo hiciste. Los perfiles de pagos están asociados a tu cuenta, no a un widget concreto. Si no dispones de ninguno o no está el que quieres, haz clic en “Crear perfil”

Crear perfil de pago online

6. A continuación, deberás elegir el tipo de perfil que quieres crear: Paypal, DineroMail o Adyen. Selecciona DineroMail.

Selección del perfil de DineroMail

7. Al elegir DineroMail aparecerá un formulario en el que debes introducir cómo quieres llamar el perfil que estás creando (esto es sólo para ti, para que identifiques en otros widgets que este es un perfil DineroMail), el número de tu cuenta DineroMail (el que aparece en la sección “Mi Cuenta” de la web de DineroMail), el país de origen de tu comercio y la contraseña IPN según la tengas configurada en DineroMail para la recepción de notificaciones.

Formulario a cumplimentar para establecer DineroMail como pasarela de pagos

8. Adicionalmente, deberás dirigirte a DineroMail, a la sección “Configurar IPN” que encontrarás en “Mi Cuenta” –> “Modificar datos personales”. Una vez allí, deberás habilitar la casilla IPN, establecer una contraseña para IPN e introducir: https://services.codeeta.com/cb/dm_callback/notify donde pone “Ingresa la URL”.

9. Aquí ya habría terminado el proceso de configuración de tu cuenta DineroMail. Ahora verás que en tu widget aparece como pasarela de pago DineroMail, por lo que tus clientes podrán elegirla para efectuar su pago.

DineroMail como pasarela de pago

Fíjate que el nombre que hemos puesto en el formulario como nombre del perfil es el que aparece ahora señalado como perfil de pago online

10. Si creaste el widget mediante wizard y no deseas mostrar la opción de pago mediante Paypal (es la opción por defecto en el widget de pagos), puedes hacer dos cosas: no habilitar esa opción (círculo vacío) o eliminar el perfil pulsando el icono rojo situado a su lado y confirmar el borrado.

DineroMail como pasarela de pago

En este ejemplo puedes ver que el perfil de pago Paypal está deshabilitado y por tanto no aparece en la vista del widget final. Si deseas eliminarlo, pulsa el icono rojo del aspa blanca.

¿Cómo configurar un TPV virtual como pasarela de pagos para tu tienda online?

Si has solicitado a tu banco o Caja de ahorros un TPV virtual puedes añadirlo fácilmente como pasarela de pagos para tu tienda online de Codeeta. De esta forma, tus clientes podrán pagar a través de tu widget de minitienda con las formas de pago que tu banco permite.
Tanto si has creado el widget a través del wizard de Codeeta, como si lo has creado desde cero a través del editor avanzado, debes seguir los siguientes pasos para la configuración de tu TPV virtual:

1. Inicia sesión en Codeeta

2. Dirígete a la sección donde se encuentran tus widgets de tienda.

Sección donde se encuentran tus widgets de tienda

3. Elige la opción “Configurar” del widget de pago que has creado con el editor avanzado o a través del wizard, para que puedas modificarlo.

Enlace para configurar el widget

4. Haz clic en el elemento de pasarela de pagos de tu widget (se recuadrará en azul tras ello). Si creaste el widget con el wizard, busca el elemento donde ponga Paypal:

Elemento de pasarela de pagos

5. Habilita la casilla “TPVs virtuales”. Al hacerlo te aparecerán todos los perfiles de pago que hayas creado dentro de los TPVs virtuales, independientemente del widget en el que lo hiciste. Los perfiles de pagos están asociados a tu cuenta, no a un widget concreto. Si no dispones de ninguno o no está el que quieres, haz clic en “Crear perfil”:

Creación de nuevo perfil de TPV virtual

6. A continuación tendrás que elegir la entidad bancaria con la que tengas contratado el servicio de TPV virtual. Según el que elijas, deberás cumplimentar formularios distintos. Toda la información necesaria te la debe suministrar tu banco o caja de ahorros.

Selección de la entidad bancaria

Además, dependiendo del tipo de entidad, deberás configurar también una serie de parámetros en tu TPV virtual (se te indicarán cuales si es tu caso). Si tu banco/caja de ahorros no está en nuestro listado, puedes crear el perfil de tu entidad seleccionando la opción que corresponda a tu situación (“Entidad Euro6000″, “Entidad Servired” o “Entidad 4B”) en la sección “Otras entidades”:

Formulario de configuración para una entidad Euro6000
Formulario a cumplimentar en el caso de una entidad tipo Euro6000. Estas entidades requieren de una configuración adicional en el TPV virtual
Formulario para la configuración de una entidad Servired
Formulario a cumplimentar en el caso de una entidad tipo Servired.
Formulario para la configuración de una entidad 4B
Formulario a cumplimentar en el caso de una entidad tipo 4B.

7. Una vez relleno el formulario guarda el perfil (botón “Crear perfil”) y en tu widget se mostrarán los iconos de tarjetas que indican la posibilidad de pagar con tarjeta a través de un TPV virtual.

Símbolos del pago con tarjeta de crédito

¡Y ya está! Ya tienes configurada tu pasarela de pagos a través de TPV virtual en Codeeta :)

Adicionalmente, existe un paso más para terminar la configuración, consistente en notificar a los responsables de la entidad elegida sobre Codeeta, a fin de que configuren correctamente el entorno para dar permisos a nuestro servicio y que el cobro se realice correctamente. Según la entidad, hay que seguir unos pasos u otros:

  • Pasos a seguir si la entidad elegida es CECA
  • Pasos a seguir si la entidad elegida es Servired
  • Pasos a seguir si la entidad elegida es 4B

Cómo añadir pagos offline a mi widget de tienda online

Añadir pagos offline a tu tienda online permite mostrar al usuario las instrucciones que debe seguir para pagarte por transferencia bancaria, contra-reembolso,… u cualquier otro método de pagos no automatizado. Ten en cuenta que si eliges esta opción Codeeta no tiene forma de saber si el pago se ha efectuado o no, así que deberás ser tú el que compruebe si se ha realizado para cambiar el estado del pago en la sección “Actividad” de tu widget.

Los pasos que debes seguir para configurar el pago offline como pasarela de pagos son:

1. Acceder al editor avanzado de Codeeta del widget que deseas configurar (¿No sabes cómo llegar al editor avanzado?).

2. Haz clic en el elemento de pasarela de pagos de tu widget (se recuadrará en azul tras ello). Si creaste el widget con el wizard, busca el elemento donde ponga Paypal:

Elemento de la pasarela de pagos en un widget creado mediante editor avanzado de Codeeta

Elemento de pasarela de pagos

3. Habilita la casilla “Pago offline”. Al hacerlo te aparecerán todos los perfiles de pago que hayas creado dentro de los pagos offline, independientemente del widget en el que lo hiciste. Los perfiles de pagos están asociados a tu cuenta, no a un widget concreto. Si no dispones de ninguno o no está el que quieres, haz clic en “Crear perfil”:
Creación nuevo perfil offline
4. Cumplimenta el formulario que aparece a continuación. En “Mensaje para el cliente” escribe las instrucciones o información que debe seguir tu cliente/simpatizante para completar el pago. Si habilitas la casilla “Enviar confirmación”, tu cliente recibirá un email con la información que hayas redactado.
Ejemplo de formulario de configuración del pago offline

Recuerda que “Nombre del perfil” tiene uso interno (es el nombre que aparecerá en tu listado de pagos offline), mientras que “Etiqueta del perfil” es el nombre de la opción de pago que aparecerá en el widget para que el usuario lo elija.

Diferencia entre nombre de etiqueta y nombre de perfil

5. Llegados a este punto ya tendrías configurado el perfil de pago offline. Si tu cliente elige esta opción, al hacer clic en “Pagar”, el widget le mostrará las instrucciones que redactaste:

Mensaje de la tienda tras seleccionar la pasarela offline

¿Cómo añadir una tienda online a mi página web?

El procedimiento para añadir una widget de tienda online a una página web es análogo al utilizado para el resto de familias de widgets. Tenemos varias opciones:

Opciones de publicación de tus widgets

Tienes varias posibilidades a la hora de poner tu widget en tu web/blog. Las más usadas son las siguientes:

IFrame
Esta es la opción que te recomendamos si tu web está hecha con un gestor de contenidos como WordPress, Joomla, Blogger,etc. En este caso, los pasos a seguir para insertar el widget en tu página son:

1. Copiar el código de iframe que suministra Codeeta:
Ejemplo de código para la publicación en iFrame
2. Pegarlo en la vista HTML del editor de contenido del post o editor de contenido de la página.
3. Guardar las modificaciones de la página.

Debes tener en cuenta que los widgets exportados por iframe son estáticos, lo que significa que tendrás que exportar de nuevo tu widget cada vez que lo modifiques. De no hacerlo, tu widget no mostrará los cambios que hayas aplicado.

Script
Esta opción es la que se usa generalmente por defecto en entornos web y nosotros te la recomendamos si tu web está hecha con HTML tradicional. Este tipo de exportación genera un pequeño código que puedes pegar directamente en la sección de tu web en la que quieres mostrarlo. Los pasos a seguir para insertar el widget en este formato son:

1. Copiar el código de script que suministra Codeeta.
Ejemplo de código para la exportación del widget en script
2. Pegarlo en el HTML de tu página.
3. Guardar el cambio y subir la página modificada a tu servidor FTP.

Esta opción de exportación es dinámica, así que no requiere que vuelvas a exportarlo cada vez que realices algún cambio en él. No obstante, usa JavaScript, que no es siempre soportado por todas las plataformas. Si te ocurre esto, te recomendamos que exportes tu widget como iframe.

Ventana modal
Si quieres que tu widget le aparezca al usuario como ventana modal (es decir, como un popup con el fondo oscurecido) al acceder a tu web, esta es la opción en la que debes exportar tu widget.
Los pasos a seguir en este caso son:
1. Elegir si quieres habilitar la ventana modal siempre que el usuario visite tu web o sólo la primera vez que acceda a ella.
2. Copiar el código de script que suministra Codeeta.
Ejemplo de código para la exportación del widget como ventana modal
3. Pegarlo dentro del HTML de tu página antes de la etiqueta .
4. Guardar el cambio y subir la página modificada a tu servidor FTP.

Botón
Esta opción de exportación te permite configurar un botón, que tras ser pulsado mostrará el widget en una ventana modal.
Los pasos a seguir para añadir el módulo a su página de esta manera son:
1. Configurar el texto que quieres que aparezca en tu botón
2. Copiar los dos trozos de código que te proporciona
Ejemplo de código para la exportación en forma de botón
3. Pegar el código superior (el que tiene como principio ) en la parte del HTML de tu página donde desees mostrar el botón y el segundo código (script) antes de la etiqueta “a href…” del código HTML de tu página.
4. Guardar el cambio y subir la página modificada a tu servidor FTP.

No necesitas copiar el script (el segundo trozo de código que se te genera al seleccionar la opción de exportación como botón) si quieres poner el botón en más de una parte del código HTML, con una sólo sirve.

URL
Esta opción general la URL o dirección web donde se encuentra tu widget. Esta exportación te permite enlazar directamente a tu widget, por lo que puedes usarlo para acceder de forma externa a tu web al widget. Tan sólo tienes que copiarlo y pegarlo en el sitio desde el que quieras llegar a él.

Ejemplo de código para la exportación como URL

¿Cómo añadir una tienda online a tu página de Facebook?

Añadir un widget de tienda online a tu página de Facebook puede aumentar significativamente el número de personas con acceso a comprar tus productos y servicios. Herramientas proporcionadas por Facebook como en el botón “Me gusta” o “Compartir” benefician la viralidad de tu widget, multiplicándose exponencialmente la exposición de tu negocio en la red. Para poder publicar tu widget en Facebook debes ser administrador de la página en la que quieras publicar tu widget.

Los pasos que debes seguir en este tipo de exportación son:

1. Iniciar sesión en Facebook, en el mismo navegador en el que se haya elegido la opción de publicar en Facebook:


2. Seleccionar el nombre que queremos que tenga la pestaña en Facebook. Te recomendamos que elijas un nombre significativo y coherente con tu widget de tienda, como “Tienda” o “Outlet”.

3. Elegir la página de Facebook en la que queremos que se publique el widget, de entre las opciones que nos hayan detectado como administrador.


4. Pulsar el botón azul de “Publicar widget” correspondiente a la página donde desea poner el módulo.
5. Conceder a la aplicación Codeeta los permisos necesarios para completar la publicación:

Finalmente el widget publicado en Facebook queda del siguiente modo:

¿Cómo recibir notificaciones por las nuevas compras en mi widget de tienda online?

Como en cualquiera de los widgets de Codeeta, puedes configurar notificaciones para ser alertado cuando recibas compras en tu tienda online. Sin embargo, las notificaciones para los widgets que incorporan pagos permiten además distinguir entre distintas situaciones del proceso de pago. De esta forma podrás recibir distintos emails en caso de que se haya producido una venta (venta realizada), una venta fallida o un intento de venta. Puedes redactar el mensaje que prefieras recibir en cada uno de estos casos eligiendo la opción correspondiente en el apartado “Notificaciones para ti” –> “Correo”:

En el caso de las notificaciones a tu cliente, tienes dos formas de realizarlas: bien a través del propio widget o mediante un correo de confirmación.

La primera opción (“Mensaje del widget”) mostrará a tu cliente el mensaje que elijas en el widget, en cuatro supuestos distintos: venta fallida, venta realizada y en caso de que los temporizadores de tu widget (si los tiene) no hayan sido inicializados o hayan expirado:

La segunda opción mandará el mensaje que redactes al correo electrónico de tu cliente cuando la compra se haya completado con éxito.