Imposible colocar contenido debajo de botón de pago en webpage usando HTML y CSS

[educadisllc]

The

statement always places de payment button as the last statement on the webpage. I found it impossible to put any text or graphics below the button. As it is it is V4 is useless for me. V3 has served me well up to this point.

[osquiabro]

lograstes hacer que funciona la version 4?

[educadisllc]

No tuve éxito. Ver imágenes con V3 y V4 V3 [image: educadis_button_v3.png] V4 [image: educadis_button_v4.png] Atentamente Jorge L. López, PhD, PE

…

On Tue, Sep 24, 2024 at 3:54 PM osquiabro ***@***.***> wrote: lograstes hacer que funciona la version 4? — Reply to this email directly, view it on GitHub <#31 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/BJFH6B2F74VYEMDIRUAJEALZYG7PPAVCNFSM6AAAAABJSTHJUGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDGNZSGI2DOMZRGU> . You are receiving this because you authored the thread.Message ID: ***@***.***>

[osquiabro]

no se ven las imágenes.

[educadisllc]

Atentamente Jorge L. López, PhD, PE

…

On Tue, Sep 24, 2024 at 5:58 PM osquiabro ***@***.***> wrote: no se ven las imágenes. — Reply to this email directly, view it on GitHub <#31 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/BJFH6BZQNOG3IYLOOBWM7UTZYHN73AVCNFSM6AAAAABJSTHJUGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDGNZSGQ2TSOJXGM> . You are receiving this because you authored the thread.Message ID: ***@***.***>

[lopezjorgel]

https://educadis-storage.s3.us-east-1.amazonaws.com/courseimages/educadis_button_v3.png https://educadis-storage.s3.us-east-1.amazonaws.com/courseimages/educadis_button_v4.png Jorge L. López On Tue, Sep 24, 2024 at 6:01 PM educadisllc ***@***.***> wrote:

…

Atentamente Jorge L. López, PhD, PE On Tue, Sep 24, 2024 at 5:58 PM osquiabro ***@***.***> wrote: > no se ven las imágenes. > > — > Reply to this email directly, view it on GitHub > < #31 (comment)>, > or unsubscribe > < https://github.com/notifications/unsubscribe-auth/BJFH6BZQNOG3IYLOOBWM7UTZYHN73AVCNFSM6AAAAABJSTHJUGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDGNZSGQ2TSOJXGM> > . > You are receiving this because you authored the thread.Message ID: > ***@***.***> > — Reply to this email directly, view it on GitHub <#31 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ADUIFCSUPPPFNHWIWPMMHO3ZYHOLLAVCNFSM6AAAAABJSTHJUGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDGNZSGQ3DGNJUGY> . You are receiving this because you are subscribed to this thread.Message ID: ***@***.***>

[osquiabro]

creo que me esta ocurriendo lo mismo, no me sale el botón en la versión 4, pero el problema es que nadie de Evertec entra a ver los problemas reportados y en diciembre según un comunicado van a eliminar la versión 3

[fjcolonrodz]

Saludos, el 4 de septiembre envié un email a support con esta misma situación. De hecho, hice referencia a este Issue. Abajo screenshot del email enviado:

---

---

La única respuesta que he recibido fue el 5 de septiembre diciendo:

Referiremos su consulta al grupo de programación. Tan pronto tengamos una respuesta nos comunicaremos con usted.

[osquiabro]

por lo menos logras ver el boton, yo no logro verlo, ahora bien cree un html en mi web server con el script tal cual el ejemplo y logre ver el boton, solo si en env es produccion " env: 'production' " si es sandbox no aparece. Pero cuendo inserto dentro de mi app el codigo no aparece y no tengo ningun error en la consola

<title>Payment</title>

<script src="https://payments.athmovil.com/api/js/athmovil_base.js"></script> <script type="text/javascript"> const ATHM_Checkout = { env: 'production', publicToken: '6228cef95748aa08f282a94b2435dce99bdd5987', timeout: 600, theme: 'btn', lang: 'en', total: 1, subtotal: 1, tax: 1, metadata1: 'Prueba1.1', metadata2: 'Prueba2.2'

      }
      async function authorizationATHM(){
        const responseAuth = await authorization();
        console.log(responseAuth);
      }
      async function cancelATHM(){
        const responseCancel = await findPaymentATHM();
        console.log(responseCancel);
      }
      async function expiredATHM(){
        const responseExpired = await findPaymentATHM();
        console.log(responseExpired);
      }
</script>

[educadisllc]

Resultados de mi investigación. 1) En esta imagen pueden ver copia de mi script de php que "enseña" el botón de pago para la versión 3. Este script funciona apropiadamente. https://educadis-storage.s3.us-east-1.amazonaws.com/courseimages/educadis_phpscript_v3.JPEG 2) En esta imagen pueden ver lo que se refleja en la página cuando la misma es usada con versión 3 (F12 en Chrome). Se hace evidente que lo que la página refleja es lo mismo que está en el script. https://educadis-storage.s3.us-east-1.amazonaws.com/courseimages/educadis_Chrome_F12_v3.JPEG 3) En esta imagen pueden ver copia de mi script de php que "enseña" el botón de pago para la versión 4. Las únicas diferencias son a) la llamada al javascript del botón y b) el nombre del botón de pago que ahora es "ATHMovil_Checkout_Button_payment" en lugar de "ATHMovil_Checkout_Button". https://educadis-storage.s3.us-east-1.amazonaws.com/courseimages/educadis_phpscript_v4.JPEG 4) En esta imagen pueden ver lo que se refleja en la página cuando la misma es usada con versión 4 (F12 en Chrome). Se hace evidente que lo que la página refleja NO es lo mismo que está en el script., falta el <div> que tiene el nombre de botón de pago "ATHMovil_Checkout_Button_payment". https://educadis-storage.s3.us-east-1.amazonaws.com/courseimages/educadis_Chrome_F12_v4_parte_A.JPEG 5) Finalmente, pueden ver que el <div> que tiene el botón de pago "ATHMovil_Checkout_Button_payment" se ha movido al final de la página y tiene dimensiones que no estaban en mi libreto. Además ahora aparece un <SCRIPT> nuevo que tiene una referencia a "crypto" ( https://payments.athmovil.com/api/js/crypto-js.min.js.). Demas está decir que esa referencia no está en ninguno de mis libretos. https://educadis-storage.s3.us-east-1.amazonaws.com/courseimages/educadis_Chrome_F12_v4_parte_B.JPEG Para mi es evidente que el javascript de la versión 4 está haciendo todas estas manipulaciones para mover el botón de pago al final de la página y añadir elementos que no son evidentes para que son.. Atentamente Jorge L. López, PhD, PE

…

On Wed, Sep 25, 2024 at 10:34 AM osquiabro ***@***.***> wrote: por lo menos logras ver el boton, yo no logro verlo, ahora bien cree un html en mi web server con el script tal cual el ejemplo y logre ver el boton, solo si en env es produccion " env: 'production' " si es sandbox no aparece. Pero cuendo inserto dentro de mi app el codigo no aparece y no tengo ningun error en la consola <title>Payment</title> <script src="https://payments.athmovil.com/api/js/athmovil_base.js"></script> <script type="text/javascript"> const ATHM_Checkout = { env: 'production', publicToken: '6228cef95748aa08f282a94b2435dce99bdd5987', timeout: 600, theme: 'btn', lang: 'en', total: 1, subtotal: 1, tax: 1, metadata1: 'Prueba1.1', metadata2: 'Prueba2.2' } async function authorizationATHM(){ const responseAuth = await authorization(); console.log(responseAuth); } async function cancelATHM(){ const responseCancel = await findPaymentATHM(); console.log(responseCancel); } async function expiredATHM(){ const responseExpired = await findPaymentATHM(); console.log(responseExpired); } </script> — Reply to this email directly, view it on GitHub <#31 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/BJFH6B4OUK2V53CMGGONQILZYLCYHAVCNFSM6AAAAABJSTHJUGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDGNZUGI3TGMJRGI> . You are receiving this because you authored the thread.Message ID: ***@***.***>

[osquiabro]

en adiccion en ambiente de sandbox no funciona el boton

[fjcolonrodz]

@osquiabro entiendo que el entorno sandbox lo deshabilitaron en la nueva versión. Según la documentación:

Disclaimer: We currently do not have a Testing environment. You need to have an active ATH Business account and a active ATH Móvil account.

[osquiabro]

@fjcolonrodz, lei el Disclaimer pero es confuso ya que entiendo que se debe tener una ATH Business activa para poder obtener los tokens, pero para uno hacer pruebas del flujo debe de haber un ambiente de prueba, imagina que todas las pruebas se tenga que estar enviando dinero y luego que te lo devuelvan.

[osquiabro]

Saludos, logre que aparezca el botón pero en efecto lo pone en la parte izquierda del footer, sin posibilidad de poder ponerlo donde uno quiere.

En adicción es importante que se cuente con un ambiente de prueba, todos los engines de pagos que he trabajado lo tienen.
@educadisllc @fjcolonrodz

[educadisllc]

Para bien o para mal, es bueno saber que no soy el único que estoy confrontando este problema. Atentamente Jorge L. López, PhD, PE

…

On Thu, Sep 26, 2024 at 10:34 AM osquiabro ***@***.***> wrote: Saludos, logre que aparezca el botón pero en efecto lo pone en la parte izquierda del footer, sin posibilidad de poder ponerlo donde uno quiere. En adicción es importante que se cuente con un ambiente de prueba, todos los engines de pagos que he trabajado lo tienen. @educadisllc <https://github.com/educadisllc> @fjcolonrodz <https://github.com/fjcolonrodz> — Reply to this email directly, view it on GitHub <#31 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/BJFH6B4UYSYMU5JCGZDJK4TZYQLPXAVCNFSM6AAAAABJSTHJUGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDGNZXGE2TGNBYGA> . You are receiving this because you were mentioned.Message ID: ***@***.***>