получится должно так

 

Создаём настраиваемое поле -«Общий Дочерний вид» с названием «Другие цвета» и устанавливаем его к родительскому товару.

Массив с необходимыми данными формируется с помощью функции public function getUncategorizedChildren($selected) находящийся файле administrator\components\com_virtuemart\models\product.php функция с переделанным запросом на выборку данных о стоимости дочернего товара имеет вид, со строки 1601

public function getUncategorizedChildren($selected){
 
    $q = 'SELECT * FROM `#__virtuemart_products` as p
      LEFT JOIN `#__virtuemart_products_'.VMLANG.'` as pl
      USING (`virtuemart_product_id`)
            LEFT JOIN `#__virtuemart_product_medias`
      USING (`virtuemart_product_id`)
            LEFT JOIN `#__virtuemart_medias`
            USING (`virtuemart_media_id`)
            LEFT JOIN `#__virtuemart_product_prices`
      USING (`virtuemart_product_id`)';
 
    $q .= ' WHERE `ordering`="1" AND `product_parent_id` = "'.$this->_id.'"  
OR `virtuemart_product_id` = "'.$this->_id.'" ';

Далее функция идет без изменений. Я не привожу исходный код функции т.к. sql запрос переписан полностью. Запрос с использованием оператора LEFT JOIN создает одну большую виртуальную таблицу - присоединяя к таблице с основными данными о товаре, данные о рисунках соответствующих товару , его цене . Этих данных получается много и здесь вспоминается недостаток VirtueMart 1.1.9 о не оптимальных запросах к БД потребляющих много ресурсов хостинга, соответственно денег владельца магазина. Возможно здесь кроется одна из причин создания простого выпадающего списка товаров, а не таблицы с изображением товаров их ценой и кнопки Добавить в Корзину.

Последней, в запрос на выборку данных, добавлена таблица virtuemart_product_prices. В ней хранится основная цена каждого товара. Но из таблицы стоимость товара получаем в виде строки, а в карточке товара стоимость выводится после расчета, в соответствии с выбранной посетителем валютой в интернет – магазине. Для этого стоимость каждого дочернего товара рассчитываем с помощью функции -

$currency->priceDisplay((float)$arr['tovarprice'])

Теперь нам нужно получение данных для отображения в следующей таблице:

    Маленький рисунок товара.
    Ссылка на карточку товара с его названием.
    Артикул товара
    Основная цена.
    Конструкция кнопки – Добавить в корзину. (Здесь очень важно, чтобы нажатие на кнопку относилось именно к соответствующему товару в строке).

Общий вид функции дочернего поля - Общий дочерний вид следующий. Не знаю нужно, что либо подробно описывать это обычный код php, никах особых решений в нем нет просто получаем данные из базы данных и выводим их в нужном порядке таблицей в карточке товара. Наверное одно всё-таки нужно пояснить - в создаваемую таблицу не включается повторно, товар который уже стоит сверху в карточке товара с помощью условия:

 if ( $arr['value'] === JRoute::_(
'index.php?option=com_virtuemart&view=productdetails&
virtuemart_category_id=
'.$virtuemart_category_id.'&virtuemart_product_id='.$selected))

В конце полученный массив с помощью функции implode() преобразуем в строку, которая возвращается как результат работы функции с помощью оператора return для отображения блока HTML кода в карточке товара. И так весь код функции со строки 763 в файле administrator\components\com_virtuemart\models\customfields.php

case 'A':
$options = array();
$session = JFactory::getSession();
$virtuemart_category_id = 
  $session->get('vmlastvisitedcategoryid', 0, 'vm');
$productModel = VmModel::getModel('product');
$selected = JRequest::getInt('virtuemart_product_id');
$uncatChildren = $productModel->getUncategorizedChildren($selected);
foreach($uncatChildren as $k =>$child ){
$options[] = array( 'value' => JRoute::_
('index.php?option=com_virtuemart&view=productdetails&virtuemart_category_id=
'.$virtuemart_category_id.'&virtuemart_product_id='.$child['virtuemart_product_id']),
'id'=>$child['virtuemart_product_id'],
'text' =>$child['product_name'],'articul' =>$child['product_sku'],
'tovarimage' =>$child['file_url_thumb'],
'tovarmodimage' =>$child['file_url'], 'tovarprice' =>$child['product_price'] );}
 
 $res=array();
 $table='<div class="tabletov"><table width="100%">
 <tr><th>Изображение</th>
 <th>Название</th><th>Артикул</th>
  <th>Цена</th> <th>Купить</th></tr>';
 
foreach($options as $arr):
if ( $arr['value'] === JRoute::_
('index.php?option=com_virtuemart&view=productdetails
&virtuemart_category_id='.$virtuemart_category_id.
'&virtuemart_product_id='.$selected)) continue;
$res[]= '<tr><td><a class="modal" href='.JRoute::_
('').$arr['tovarmodimage'].'>
<img class="product-image" src='.$arr['tovarimage'].'></a></td>
<td><a href='.$arr['value'].'>'.$arr['text'].'</a></td><td>'.$arr['articul'].'</td>
<td>'.$currency->priceDisplay((float)$arr['tovarprice']).'</td>
<td><form method="post" class="product js-recalculate" action="index.php" >
<span class="quantity-box">
<input type="text" class="quantity-input js-recalculate" name="quantity[]" value="1" /></span>
<span class="quantity-controls js-recalculate">
<input type="button" class="quantity-controls quantity-plus" />
<input type="button" class="quantity-controls quantity-minus" /></span>
<span class="addtocart-button"><input type="submit" name="addtocart"  
class="addtocart-button" value="Добавить в корзину" /></span>
<input class="pname" type="hidden" value='.$arr['text'].'>
<input type="hidden" value="com_virtuemart" name="option">
<input type="hidden" value="cart" name="view">
<noscript><input type="hidden" name="task" value="add" /></noscript>
 <input type="hidden" value='.$arr['id'].' name="virtuemart_product_id[]">
 <input type="hidden" value="0" name="virtuemart_category_id[]"></form></td></tr>';
endforeach;
$str = implode($res);
return '<br>'.$table.''.$str.'</table></div>';
break;

Сами CSS стили для таблицы, делаем так, чтобы строки выводилась с эффектом зебры, для лучшего восприятия и не пересекались с основными стилями шаблона. И карточка товара должна быть достаточно широкой, чтобы в строке разместились все данные.

.tabletov {text-align: center;}
.tabletov th { padding: 20px;
 text-align: center; background: #3B5998;}
.tabletov tr {background: #fff;}
.tabletov tr:nth-child(odd) {background: #FFE4B5;}