• Resolved Y@m

    (@yamill)


    Hello, I am working on a multi-step payment gateway, everything is perfect until the final stage, as seen in the attached image. Is there a way to put the back button below the paypal button? even with a css or something like that? Thanks in advance

    https://ibb.co/F897vHm

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Support Nithin – WPMU DEV Support

    (@wpmudevsupport11)

    Hi @yamill,

    Could you please try the following CSS and see whether it helps?

    #forminator-module-429 > .forminator-pagination-footer > .forminator-button-back {
    	margin: 20% 5% -11% -21%;
    	order: 2;
    }
    
    #forminator-paypal-submit {
    	order: 1;
    }

    Before the CSS is added, you’ll have to edit the number “429” in the above CSS to your form ID.

    You can add the CSS via the default WordPress customizer, under Appearance > Customize > Additional CSS.

    If the above CSS doesn’t help much then please share the page URL where you have the form, so that we could check and advise further if needed.

    Kind Regards,
    Nithin

    Thread Starter Y@m

    (@yamill)

    Thank you very much for answering!, I tried the css but everything becomes a bit chaotic, so I will publish the form better, I only wish that the back button in the final stage of the page is below paypal, not next to it, since I have a custom css that centers paypal in the middle of the screen

    The css:

    #forminator-module-1693 .forminator-pagination-footer .forminator-button-paypal 
    {
    top:-15px;
    margin:0 auto;
    width:100%;
    }

    This is how it looks (hide the back button) but draw an example of how I would like to leave it:

    https://ibb.co/Msq4BpZ

    my form

    {"type":"form","data":{"fields":[{"id":"radio-1","element_id":"radio-1","form_id":"wrapper-8449-5516","type":"radio","options":[{"label":"PayPal","value":"PayPal","key":"3589-3227","default":"","image":"","image_filename":""},{"label":"Depósito Bancario","value":"Depósito-Bancario","key":"4455-8354","default":"","image":"","image_filename":""}],"cols":"12","conditions":[],"wrapper_id":"wrapper-8449-5516","value_type":"radio","field_label":"","layout":"vertical","options_bulk_editor":"PayPal; PayPal; 0 Depósito Bancario; Depósito-Bancario; 0","enable_images":"","options_expanded":"1","description":"","required":"1","required_message":"Debes elegir un método de pago"},{"id":"page-break-1","element_id":"page-break-1","form_id":"wrapper-7797-4786","type":"page-break","options":[],"cols":"12","conditions":[],"wrapper_id":"wrapper-7797-4786","btn_left":"? Paso anterior","btn_right":"Paso siguiente ?"},{"id":"name-1","element_id":"name-1","form_id":"wrapper-1048-3481","type":"name","options":[],"cols":"12","conditions":[],"wrapper_id":"wrapper-1048-3481","field_label":"Nombre","placeholder":"","prefix_label":"Prefijo","fname_label":"Nombre","fname_placeholder":"Ejemplo: Juan","mname_label":"Segundo nombre","mname_placeholder":"Ejemplo: Pedro","lname_label":"Apellidos","lname_placeholder":"Ejemplo: Pérez","prefix":"true","fname":"true","mname":"true","lname":"true","required_message":"El nombre es obligatorio.","prefix_required_message":"El prefijo es obligatorio","fname_required_message":"El primer nombre es obligatorio.","mname_required_message":"El segundo nombre es obligatorio.","lname_required_message":"El apellido es obligatorio.","required":"1"},{"id":"email-1","element_id":"email-1","form_id":"wrapper-5417-8812","type":"email","options":[],"cols":"12","conditions":[],"wrapper_id":"wrapper-5417-8812","validation":"1","placeholder":"","field_label":"Correo electrónico","required":"1","validation_message":"Ingresa una dirección de correo válida."},{"id":"phone-1","element_id":"phone-1","form_id":"wrapper-7855-3183","type":"phone","options":[],"cols":"12","conditions":[],"wrapper_id":"wrapper-7855-3183","required":"1","limit":"10","limit_type":"characters","validation":"none","field_label":"Whatsapp","placeholder":"","required_message":"Debes introducir un numero con whatsapp"},{"id":"page-break-2","element_id":"page-break-2","form_id":"wrapper-8294-9916","type":"page-break","options":[],"cols":"12","conditions":[],"wrapper_id":"wrapper-8294-9916","btn_left":"? Paso anterior","btn_right":"Paso siguiente ?"},{"id":"paypal-1","element_id":"paypal-1","form_id":"wrapper-1085-2243","type":"paypal","options":[],"cols":"12","conditions":[{"element_id":"radio-1","rule":"is","value":"PayPal"}],"wrapper_id":"wrapper-1085-2243","mode":"sandbox","currency":"USD","amount_type":"fixed","label":"paypal","color":"silver","shape":"rect","layout":"vertical","tagline":"true","locale":"es_US","debug_mode":"disable","height":"40","amount":"1","credit":"","bancontact":"","blik":"","eps":"","giropay":"","ideal":"","venmo":"","sofort":"","sepa":"","p24":"","mybank":"","mercadopago":"","jcb":"","elo":"","hiper":"","discover":"","billing-details":"true","billing-name":"name-1","billing-email":"email-1","shipping_address":"disable","width":"270","variable":"calculation-1"},{"id":"upload-1","element_id":"upload-1","form_id":"wrapper-4297-5521","type":"upload","options":[],"cols":"12","conditions":[{"element_id":"radio-1","rule":"is","value":"Depósito-Bancario"}],"wrapper_id":"wrapper-4297-5521","field_label":"Adjuntar comprobante de depósito","filetypes":["webp","svg","svgz","png","jpg|jpeg|jpe","pdf"],"file-type":"single","file-limit":"unlimited","upload-limit":"8","filesize":"MB","required":"1","custom-files":"1","use_library":""},{"id":"captcha-1","element_id":"captcha-1","form_id":"wrapper-1637-3785","type":"captcha","options":[],"cols":"12","conditions":[],"wrapper_id":"wrapper-1637-3785","captcha_type":"v3_recaptcha","score_threshold":"0.7","captcha_badge":"bottomright","recaptcha_error_message":"La verificación de reCAPTCHA falló. Inténtalo de nuevo.","language":"es-419","captcha_provider":"recaptcha"}],"settings":{"pagination-header":"nav","paginationData":{"pagination-header-design":"show","pagination-header":"bar","page-break-1-steps":"Paso 1","last-steps":"Finalizar","page-break-2-steps":"Paso 2","page-break-3-steps":"Paso 3","pagination-labels":"default","last-previous":""},"formName":"Copia de Pagos vía depósito","version":"1.15.9","form-border-style":"none","form-padding":"","form-border":"","fields-style":"open","validation":"on_submit","akismet-protection":"0","form-style":"flat","enable-ajax":"true","autoclose":"true","submission-indicator":"show","indicator-label":"Enviando...","form-type":"default","submission-behaviour":"behaviour-redirect","thankyou-message":"<p>Gracias por tu compra! en las próximas 24 horas te enviaré un usuario para que puedas acceder<br />a mi plataforma y disfrutar de tus beneficios!</p>","submitData":{"custom-submit-text":"Enviar mensaje","custom-invalid-form-message":"Error: tu formulario no es válido, ?por favor, corrige los errores!","conditions":[]},"validation-inline":"1","form-expire":"no_expire","form-padding-top":"0","form-padding-right":"0","form-padding-bottom":"0","form-padding-left":"0","form-border-width":"0","form-border-radius":"0","cform-label-font-family":"Roboto","cform-label-custom-family":"","cform-label-font-size":"12","cform-label-font-weight":"bold","cform-title-font-family":"Roboto","cform-title-custom-family":"","cform-title-font-size":"45","cform-title-font-weight":"normal","cform-title-text-align":"left","cform-subtitle-font-family":"Roboto","cform-subtitle-custom-font":"","cform-subtitle-font-size":"18","cform-subtitle-font-weight":"normal","cform-subtitle-text-align":"left","cform-input-font-family":"Roboto","cform-input-custom-font":"","cform-input-font-size":"16","cform-input-font-weight":"normal","cform-radio-font-family":"Roboto","cform-radio-custom-font":"","cform-radio-font-size":"14","cform-radio-font-weight":"normal","cform-select-font-family":"Roboto","cform-select-custom-family":"","cform-select-font-size":"16","cform-select-font-weight":"normal","cform-multiselect-font-family":"Roboto","cform-multiselect-custom-font":"","cform-multiselect-font-size":"16","cform-multiselect-font-weight":"normal","cform-dropdown-font-family":"Roboto","cform-dropdown-custom-font":"","cform-dropdown-font-size":"16","cform-dropdown-font-weight":"normal","cform-calendar-font-family":"Roboto","cform-calendar-custom-font":"","cform-calendar-font-size":"13","cform-calendar-font-weight":"normal","cform-button-font-family":"Roboto","cform-button-custom-font":"","cform-button-font-size":"14","cform-button-font-weight":"500","cform-timeline-font-family":"Roboto","cform-timeline-custom-font":"","cform-timeline-font-size":"12","cform-timeline-font-weight":"normal","cform-pagination-font-family":"","cform-pagination-custom-font":"","cform-pagination-font-size":"16","cform-pagination-font-weight":"normal","payment_require_ssl":"","submission-file":"delete","form_name":"pagos-via-deposito","form_status":"publish","newtab":"sametab","redirect-url":"https://www.virennyluciano.com/formulario/","cform-color-settings":"true","use-custom-css":"1","custom_css":"/*Orientación vertical del paso a paso*/\r\n.forminator-pagination-steps \r\n{\r\n display: flex;\r\n}\r\n\r\n.forminator-break \r\n{\r\n height: 1px;\r\n -webkit-box-flex: 1;\r\n -ms-flex: 1;\r\n flex: 1;\r\n margin: 7px 0;\r\n}","button-upload-background-static":"#616161","button-upload-background-hover":"#848484","button-upload-background-active":"#848484","button-submit-background-static":"#2c2e2f","button-submit-background-hover":"#616161","button-submit-background-active":"#616161","honeypot":"1","use_ajax_load":"","use_donotcachepage":"1","store":"1","radio-icon":"#ff3333","radio-image-background-active":"","radio-image-border-active":"","radio-background-active":"#ededed"},"client_id":null,"integration_conditions":[],"behaviors":[{"slug":"behavior-1234-4567","label":"","autoclose-time":"5","autoclose":"true","newtab":"sametab","thankyou-message":"<p>Gracias por tu compra! en las próximas 24 horas te enviaré un usuario para que puedas acceder<br />a mi plataforma y disfrutar de tus beneficios!</p>","email-thankyou-message":"","manual-thankyou-message":"","submission-behaviour":"behaviour-redirect","redirect-url":"https://www.virennyluciano.com/"}],"notifications":[{"slug":"notification-1234-4567","label":"Nuevo plan adquirido","email-recipients":"default","recipients":"[email protected]","email-subject":"{name-1} Ha adquirido el \"Plan sé tu mejor versión\"","email-editor":"<p>{all_fields}<br />{upload-1} <br />---<br />este mensaje fue enviado desde {site_url}.</p>","email-attachment":"true","conditions":[],"routing":[]}]},"status":"publish","version":"1.15.9"}

    Thread Starter Y@m

    (@yamill)

    I was also wondering if there is the possibility of creating the custom back button using the same code of the original button included in the pagination, that would be a solution, but I don’t know what php code the button uses to give the back command.

    If I knew what the code is I could easily solve it, thanks in advance

    Plugin Support Dimitris – WPMU DEV Support

    (@wpmudev-support6)

    Hello @yamill

    Please add the following rules in the very bottom of Edit form > Appearance > Custom CSS:

    .forminator-pagination-footer {
      flex-flow: wrap-reverse;
    }
    .forminator-pagination-footer .forminator-button-paypal {
      flex: 0 1 100%;
    }

    Take care,
    Dimitris

    Thread Starter Y@m

    (@yamill)

    great, this solved my problem, thank you very much for helping

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Back button and PayPal buttons collide’ is closed to new replies.