Joomlas.com.ua

Для отображения категорий в компоненте VirtueMart используеться шаблоны которые имеют название browse_xx.php В данной статье хочу показать мое решение оформления этого шаблона а также рассказать о заглушках (вставках кода на php).

В шаблоне используються заглушки вида {заглушка}

Вот перечень заглушек:

{product_flypage} - Ссылка на флаер товара

{product_thumb_image} - Имя файла маленькой картинки

{product_full_image} - Имя файла большой картинки

{full_image_width} - Ширина большой картинки. Для открытия картинки в окне, размером с картинку

{full_image_height} - Высота большой картинки

{image_url} - Ссылка до директории картинок Virtuemart «images/»

{image_width} - Ширина маленькой картинки

{image_height} - Высота маленькой картинки

{product_name} - Наименование товара

{product_s_desc} - Краткое описание товара

{product_details...} - Имя ссылки на флаер товара «Подробнее...»

{product_rating} - Рейтинг товара

{product_price} - Цена товара

{form_addtocart} - Форма добавления в корзину

{product_sku} - Артикул товара

А теперь исходник моего оформления файла категорий

     <div>

        <h3><a style="font-size: 16px; font-weight: bold;" title="{product_name}" href="{product_flypage}">

            {product_name}</a>

<div style="border: 2px;border-bottom-style: dotted;color: #D98C00;"></div>

<br style="clear:both" /> <br style="clear:both" />

        </h3>

<div style="width:100%;padding: 0px 3px 3px 3px;">

    <div style="float:left;width:20%;">

        <script type="text/javascript">//<![CDATA[

        document.write('<a href="javascript:void window.open(\'{image_url}product/{product_full_image}\', \'win2\', \'status=no,toolbar=no,scrollbars=yes,titlebar=no,menubar=no,resizable=yes,width={full_image_width},height={full_image_height},directories=no,location=no\');">');

        document.write('<img src="{product_thumb_image}" {image_height} {image_width} border="0" title="{product_name}" alt="{product_name}" /></a>' );

        //]]></script>

        <noscript>

            <a href="{image_url}product/{product_full_image}" target="_blank" title="{product_name}">

            <img src="{product_thumb_image}" {image_height} {image_width} border="0" title="{product_name}" alt="{product_name}" />

            </a>

        </noscript>

    </div>

        <div style="float:left;width:70%;">

            {product_s_desc}

        </div>

       <div style="float:right;width:10%;align:left; color : #ff9933;font-size:22px">

            {product_price}

        </div>

       <div style="float:right;width:80%;text-align:right"><BR>

   <div style="float:left;width:18%; valign:middle; color : #cc9900;font-size:22px">

            <a href="{product_flypage}" title="{product_details...}">{product_details...}...</a></div>

{form_addtocart}   </div>

</div>

        </div>

        <div style="float:left;width:30%;">

        {product_rating}

        </div>

    </div>

</div>

Вот внешний вид этого файла