[SOLVED]How to show vertical seperator on category view

[Venkko]

Hi!

I just don't get it...

How can I show vertical seperator between products on category view?

I have set "Default Number of Products per Row " to 2 on VM back-end and on default.php there is vertical separator lines. I even don't believe that I have change those lines so they should be as they where at the begining.

I have VM 2.0.0 and J 1.5.23

Code Select Expand

<?php // Start the Output
foreach ( $this->products as $product ) {

// Show the horizontal seperator
if ($iBrowseCol == 1 && $iBrowseProduct > $BrowseProducts_per_row) { ?>
<div class="horizontal-separator"></div>
<?php }

// this is an indicator wether a row needs to be opened or not
if ($iBrowseCol == 1) { ?>
<div class="row">
<?php }

// Show the vertical seperator
if ($iBrowseProduct == $BrowseProducts_per_row or $iBrowseProduct % $BrowseProducts_per_row == 0) {
$show_vertical_separator = ' ';
} else {
$show_vertical_separator = $verticalseparator;
}

// Show Products ?>
<div class="product floatleft<?php echo $Browsecellwidth . $show_vertical_separator ?>">
<div class="spacer">
<div class="width25 floatleft center">
<?php /** @todo make image popup */
echo $product->images[0]->displayMediaThumb('class="browseProductImage" border="0" title="'.$product->product_name.'" ',true,'class="modal"');
?>


<!-- The "Average Customer Rating" Part -->
<?php if (VmConfig::get('pshop_allow_reviews') == 1) { ?>
<span class="contentpagetitle"><?php echo JText::_('COM_VIRTUEMART_CUSTOMER_RATING') ?>:</span>
<br />
<?php
// $img_url = JURI::root().VmConfig::get('assets_general_path').'/reviews/'.$product->votes->rating.'.gif';
// echo JHTML::image($img_url, $product->votes->rating.' '.JText::_('COM_VIRTUEMART_REVIEW_STARS'));
// echo JText::_('COM_VIRTUEMART_TOTAL_VOTES').": ". $product->votes->allvotes; ?>
<?php } ?>

<?php if (!VmConfig::get('use_as_catalog')){?>
<div class="paddingtop8">
<span class="vmicon vm2-<?php echo $product->stock->stock_level ?>" title="<?php echo $product->stock->stock_tip ?>"></span>
<span class="stock-level"><?php echo JText::_('COM_VIRTUEMART_STOCK_LEVEL_DISPLAY_TITLE_TIP') ?></span>
</div>
<?php }?>
</div>

<div class="width70 floatleft">

<h2><?php echo JHTML::link($product->link, $product->product_name); ?></h2>

<?php // Product Short Description
if(!empty($product->product_s_desc)) { ?>
<p class="product_s_desc">
<?php echo shopFunctionsF::limitStringByWord($product->product_s_desc, 140, '...') ?>
</p>
<?php } ?>

<div class="product-price marginbottom12" id="productPrice<?php echo $product->virtuemart_product_id ?>">
<?php
if ($this->show_prices == '1') {
if( $product->product_unit && VmConfig::get('vm_price_show_packaging_pricelabel')) {
echo "<strong>". JText::_('COM_VIRTUEMART_CART_PRICE_PER_UNIT').' ('.$product->product_unit."):</strong>";
}

//todo add config settings
if( $this->showBasePrice){
echo $this->currency->createPriceDiv('basePrice','COM_VIRTUEMART_PRODUCT_BASEPRICE',$product->prices);
echo $this->currency->createPriceDiv('basePriceVariant','COM_VIRTUEMART_PRODUCT_BASEPRICE_VARIANT',$product->prices);
}
echo $this->currency->createPriceDiv('variantModification','COM_VIRTUEMART_PRODUCT_VARIANT_MOD',$product->prices);
echo $this->currency->createPriceDiv('basePriceWithTax','COM_VIRTUEMART_PRODUCT_BASEPRICE_WITHTAX',$product->prices);
echo $this->currency->createPriceDiv('discountedPriceWithoutTax','COM_VIRTUEMART_PRODUCT_DISCOUNTED_PRICE',$product->prices);
echo $this->currency->createPriceDiv('salesPriceWithDiscount','COM_VIRTUEMART_PRODUCT_SALESPRICE_WITH_DISCOUNT',$product->prices);
echo $this->currency->createPriceDiv('salesPrice','COM_VIRTUEMART_PRODUCT_SALESPRICE',$product->prices);
echo $this->currency->createPriceDiv('priceWithoutTax','COM_VIRTUEMART_PRODUCT_SALESPRICE_WITHOUT_TAX',$product->prices);
echo $this->currency->createPriceDiv('discountAmount','COM_VIRTUEMART_PRODUCT_DISCOUNT_AMOUNT',$product->prices);
echo $this->currency->createPriceDiv('taxAmount','COM_VIRTUEMART_PRODUCT_TAX_AMOUNT',$product->prices);
} ?>
</div>

<p>
<?php // Product Details Button
echo JHTML::link($product->link, JText::_('COM_VIRTUEMART_PRODUCT_DETAILS'), array('title' => $product->product_name,'class' => 'product-details'));
?>
</p>

</div>
<div class="clear"></div>
</div>
</div>
<?php
$iBrowseProduct ++;

// Do we need to close the current row now?
if ($iBrowseCol == $BrowseProducts_per_row) { ?>
<div class="clear"></div>
</div>
<?php
$iBrowseCol = 1;
} else {
$iBrowseCol ++;
}
}
// Do we need a final closing row tag?
if ($iBrowseCol != 1) { ?>
<div class="clear"></div>
</div>
<?php
}
?>

[PRO]

are you trying to make borders?

[Venkko]

Hi!

No not borders. Just one line between products that are on same row in category view.

On attachment there is line between rows and I would like to have same kind of line between those products that are in same row.

[attachment cleanup by admin]

[JtouchMobile.com]

Add some css like
.row .product{
  border-right: 1px solid silver;
}

If you just want to have a single vertical line between 2 products (on a row), then I think you should hack to the code to add your own css class to:

===
<div class="product your-own-css-class">
===

[MobiVM]

Hello,

You need to place one <div class="borders"></div>   at line no 268 after below code:-

<div class="clear"></div>

and create new css named "borders" and apply vertical line css.

Best Regards,
Trivedi kartik.

[Venkko]

Hi!

I got it now, thanks.

I add this line to vmsite-ltr.css
.vertical-separator{border-right:1px solid #E9E8E8;}

and ad this line to default.php
<div class="vertical-separator"></div>