Display Variant / Characheristic options on Category layout

Hello,
I have a website that sells products with different color options. These are set as variants of the parent product.

When a customer is viewing a category layout they only see the parent item and do nto know what colors are available until they go to the product view page.

To enhance the visitor experience (and hopefully increase sales) I would like to show the variant color options when they are browsing the main category page. On other e-commerce sites I have seen this displayed. If you look at the attcahed screesnhot this shows somethign similar to what I would like to display. The main prodicyt and then a simple set of colored blocks below which would be the variant options.

I did find a 5 year old forum post, but not sure this is still relevant or would work with the latest HikaShop:

www.hikashop.com/support/forum/4-how-to/...in-the-category.html

Would it be possible for you to supply some sample code and the overrides required?

How do i request this as a feture to be included in future HikaShop relelases?

Thanks
Lee

Hi,

The code was provided by kyratn on the other thread. I've not tested it myself. Here is the code with the modifications we talked about in the other thread included: this code is to be placed in product / listing_img_title via the menu Display>Views.

Note however that this is only a crude version of the complete solution:
- there is no selection of the variant
- there is no possibility to add the variant directly to the cart from there, or see the different prices / stocks
/ images of each variant if you display that information on the listing.
- you'll likely need a bit of CSS as you have less space available than on the product details page

So it's not something we could implement like that in HikaShop.
We already have on our todo list the capability to have variants directly displayed and selectable on the listing. We've had it for years.
However, a complete solution is not easy and it raises several issues that make it difficult for us to implement it in a generic way compared to a solution specific to the needs of one shop.

Nicolas,
Thanks for the reply, I have modified my template (and changed the table prefix from the example code) but now get SQL error:

syntax error, unexpected 'c' (T_STRING) for this line:

$query = 'select * from ozi8g_hikashop_variant as v left join ozi8g_hikashop_characteristic as c on v.variant_characteristic_id=c.characteristic_id where characteristic_parent_id=XXX and variant_product_id in ('.$parent_product_ids.') group by characteristic_id ORDER BY `c`.`characteristic_ordering` ASC';

Unfortunately my PHP / MySQL skills are not good enough to debug this error? Any advice?

I also fully understand your comments regaridng developing a solution that is suitable for 'everyone' and I suspect your todo list is long, but if there could be a discussion on developing some sort of solution, even if it is an extra plugin it would be greatly appreciated

Thanks

Hi,

Try replacing:
`c`.`characteristic_ordering`
by:
c.characteristic_ordering

Nicolas,
I've done that and now get:

You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near ''#__hikashop_product' WHERE (product_parent_id=1)' at line 1

I Appreciate all your efforts, thanks

Hi,

Could you provide a screenshot of the code you have now ?
Also, I've updated the code in my original message with some fixes, so that might help.

Nicolas,
With your updated code I have this eroor:

I've attcahed a screenshot fo the code.

Lee

Hi,

I've updated the code in my message for that error message.

Nicolas,
still does not seem 100% correct. With some help I managed to enter a var_dump to show the query and now get this:

Warning: implode(): Invalid arguments passed in /home/underdev/mxgroup-new.under-development.info/templates/t4_blank/html/com_hikashop/product/listing_img_title.php on line 96
string(265) "SELECT * FROM XXX_hikashop_variant AS v LEFT JOIN XXX_hikashop_characteristic AS c ON v.variant_characteristic_id=c.characteristic_id WHERE characteristic_parent_id=9 AND variant_product_id IN () GROUP BY characteristic_id ORDER BY c.characteristic_ordering ASC"

This is the code I now have:

I have chnaged the db prefix to XXX, and also add the specific ID of the characteristic.

Hi,

This means that the first MySQL query "SELECT group_concat(product_id) AS product_ids FROM XXX_hikashop_product WHERE (product_parent_id=".$this->row->product_id.") AND product_quantity>0 AND product_published > 0" doesn't find any variants for the current product.
That code was made supposing that all the products on the shop had variants.
So what you need to do is to add an extra check like this:

Nicolas,
Apologies just getting back on this project, I have now updated to Joomla 4 and Hikashop 4.5.1 but still cannot get the characteristics to display.

This is the code I have below, but when I have the $parent_product_ids=$database->loadColumns(); active the page fails with a MySQLi failure:

Call to undefined method Joomla\Database\Mysqli\MysqliDriver::loadColumns()

Can you help

Hi,

The function name is loadColumn without the "s" at the end. That's why you get that error.

Nicolas,
Thanks for the reply, I have removed the rouge 's' and now get this error!

Thanks for your help

Lee

Hi,

Could you provide the code you have now ?

Nicolas,
this is what I have:

Could it be the var_dump or die statements? not sure why they are there?

Hi,

The error message indicates that implode(',',$parent_product_ids) returns nothing. So either $parent_product_ids is empty or it's an array with no values or something like that.
Try changing :
if(!empty($parent_product_ids)) {
to:
if(!empty($parent_product_ids) && count($parent_product_ids)) {

Also, if that doesn't help, try adding a var_dump($parent_product_ids); to see what's in that variable.

Nicolas,
Ok I have made some progress!

Looking at the code it had this:

AND product_quantity>0

Well my products do not have stock levels so it was never going to get the values as the database was showing product_quantity at -1!

removing that now gives me an array of ID's when I do the var_dump, for example:

array(1) { [0]=> string( "16,17,18" }

Next the second query that gets the variants uses this:

WHERE characteristic_parent_id=ZZZ

However my parent ID was not 9 as originally used in previous code. Looking in the XXX_hikashop_characteristic table and selelcting the correct characteristic_id, it is now displaying the product variant Characteristic as I need (see attached frontend screen shot).

So it is now 'working' finally we got there!

I really hope this functionality can be discussed and included as a feature request in future HikaShop releases.

Thank you for your time and efforts, it is most appreciated

Lee


For anyone else wanting this functionality here is the code that is added to a template override for product/listing_img_title.php. You need to change the XXX to your database table prefix and the ZZZ to the characteristic_id of the characteristic from the _hikashop_characteristic table of your database.

Hi,

Thanks for sharing your solution.

Note that you don't need to set the table prefix. You can use #__ and joomla will replace it for you.
Also, I think it's good to have the product_quantity check but instead of >0 it's better to use !=0 so that it will match for unlimited and for a stock.

So here is the modified code: So you just have to replace ZZZ by the id of the characteristic you want to use to get its available values for each product on the listing.