Change product layout

  • Posts: 72
  • Thank you received: 2
12 years 1 week ago #82334

I would like to change the layout of the product page.
Picture to the left, description to the right, price and add to cart underneath these 2.

This is the URL
www.negaricoffee.com/index.php/products/...m-roasted-beans-50gr

How do I do that?

Thanks again for your help.

Thomas

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

  • Posts: 13201
  • Thank you received: 2322
12 years 1 week ago #82408

Hi,

You can do that by editing the view "product / show_default" in HikaShop > Display > Views.
Then manage the elements to move them where you want.

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

  • Posts: 72
  • Thank you received: 2
12 years 1 week ago #82482

Thank you Xavier.

I moved the 'add to cart' and 'price' to the bottom of the page without problem.
I moved the div with the product description to the right, but it shows up underneath the picture.

How do I get picture and description beside each other?

Thanks,

Thomas

URL
www.negaricoffee.com/index.php/products/...m-roasted-beans-50gr

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

  • Posts: 72
  • Thank you received: 2
12 years 1 week ago #82485

and doubled up the description in the product_left_part, but the image overlaps the text now.
I am a bit clue less how to do it. Edit the css perhaps - align the pic left or so?

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

  • Posts: 13201
  • Thank you received: 2322
12 years 1 week ago #82532

The problem come certainly from the width of your right part, try to restrict it.
For the doubled description, don't you have copy/paste this part instead of move it ?

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

  • Posts: 72
  • Thank you received: 2
12 years 1 week ago #82536

the doubling up was done on purpose - by copy/paste. I wanted to see what div goes where exactly.

I fixed the layout by restricting the size of the left part, the picture.
How would I go about restricting the right part?

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

  • Posts: 13201
  • Thank you received: 2322
12 years 1 week ago #82574

It's ok if you have restricted the left part. For the right part you can apply a css property on the class ".hikashop_product_right_part{}"

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

  • Posts: 20
  • Thank you received: 0
11 years 8 months ago #98078

i am not sure what you did here but I am interested in getting an answer to this problem as well can you please tell me in great detail what you did to get this to work as i am a bit confused i feel like is stepped in to the middle of a conversation. Any help you can offer will be greatly appreciated thank you very much.

also i have the latest version of the product and a lot of the menus were moved around and frankly i am lost as a child in the woods... most of the support forum stuff no longer applies to this version why did you guys do that... it really makes it a lot harder to use your products if you are just going to toss out years of forums and historical documents...

Last edit: 11 years 8 months ago by Winterthorn. Reason: forgot to include version information.

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

  • Posts: 13201
  • Thank you received: 2322
11 years 8 months ago #98168

As I can see, you moved the description part out of the right part, so to restrict the size, or anything else on the description part, you can apply css properties on ".hikashop_product_description_main"
in the "frontend defauls css" file in Config > Display > CSS.

www.hikashop.com/fr/support/documentatio...ize-the-display.html

The config has changed, because so many options were displayed and it was not well organized.
Now all the options are by category, it's easiest to find the desired option. It's more user friendly.

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

Time to create page: 0.069 seconds
Powered by Kunena Forum