Product Image and Description spacing

Vote Up

Vote Down

Answered

Public

Technical Question

Deon de Klerk asked August 14, 2014

Hey

I have two questions regarding the product view.

1) on the listview the description does not honour the line breaks I have put in the description code: http://nichuizen.co.za/index.php/artworks.html

I have put clear line breaks in the product editor so that "Medium", "Year" and "size" will be on different lines. It doesnt want to pull throught to the list view. But on the actual product detail view it works. It looks very messy like that.
How can I achieve the same line breaks on the list view description?

2) On the product detail view: http://nichuizen.co.za/index.php/art…on-work-1.html
I need the product pic to be much higher, almost in line with the product name on the right. On small screen sizes you cannot get a proper view of item and need to scroll…I want to avoid that.

Thanks for all the help so far!

Classy

1 answer

Vote Up

Vote Down

Saguaros ⋅0.00 $tone August 16, 2014

Public

Hi You can find my suggestion as below:

1. In the list view page, the HTML tags like you’re using for the short description are stripped so that it doesn’t look the same as in product details page. To achieve that, you open the file: /app/design/frontend/default/jm_classy/template/catalog/product/list.phtml

At approx line 132, you will see the block code which displays discription:

Code:

<?php // Product description ?>
<div class="product-shop">
<div class="product-info">
	<?php $_productNameStripped = $this->stripTags($_product->getName(), null, true); ?>
	<h2 class="product-name"><a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $_productNameStripped; ?>"><?php echo $_helper->productAttribute($_product, $_product->getName() , 'name'); ?></a></h2>
	<?php echo $this->getReviewsSummaryHtml($_product, false, true)?>
	<div class="desc std">
		<?php $sdesc = $_helper->productAttribute($_product, $_product->getShortDescription(), 'short_description') ?>
		<?php 
			if ($productlistdeslenght) :
				echo substr(strip_tags($sdesc), 0, $productlistdeslenght).'...';
			else : 
				echo substr(strip_tags($sdesc), 0, 200).'...';
			endif;
		?>
	</div>
</div>

You can replace it with:

Code:

<?php // Product description ?>
<div class="product-shop">
<div class="product-info">
	<?php $_productNameStripped = $this->stripTags($_product->getName(), null, true); ?>
	<h2 class="product-name"><a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $_productNameStripped; ?>"><?php echo $_helper->productAttribute($_product, $_product->getName() , 'name'); ?></a></h2>
	<?php echo $this->getReviewsSummaryHtml($_product, false, true)?>
	<div class="desc std">
	<?php echo $_helper->productAttribute($_product, nl2br($_product->getShortDescription()), 'short_description') ?>
	</div>
</div>

2. This due to the image size and the dimension which you set via JM Basetheme extension. By default, it’s set with: http://prntscr.com/4dbq69 and when you use image with smaller size, there will be space like that. You can upload image with dimension like this product page: http://nichuizen.co.za/index.php/art…on-work-7.html or change the value in JM Basetheme settings for product details page: Admin > JoomlArt > JM Basetheme

Remember to clear magento cache once done.

Hope these help.