Docs

[Sandie]

Hi,

I would like my CHECKOUT-page to have the same design as this one: https://demo.krokedil.se/payson/kassa/

They are also using WooCommerce with PAYSON payment, same as I have but they have the theme STOREFRONT instead of me who has X!!!

So its just for the page I have now to “split” so I get one part on the left side and the one showing the order on the right side.

My CHECKOUT-page: https://www.youpheal.com/kassa/

Please let me now how to proceed!

Thanks!

Best Regards
/Sandra

[Lely]

Hello Sandra,

I can’t access your checkout page at the moment. It always redirect to this page:https://www.youpheal.com/varukorg/ even if I already added a product. Maybe I need a admin credentials?

[Sandie]

Hi,

Ok, yes I’m getting some help with that issue as well, through this support.

Don’t know why it shows “Your cart is currently empty”, even though I have products in the cart.

Cart = Varukorg
Checkout = Kassa

Will try to solve that first, and then we can check the design of the checkout page. If you have any advise how to solve it, please let me know.

Thanks!

Best Regards
/Sandra

[Sandie]

Hi,

Now it works, so can you please have a check at my CHECKOUT Page to see what I can do to get the same design as this: https://demo.krokedil.se/payson/kassa/

They are also using WooCommerce with PAYSON payment, same as I have but they have the theme STOREFRONT instead of me who has X!!!

So its just for the page I have now to “split” so I get one part on the left side and the one showing the order on the right side.

My CHECKOUT-page: https://www.youpheal.com/kassa/

Please let me now how to proceed!

Thanks!

Best Regards
/Sandra

[Thai]

Hi Sandra,

Please try adding the following CSS:

@media (min-width: 980px){
    div#customer_details {
        float: left;
        width: 45%;
    }

    div#order_review,
    h3#order_review_heading {
        float: right;
        width: 45%;
    }
}

Hope it helps 🙂

[Sandie]

Hi,

I put the CSS in the Customizer, but nothing changed on my Checkout-page.

https://youpheal.com/kassa/

Please advise me what to do next.

Thanks!

Best Regards
/Sandra

[Lely]

Hi Sandra,

The CSS is working except for just one syntax error. Unfortunately, the Payson payment is hiding those Customer Information details. See this:http://screencast-o-matic.com/watch/cbn3Is6bZx. Now we don’t have control how that plugin works. Once you have manage it on the plugin to display those settings, it should be fine.

Look for this line: div#order_revie.w is missung at the end

@media (min-width: 980px){
    div#customer_details {
        float: left;
        width: 45%;
    }

    div#order_review,
    h3#order_review_heading {
        float: right;
        width: 45%;
    }
}

Hope this helps.

[Sandie]

Hi,

I have sent your reply to the support for the Payson plugin so they get to sort it out. I have now chosen just PAYPAL as the only payment method and then your CSS code above works great. Except for one little thing.

The title for MY ORDER gets out of place, please see the image link:

http://prntscr.com/eecrmc

Thanks!

Best Regards
/Sandra

[Christopher]

Hi there,

Please find this code :

div#order_review,
  h3#order_review_heading {
    float: right;
    width: 45%:
  }

And update it to :

div#order_review,
  h3#order_review_heading {
    float: right;
    width: 45%;
  }

[Sandie]

Those two codes above look exactly the same.

What should I update the code to?

Thanks!

/Sandra

[Rupok]

Hey Sandra,

It looks like the attachment on my end. So not getting the same as your screenshot and I guess it should be on your end as well. Let’s check again clearing your browser’s cache and update us.

Cheers!

[Sandie]

Hi,

If you look at the reply from your support a little bit up in the conversation. You have sent a CSS code that will solve this, but the code that I should change to is the same as the one I have.

Look at this: http://prntscr.com/eeo9yj

So I wonder what I should change the CSS code to? As in the attachment, the CSS codes are identical.

Thanks!

Best Regards
/Sandra

[Lely]

Hello Sandra,

I can see a CSS syntax error. See this:http://screencast-o-matic.com/watch/cbeVYH6ZG3
As stated on previous reply, the changes on the CSS is at the end of width: 45% a colon was updated to a semi-colon.

Hope this helps.

[Author]

Posts