Alter the look of checkout

  • Posts: 208
  • Thank you received: 10
3 years 5 months ago #332933

For some reason, my checkout looks very strange.

1. There's a box around all of it
2. The quantity selector is in an add place

Here's how it looks now:



Here's how I want it to look. Can this be done? How?

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 82863
  • Thank you received: 13372
  • MODERATOR
3 years 5 months ago #332943

Hi,

Please note that this is the prdocut details page, not the checkout.
The "boxes" are borders around the table elements. This comes from the CSS of your template. It will require adding a bit of CSS to remove them. Without looking directly at the HTML/CSS of the page I wouldn't be able to say exactly what CSS code to add though.
Could you provide the URL of that page ?

Also, the display of the quantity input field can be changed with the "quantity input method" setting of the HikaShop configuration. So I would recommend trying the different options there. If you choose a "div" one, it won't use table elements so you won't have the border issue from the CSS of your template and it will look better I think.

Finally, moving the dropdown selector in between the quantity input area and the add to cart button area is not really possible unless you make important PHP changes to several view files. It's not impossible if you're a developer and know what you're doing, or hire one and pay him a few hundred euros to work on this. But as a normal user, I would say it's not possible.

Please Log in or Create an account to join the conversation.

  • Posts: 208
  • Thank you received: 10
3 years 5 months ago #332973

Well that one was on the best replies I've even gotten on a forum.
I will re-read this and apply what you suggested.

I was able to remove the input field from an option on the individual product page for the product I was asking about.

But there's another product that I WANT the quantity box in it, but I want the border to be gone and the + / - to be closer together.
I know this is all CSS and I'm learning that, but don't know where to start.

Here's the link: bestedernewsletters.com/index.php/catego...seminar-awards-video

Thank you!.

Last edit: 3 years 5 months ago by simmiepam.

Please Log in or Create an account to join the conversation.

  • Posts: 82863
  • Thank you received: 13372
  • MODERATOR
3 years 5 months ago #332988

Hi,

In each product edit interface, you can find the "quantity input" setting. This setting is set to "inherit" by default so that all the products will use automatically the quanitty input method you set in the HikaShop configuration page.
Thus, thanks to that "quantity input" setting in each product, you can have some of your products with a different quantity input method from the other products on your shop.
So for the product from your link in particular, you can edit the product in the backend, and change the "quantity input" setting to change the look of the quantity box and the - and + buttons. As I said previously, if you use a "div" it should look better, with the - and + being closer, and without the need for you to add any CSS.

Please Log in or Create an account to join the conversation.

Time to create page: 0.069 seconds
Powered by Kunena Forum