Cart module breaks layout prices

  • Posts: 6
  • Thank you received: 3
10 months 3 weeks ago #358485

-- HikaShop version -- : 5.0.2
-- Joomla version -- : 4.3.3
-- PHP version -- : 8.1.26

Hi there,

I have a little challenge. I'm trying to get a nice looking cart module, but I can't figure out how to show the layout a bit better. At the moment the prices column is to narrow and it breaks the price into two lines, first the euro sign, and then the price. See attachment. Does anyone has any tips on how to fix this?

Thanks in advance,
Gossen Rijkeboer

Attachments:
Last edit: 10 months 3 weeks ago by gossen.

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

  • Posts: 6
  • Thank you received: 3
10 months 3 weeks ago #358491

I temporary fixed it by adding a lot of nbsp after the Price Header in the view Cart in Product.

<!-- PRICE HEADER -->
<?php if(!empty($columns['price'])) { ?>
				<th class="hikashop_cart_module_product_price_title hikashop_cart_title"><?php
					echo JText::_('CART_PRODUCT_PRICE');
				?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</th>
<?php } ?>
<!-- EO PRICE HEADER -->

Still, if someone has a better and more appropriate solution please let me know :)

Thanks.

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

  • Posts: 4760
  • Thank you received: 647
  • MODERATOR
10 months 3 weeks ago #358490

Hello,

Several solutions :
1. Settings, in Content => Site Modules, then edit in HikaShop Options tab your setting to maybe remove some displayed data (product quantites, coupon, delete button etc...)
OR
2. Add your own custom css command ( Documentation ), then create your custom commands, in details :
- Have a good selector to target your relative elements => Documentation
- And use commands in order to dress up your display like by example :

width: 55px;
word-wrap: break-word;
Documentation about the word-wrap, and many other css commands in w3schools.com

Hope this will help you to achieve your needs.
Regards

Last edit: 10 months 3 weeks ago by Philip.
The following user(s) said Thank You: gossen

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

  • Posts: 6
  • Thank you received: 3
10 months 3 weeks ago #358498

Thanks Philip for your quick reply.

I guess I have some work to do. I was afraid it was going to be diving into tables, th's and td's with firefox devtools...

Keep up the good work :)

The following user(s) said Thank You: Philip

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

  • Posts: 6
  • Thank you received: 3
10 months 3 weeks ago #358501

For other people who are searching for a solution, this is what I added as custom css:

th.hikashop_cart_module_product_price_title {
width: 25%;
}
th.hikashop_cart_module_product_quantity_title {
width: 20%;
}

Hope this will help somebody.

The following user(s) said Thank You: Philip

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

  • Posts: 4760
  • Thank you received: 647
  • MODERATOR
10 months 3 weeks ago #358500

Hello,

You can use the browser inspector tool to have a quick look on Html and get your required elements in order to build your selector.
Learn how to use your inspector tool .
Regards

Last edit: 10 months 3 weeks ago by Philip.

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

Time to create page: 0.064 seconds
Powered by Kunena Forum