En este tutorial vamos a adentrarnos un poco en el código de Virtuemart. Nuestro objetivo es hacer una pequeña modificación en la plantilla que se encarga de visualizar el listado de productos que pertenecen a una categoría. Esta plantilla por defecto solo permite mostrar un botón de más información del producto, pero nosotros queremos hacer que desde el listado de productos se pueda añadir directamente al carrito.
Dentro del mundillo de las tiendas online hay dos tendencias destacables, por un lado los que prefieren poner el botón de más información para que lo añadas posteriormente al carrito y por el otro los que también te añaden otro botón para poder añadir al carrito directamente.
La plantilla por defecto que trae Virtuemart para los listados de productos de una categoría no incorporá un formulario que permita seleccionar el número de unidades del producto que queremos añadir al carrito de la compra. Esto implica que cada vez que quiero añadir un producto a mi carrito de la compra tengo que entrar en la ficha detallada del producto y añadirlo desde allí.
Para llevar a cabo esto lo mejor es utilizar la técnica de template override. Para ello vamos a acceder al directorio /raiz-de-joomla/components/
Para hacer el override copia el archivo default.php y en la siguiente carpeta /raiz-de-joomla/templates/mi-plantilla/html/
Ahora tenemos que insertar el código necesario para poder mostrar el formulario, pero antes debemos ver donde se puede insertar. Si lo quieres mostrar junto al botón de "más detalles" tienes que buscar el siguiente código.
<p>
<?php // Product Details Button
echo JHTML::link ($product->link, JText::_ ('COM_VIRTUEMART_PRODUCT_DETAILS'), array('title' => $product->product_name, 'class' => 'product-details'));
?>
</p>
y justo después añades el siguiente fragmento
<form method="post" class="product" action="index.php" id="addtocartproduct<?php echo $product->virtuemart_product_id ?>">
<?php // Product custom_fields
if (!empty($this->product->customfieldsCart)) { ?>
<div class="product-fields">
<?php foreach ($this->product->customfieldsCart as $field)
{ ?><div style="display:inline-block;" class="product-field product-field-type-<?php echo $field->field_type ?>">
<span class="product-fields-title" ><b><?php echo JText::_($field->custom_title) ?></b></span>
<?php echo JHTML::tooltip($field->custom_tip, JText::_($field->custom_title), 'tooltip.png'); ?>
<span class="product-field-display"><?php echo $field->display ?></span>
<span class="product-field-desc"><?php echo $field->custom_field_desc ?></span>
</div><br/ >
<?php
}
?>
</div>
<?php }
/* Product custom Childs
* to display a simple link use $field->virtuemart_product_id as link to child product_id
* custom_value is relation value to child
*/
if (!empty($this->product->customsChilds)) { ?>
<div class="product-fields">
<?php foreach ($this->product->customsChilds as $field) { ?>
<div style="display:inline-block;" class="product-field product-field-type-<?php echo $field->field->field_type ?>">
<span class="product-fields-title" ><b><?php echo JText::_($field->field->custom_title) ?></b></span>
<span class="product-field-desc"><?php echo JText::_($field->field->custom_value) ?></span>
<span class="product-field-display"><?php echo $field->display ?></span>
</div><br/ >
<?php
} ?>
</div>
<?php } ?>
<div class="addtocart-bar">
<?php // Display the quantity box ?>
<!-- <label for="quantity<?php echo $this->product->virtuemart_product_id;?>" class="quantity_box"><?php echo JText::_('COM_VIRTUEMART_CART_QUANTITY'); ?>: </label> -->
<span class="quantity-box">
<input type="text" class="quantity-input" name="quantity[]" value="1" />
</span>
<span class="quantity-controls">
<input type="button" class="quantity-controls quantity-plus" />
<input type="button" class="quantity-controls quantity-minus" />
</span>
<?php // Display the quantity box END ?>
<?php // Add the button
$button_lbl = JText::_('COM_VIRTUEMART_CART_ADD_TO');
$button_cls = ''; //$button_cls = 'addtocart_button';
if (VmConfig::get('check_stock') == '1' && !$this->product->product_in_stock) {
$button_lbl = JText::_('COM_VIRTUEMART_CART_NOTIFY');
$button_cls = 'notify-button';
} ?>
<?php // Display the add to cart button ?>
<span class="addtocart-button">
<input type="submit" name="addtocart" class="addtocart-button" value="<?php echo $button_lbl ?>" title="<?php echo $button_lbl ?>" />
</span>
<div class="clear"></div>
</div>
<?php // Display the add to cart button END ?>
<input type="hidden" class="pname" value="<?php echo $product->product_name ?>">
<input type="hidden" name="option" value="com_virtuemart" />
<input type="hidden" name="view" value="cart" />
<noscript><input type="hidden" name="task" value="add" /></noscript>
<input type="hidden" name="virtuemart_product_id[]" value="<?php echo $product->virtuemart_product_id ?>" />
<?php /** @todo Handle the manufacturer view */ ?>
<input type="hidden" name="virtuemart_manufacturer_id" value="<?php echo $product->virtuemart_manufacturer_id ?>" />
<input type="hidden" name="virtuemart_category_id[]" value="<?php echo $product->virtuemart_category_id ?>" />
</form>
Con esto ya os aparecerá el botón en los listados de categorías. Si el aspecto visual que tiene no es de tu agrado puedes personalizarlo haciendo uso de CSS.
Y hasta aquí ha llegado el tutorial. He intentando explicarlo de la forma más clara posible, aunque quizás ha quedado al denso el artículo.
Enlace | Tutorial de Virtuemart 2
