[Resolved] Hidden form element causes form display format problem

Home Forums Support [Resolved] Hidden form element causes form display format problem

Home Forums Support Hidden form element causes form display format problem

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #865181
    guyhanchet

    The form code that PayPal gives me to access a hosted button has two hidden input fields. When I insert it in a page it results in extra <br> elements and lots of white space. I think it is Generate Press that inserts the <br> elements but it might be WordPress itself.

    How can I suppress the extra space, especially compared to the Paypal Donation plugin result that looks good but does not allow me to use a button hosted at PayPal. The button behaves as expected so this is not a mission critical problem, but it bugs me.

    What can I do to correct this? I do not want to get involved with the complexity of WooCommerce just to fix this cosmetic problem.

    Here’s a test version of the page. https://forourgrandchildren.ca/test-page/

    And here is the code I inserted (with the buttonid removed).

    <form action=”https://www.paypal.com/cgi-bin/webscr&#8221; method=”post” target=”_top”>
    <input type=”hidden” name=”cmd” value=”_s-xclick” border=”0″/>
    <input type=”hidden” name=”hosted_button_id” value=”xxxxxxxxxxx” />
    <input type=”image” src=”https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif&#8221; border=”0″ name=”submit” title=”PayPal – The safer, easier way to pay online!” alt=”Donate with PayPal button” />

    </form>

    GeneratePress 2.2.2
    GP Premium 1.7.8
    #865257
    David
    Staff
    Customer Support

    Hi there,

    GP won’t insert things like <br> tags it will be either WP or they are in the markup. To remove them is quite simple with this CSS:

    input + br {
        display: none;
    }

    It removes any <br> tags that come after an input field.

    To make it specific i would edit your first line of the code to include a custom class like so:

    <form action="https://www.paypal.com/cgi-bin/webscr" class="paypal-form" method="post" target="_top">

    Then you can target that form specifically, in case other forms need the BR:

    .paypal-form input + br {
        display: none;
    }
    #865407
    guyhanchet

    I checked with another theme and behaviour was still the same so it must be WP not GeneratePress. Your solution worked perfectly, although I wonder why you added class=”paypal” and also “class=”paypal-form”.
    Thanks.

    #865446
    David
    Staff
    Customer Support

    Glad to be of help. Sorry the first class was me copying and pasting the wrong markup. Delete that altogether.

    #865459
    guyhanchet

    Cool everyone makes typos, and it wasn’t hard to see what you meant. Thanks for confirming.

    #865460
    David
    Staff
    Customer Support
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.