• Resolved Jane Milburn

    (@jane-milburn)


    Hi, I am using a Twenty Seventeen child theme. I have searched online and in forums but cannot find the answer to my question. I hope this is in the right forum. I could not find one for Paypal.

    I cannot place a Paypal button where I want it on a page. It appears the default alignment is to the left. I have tried various HTML to position the button but with no results. Can anyone help me with this please?

    I have also tried moving and resizing the image on the page but this doesn’t help either. I have managed to position the button to the center by enclosing the button code in <div align=’center’>paypal code</div> but this doesn’t work when aligning it right and oddly, although the Add To Cart button does center the drop down menu stays on the left.

    I would like the whole Paypal form, text, button and drop down menu to move to the right and further up the page underneath ART REF:

    I would prefer to do this without a plugin.

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

Viewing 6 replies - 1 through 6 (of 6 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    The HTML order is incorrect, you have this stuff:

    
    UK shipping included.
    Please contact us for international and non standard shipping costs prior to  making your purchase.
    

    Which is sitting below the image but above the the paypal stuff.

    You cannot have 1) the image, 2) the “Uk shipping stuff” and 3) the paypall stuff in the order you want (1, 3, 2).

    Thread Starter Jane Milburn

    (@jane-milburn)

    Thanks for your reply Andrew. I’ve removed that text you mentioned and placed it on the right of the image. Is there anyway now I can move the Paypal button up and over to the right of the image rather than below it and underneath where it says about international shipping?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    If you get rid of the empty paragraphs inside the form and inside the post, you should be able to achieve your layout with this additional CSS.

    In the “Additional CSS” section of the dashboard add this:

    
    @media screen and (min-width: 880px) {
        form[target="paypal"] {
            float: left;
        }
    
        form[target="paypal"] table,
        form[target="paypal"] tbody,
        form[target="paypal"] tr,
        form[target="paypal"] td {
            display: block;
        }
    
        form[target="paypal"] table {
            padding-right: 1em;
        }
    
        form[target="paypal"] br {
            display: none;
        }
    }
    

    https://codex.www.ads-software.com/CSS#Custom_CSS_in_WordPress

    Thread Starter Jane Milburn

    (@jane-milburn)

    Hi Andrew, sorry but i’m not sure what you mean by “…get rid of the empty paragraphs inside the form and inside the post,…”.Could you explain further please?

    Many thanks for the CSS. Unfortunately it is not working and i’m being told there are errors.

    1. Expected INDENT – form[target="paypal"] {
    float: left;
    } and Expected RBRACE

    3. Expected INDENT – form[target="paypal"] table,

    4. Expected INDENT – form[target="paypal"] table {
    padding-right: 1em;
    }

    5. Expected INDENT – form[target="paypal"] br {
    display: none;
    }

    I did try adding various text-indent css to try to fix it but i’m not having any luck. Can you help please?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    I don’t understand how you’re getting those errors. Are you sure you’ve pasted the code right at the bottom of any existing code? If you take my suggested code away do the errors persist?

    Thread Starter Jane Milburn

    (@jane-milburn)

    Sorry for the delay in getting back to you. So I tried again the following day and no errors were shown, very odd! Now there are no errors and your code works, thank you so much ??

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Position Paypal button’ is closed to new replies.