Variants, Values, and Adding Quantities to Cart

Hi. I'm new to HikaShop, having just implemented it yesterday, but the forum has been very helpful - thanks for that

One question... I have a product with several variants (similar to sandpaper, where a customer would frequently order that one product in several different grit sizes or variants at one time.) Unfortunately, as I have things set up now, the customer has to select each variant one by one, add them to the cart this way, and then adjust the quantities only once the product is in the shopping cart.

Is it possible to add a box or some option that would allow a customer to select more than one variant at a time, and also select the quantity as well? Before going into the shopping cart?

And one more question... I can't seem to properly realign the product title on this page (link below) to the center. I have read previous posts and tried altering the CSS, but it's still not working

This has been troubling me, so your help would be greatly appreciated! Thanks!

Also, my link is as follows:

bledsoe.cloudaccess.net/component/hikash...1-nato.html?Itemid=0

Hi,

Sure, you can add a box for the quantity. In fact, you don't need to add the "add to cart" button in the description. There will be one displayed automatically with the quantity box if you enter a price for your product.
Also, if you use the automatic add to cart button, you can use the option "After a product is added to the cart" of the Checkout tab of the configuration to tell the system to stay on the same page when a variant is added so that the user can directly add a second variant to his order.

For the product name, you can use that CSS to center it:
.hikashop_product_top_part h1{ text-align: center !important; }

Thanks! I think that I have the cart issue corrected now. I just can't figure out where exactly I should add the CSS you posted previously. Can you provide some direction for that? Thanks again!

You can do that in the front end CSS file that you can edit via the Display tab of the configuration.

Thanks! It finally worked! Now I just need to add some space between the product name at the top, and the image and variants below it. How would I add a few lines of space there? I assume that I have to edit something under Display > Views?

You can use CSS for that too:
.hikashop_product_top_part h1{ padding-bottom 20px !important; }

I tried adding it in the same place - Configuration>Display>Front End CSS, but for some reason it didn't work

Ah yes, I forgot a semi colon. It should have been:
.hikashop_product_top_part h1{ padding-bottom 20px: !important; }

Unfortunately, it's still not working

Sorry, I misplaced the semi colon. Try with that:
.hikashop_product_top_part h1{ padding-bottom: 20px !important; }

Yes, that worked. Thanks!!!