WordPress.org

Ready to get started?Download WordPress

Forums

WP Stripe
Few issues with smartphones (5 posts)

  1. meanster99
    Member
    Posted 1 year ago #

    Hi,

    Great stripe plugin and fantastic that it's still free when others are charging fr theirs. However, there are a few issues I have come across, not sure if it's due to me using WPv3.6 or not:

    1) The modal box doesn't display the close button top right corner
    2) On smartphones the modal box doesn't quite fit and so some fields are not viewable and can't be completed (name and email)
    3) Again on smartphones, you can submit the payment even though the name field hasn't been completed (because it can't be seen)!
    4) The progress or waiting indication, if there is one, doesn't work so the user gets no visual clue as to whats happening, although the success message does display when it's finished (although isn't visible on a smartphone!)

    I did try to use the legacy version [wp-legacy-stripe] to workaround the smartphone issues but then no progress bar is displayed, and no success message is shown even though the payments are going through.

    I know you are a busy man and may not have the time or inclination to help, but it's worth a try! Any ideas how I can fix these issues?

    Thanks,

    Matt

    http://wordpress.org/plugins/wp-stripe/

  2. meanster99
    Member
    Posted 1 year ago #

    I figured out the close button (no.1 above):

    The following CSS needed to be added to wp-content/plugins/wp-stripe/wp-stripe-thickbox.css:

    .tb-close-icon {
    background: url('../images/thickbox_close.png') no-repeat;
    height: 15px;
    width: 15px;
    }

    Still no joy on getting the spinning processing or loading progress bar animations working though...

    The best I could do for the smartphones was to resize the modal box so that it fitted into an iphone portrait view (height:400, width:320) and I reduced the padding and margins of most of the form elements.

    If anyone has a solution to the progress/processing animations (issue 4 above) and the name validation not working on an iphone(issue 3 above) I am still hoping...

  3. briankross
    Member
    Posted 7 months ago #

    @meanster99

    WP 3.8

    1) Same issue.
    2) Same issue, did you get the CSS to only affect the viewport size of smartphones? How did you change the modal box dimensions?
    3) Same issue.
    4) I see a visual cue that the Pay button is dimmed.

    Any ideas?

  4. meanster99
    Member
    Posted 7 months ago #

    @briankross

    1) The following CSS needed to be added to wp-content/plugins/wp-stripe/wp-stripe-thickbox.css:

    .tb-close-icon {
    background: url('../images/thickbox_close.png') no-repeat;
    height: 15px;
    width: 15px;
    }

    2) No, I just changed the CSS so that the popup box and the form elements fitted into a portrait iphone 4 view. I know I could have used media queries to target it for different viewports but it wasn't really necessary for me. I can't even remember where I had to add the CSS - I think it was the same place as in 1) above. I can send you my CSS file if you give me an email addy.

    3) I reduced the margins and padding between the elements so that all elements were visible, although you can still submit the form without completing the name field, but at least its visible and so shouldn't be easily missed by the user.

    4) Still exactly the same for me - no change.

    Sorry I can't be of more help.

  5. briankross
    Member
    Posted 7 months ago #

    @meanster99

    Thanks a ton, you rock!

    I think I'm going to go with Stripe Checkout directly: https://stripe.com/docs/checkout

    I've got a working test page up, I'm learning the ropes, I have more control, and it's mobile ready out of the box.

    The bad news is it's not integrated in to WordPress. That's ok by me since I've spent a week trying and testing plugin solutions that are out of date, not working 100%, or lack enough control to say 'donate $5' on the button or 'buy me a coffee!'. All I'm looking for is a simple Stripe donation button...

    Good luck and Happy New Year!

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.