• Resolved samsteely

    (@samsteely)


    Hey,

    with the advanced payment methods enabled, once I click on “Credit & Debit Cards” my button layout is completely overwritten.
    What can I do to get my defined button design from my page builder?

    The page I need help with: [log in to see the link]

Viewing 10 replies - 1 through 10 (of 10 total)
  • Plugin Support Syde Joost

    (@joostvandevijver)

    Hello @samsteely,

    Thank you for reaching out to us, we are here to help.

    The Advanced Card Processing payment method is not activated on your site, so we can’t really review the issue. However, the solution will not be in the code of our plugin, but this can only be solved by adjusting your theme. Our payment method uses default WooCommerce button placement, so it should be a standard filter to resolve this issue. You might be able to use these filters, but I don’t think they apply to the input fields, but only the smart buttons (because the input fields are WooCommerce default).

    Please check with your developer or the theme build on how to proceed on this, or tell me what specifically you require from our end.

    Kind regards,
    Joost

    Thread Starter samsteely

    (@samsteely)

    Hey @joostvandevijver

    the advanced payment methods are in fact active on my website. I don’t know why you don’t see them. The smart buttons are working fine. The plugin somehow seems to overwrite the theme styling of my buttons. So it is indeed an issue with your plugin.

    Please advise.

    Plugin Support Syde Joost

    (@joostvandevijver)

    Hello @samsteely

    I might have overlooked the payment method, because I am seeing it now. It does actually look within the style of the theme. This is what I am seeing. What is not correct here? What would you like to see?

    Kind regards,
    Joost

    Thread Starter samsteely

    (@samsteely)

    hey @joostvandevijver

    like I said the “buy now” button at the bottom loses it’s design. It becomes a default grey buy now button and doesn’t match the style for buttons defined through my theme.

    Plugin Support Syde Joost

    (@joostvandevijver)

    Hello @samsteely,

    The button that are used for the Advanced Card Processing is the default WooCommerce button (unlike the PayPal, Pay Later or other Alternative Payment Method buttons, those are generated by our plugin) and is as the card detail fields, not controlled by our plugin. The behaviour of this button, should be the same for all default WooCommerce payment methods. Can you activate another payment method (like, “Cash on delivery”) and check how it’s button is displayed. This should be the same.

    Again, the placement and design is not controlled by our plugin, but by the theme.

    Kind regards,
    Joost

    Thread Starter samsteely

    (@samsteely)

    I know that, BUT when I use PayPal standard for example, the Button reisen is as defined through my theme settings.

    Your PlugIn somehow reverts it to the default.
    I feel like I am repeating the same thing he third time now. So please advise accordingly.

    Plugin Support Syde Joost

    (@joostvandevijver)

    Hello @samsteely,

    After looking a bit more around, I found a similar issue and it seems we can help you out with this.

    The Advanced Card Processing gateway actually hides the regular “Place order” button and replaces it with a custom one. The custom “Place order” button is created with the regular WooCommerce styles (just like the hosted fields style is theme-driven).
    You defined a custom button styling in their theme or page builder and expects the Advanced Card Processing button to look the same.
    But to achieve this, you would need something to apply their custom CSS classes to our custom button.

    I don’t really know how this could best be achieved though, so we can only provide some CSS to style the custom button similarly:

    #ppcp-hosted-fields .button.alt.ppcp-dcc-order-button {
      color: #ffffff;  
    	background-color: #4b4b4b;
        font-size: 20px;
        width: 100%;
        border: 3px solid #4b4b4b;
        box-shadow: 0 8px 30px -6px rgba(0, 0, 0, 0.6);
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 2px;
        transition: all 0.3s ease;
    }
    
    #ppcp-hosted-fields .button.alt.ppcp-dcc-order-button:hover {
        color: #4b4b4b;  
    	border-width: 3px;
        background-color: transparent;
    }

    Maybe your theme developer can provide additional guidance on how to style the Advanced Card Processing button with their custom styles.

    I hope this helps you further. Sorry for the delay in my (correct response).

    Kind regards,
    Joost

    Thread Starter samsteely

    (@samsteely)

    Hey @joostvandevijver

    the styling looks good, but the problem is with this CSS code the fields won´t work anymore. You can´t fill in any informations anymore.

    Kind regards,
    Sam

    Plugin Support Syde Joost

    (@joostvandevijver)

    Hello @samsteely,

    We did test it and for us the CSS worked and didn’t impact the fields, so this might be a theme issue.

    However, we recommend you to update to 2.5.3 as this version introduces new card fields which work better compared to the old ones.

    If that doesn’t work, I think the best next step would be to get in contact with the theme developer.

    Kind regards,
    Joost

    Plugin Support Syde Joost

    (@joostvandevijver)

    Hello,

    Since we did not receive any response or follow-up questions from you, we will assume you got this working to your requirements. If you still have any more questions for us, please open a new thread, because we will mark this one as resolved.

    Kind regards,
    Joost

Viewing 10 replies - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.