Allowing HTML on short description of product list, 1.6.0.8

alloffus · July 3, 2014

Hi,

I am trying to add a HTML5 player to each product on my site, as it conists of products of a digital nature.

Although, when I add the relevant code to the short description it shows up in the product details as seen here: http://puu.sh/9V9wB/35e8392c3c.png

But on the product list, the HTML is stripped away. As seen here: http://puu.sh/9V9AH/aa11ffd617.png

I have found ways of getting around this on earlier versions of PrestaShop, but the code I am told to edit no longer exists in the latest version. Any advice on how I should prevent the HTML code from being deleted would be greatly appreciated.

Thanks in advance.

El Patron · July 3, 2014

the reason no html is allowed is because this is what is used when building sitemap.

there is no logic in sitemap to strip html tags, so be careful what you wish for.

alloffus · July 3, 2014

the reason no html is allowed is because this is what is used when building sitemap.

there is no logic in sitemap to strip html tags, so be careful what you wish for.

So, is it impossible to have the HTML player on the product list?

Edited July 3, 2014 by alloffus (see edit history)

El Patron · July 3, 2014

So, it is impossible to do what I wish to?

you can always hack core...that is outside of what I am comfortable with supplying, but however you go make sure to test your sitemap and see how short description looks.

alloffus · July 3, 2014

you can always hack core...that is outside of what I am comfortable with supplying, but however you go make sure to test your sitemap and see how short description looks.

I'm not sure what you mean by 'sitemap', do you care to explain what it is and how modifying the files would affect it?

Thanks

El Patron · July 3, 2014

I'm not sure what you mean by 'sitemap', do you care to explain what it is and how modifying the files would affect it?

Thanks

actually I just looked at this again...and may have been incorrect...getting older by the minute.

in 1.6.0.8

with google sitemap module, here is what I see, the short description is highlighted. I guess the point would still be the same, what would it look like with html in it?

http://screencast.com/t/ju1f5wD5r

I think you can stop removing tags by modifying the following code controllers/admin/AdminProductsController.php

		if (Tools::getIsset('description_short') && $this->isProductFieldUpdated('description_short'))
		{
			$saveShort = Tools::getValue('description_short');
			$_POST['description_short'] = strip_tags(Tools::getValue('description_short'));
		}


change to

		if (Tools::getIsset('description_short') && $this->isProductFieldUpdated('description_short'))
		{
			$saveShort = Tools::getValue('description_short');
			$_POST['description_short'] = $saveShort;
		}

Note: I did not test this.

there maybe more removal of strip_tags later in the code...

if you get it to work, then make sure to run your sitemap (module back office) and check it

vekia · July 3, 2014

you have to remove |strip_tags modifier from product short description in product_list.tpl file

{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}

edit:

omg i missed Fred reply :/ my bad,

alloffus · July 3, 2014

actually I just looked at this again...and may have been incorrect...getting older by the minute.

in 1.6.0.8

with google sitemap module, here is what I see, the short description is highlighted. I guess the point would still be the same, what would it look like with html in it?

http://screencast.com/t/ju1f5wD5r

I think you can stop removing tags by modifying the following code controllers/admin/AdminProductsController.php
		if (Tools::getIsset('description_short') && $this->isProductFieldUpdated('description_short'))
		{
			$saveShort = Tools::getValue('description_short');
			$_POST['description_short'] = strip_tags(Tools::getValue('description_short'));
		}


change to

		if (Tools::getIsset('description_short') && $this->isProductFieldUpdated('description_short'))
		{
			$saveShort = Tools::getValue('description_short');
			$_POST['description_short'] = $saveShort;
		}
Note: I did not test this.

there maybe more removal of strip_tags later in the code...

if you get it to work, then make sure to run your sitemap (module back office) and check it

Hi, thanks for looking into this.

I tried the method you suggested and unfortunately, it's stripping the HTML back on the product list

alloffus · July 3, 2014

you have to remove |strip_tags modifier from product short description in product_list.tpl file
{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}
edit:

omg i missed Fred reply :/ my bad,

I tried removing that modifier earlier today, it appears to just delete the short description on the product list altogether.

El Patron · July 3, 2014

Hi, thanks for looking into this.

I tried the method you suggested and unfortunately, it's stripping the HTML back on the product list

see vekias post on how to do this in product list...maybe also required on product.tpl as well...

we going down the rabbit hole..jajaja

alloffus · July 3, 2014

see vekias post on how to do this in product list...maybe also required on product.tpl as well...

we going down the rabbit hole..jajaja

Hi, I'm still having no luck with taking away the 'strip_tags' modifier like Vekias said. Any other possible solutions would be greatly appreciated.

Thanks,

Roy

Edited July 3, 2014 by alloffus (see edit history)

vekia · July 3, 2014

can you show how your modified code looks like?

alloffus · July 3, 2014

can you show how your modified code looks like?

{if isset($products) && $products}
	{*define numbers of product per line in other page for desktop*}
	{if $page_name !='index' && $page_name !='product'}
		{assign var='nbItemsPerLine' value=3}
		{assign var='nbItemsPerLineTablet' value=2}
		{assign var='nbItemsPerLineMobile' value=3}
	{else}
		{assign var='nbItemsPerLine' value=4}
		{assign var='nbItemsPerLineTablet' value=3}
		{assign var='nbItemsPerLineMobile' value=2}
	{/if}
	{*define numbers of product per line in other page for tablet*}
	{assign var='nbLi' value=$products|@count}
	{math equation="nbLi/nbItemsPerLine" nbLi=$nbLi nbItemsPerLine=$nbItemsPerLine assign=nbLines}
	{math equation="nbLi/nbItemsPerLineTablet" nbLi=$nbLi nbItemsPerLineTablet=$nbItemsPerLineTablet assign=nbLinesTablet}
	<!-- Products list -->
	<ul{if isset($id) && $id} id="{$id}"{/if} class="product_list grid row{if isset($class) && $class} {$class}{/if}">
	{foreach from=$products item=product name=products}
		{math equation="(total%perLine)" total=$smarty.foreach.products.total perLine=$nbItemsPerLine assign=totModulo}
		{math equation="(total%perLineT)" total=$smarty.foreach.products.total perLineT=$nbItemsPerLineTablet assign=totModuloTablet}
		{math equation="(total%perLineT)" total=$smarty.foreach.products.total perLineT=$nbItemsPerLineMobile assign=totModuloMobile}
		{if $totModulo == 0}{assign var='totModulo' value=$nbItemsPerLine}{/if}
		{if $totModuloTablet == 0}{assign var='totModuloTablet' value=$nbItemsPerLineTablet}{/if}
		{if $totModuloMobile == 0}{assign var='totModuloMobile' value=$nbItemsPerLineMobile}{/if}
		<li class="ajax_block_product{if $page_name == 'index' || $page_name == 'product'} col-xs-12 col-sm-4 col-md-3{else} col-xs-12 col-sm-6 col-md-4{/if}{if $smarty.foreach.products.iteration%$nbItemsPerLine == 0} last-in-line{elseif $smarty.foreach.products.iteration%$nbItemsPerLine == 1} first-in-line{/if}{if $smarty.foreach.products.iteration > ($smarty.foreach.products.total - $totModulo)} last-line{/if}{if $smarty.foreach.products.iteration%$nbItemsPerLineTablet == 0} last-item-of-tablet-line{elseif $smarty.foreach.products.iteration%$nbItemsPerLineTablet == 1} first-item-of-tablet-line{/if}{if $smarty.foreach.products.iteration%$nbItemsPerLineMobile == 0} last-item-of-mobile-line{elseif $smarty.foreach.products.iteration%$nbItemsPerLineMobile == 1} first-item-of-mobile-line{/if}{if $smarty.foreach.products.iteration > ($smarty.foreach.products.total - $totModuloMobile)} last-mobile-line{/if}">
			<div class="product-container" itemscope itemtype="http://schema.org/Product">
				<div class="left-block">
					<div class="product-image-container">
						<a class="product_img_link"	href="{$product.link|escape:'html':'UTF-8'}" title="{$product.name|escape:'html':'UTF-8'}" itemprop="url">
							<img class="replace-2x img-responsive" src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')|escape:'html':'UTF-8'}" alt="{if !empty($product.legend)}{$product.legend|escape:'html':'UTF-8'}{else}{$product.name|escape:'html':'UTF-8'}{/if}" title="{if !empty($product.legend)}{$product.legend|escape:'html':'UTF-8'}{else}{$product.name|escape:'html':'UTF-8'}{/if}" {if isset($homeSize)} width="{$homeSize.width}" height="{$homeSize.height}"{/if} itemprop="image" />
						</a>
						{if isset($quick_view) && $quick_view}
							<div class="quick-view-wrapper-mobile">
							<a class="quick-view-mobile" href="{$product.link|escape:'html':'UTF-8'}" rel="{$product.link|escape:'html':'UTF-8'}">
								<i class="icon-eye-open"></i>
							</a>
						</div>
						<a class="quick-view" href="{$product.link|escape:'html':'UTF-8'}" rel="{$product.link|escape:'html':'UTF-8'}">
							<span>{l s='Quick view'}</span>
						</a>
						{/if}
						{if (!$PS_CATALOG_MODE AND ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}
							<div class="content_price" itemprop="offers" itemscope itemtype="http://schema.org/Offer">
								{if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}
									<span itemprop="price" class="price product-price">
										{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}
									</span>
									<meta itemprop="priceCurrency" content="{$currency->iso_code}" />
									{if isset($product.specific_prices) && $product.specific_prices && isset($product.specific_prices.reduction) && $product.specific_prices.reduction > 0}
										{hook h="displayProductPriceBlock" product=$product type="old_price"}
										<span class="old-price product-price">
											{displayWtPrice p=$product.price_without_reduction}
										</span>
										{if $product.specific_prices.reduction_type == 'percentage'}
											<span class="price-percent-reduction">-{$product.specific_prices.reduction * 100}%</span>
										{/if}
									{/if}
									{hook h="displayProductPriceBlock" product=$product type="price"}
									{hook h="displayProductPriceBlock" product=$product type="unit_price"}
								{/if}
							</div>
						{/if}
						{if isset($product.new) && $product.new == 1}
							<a class="new-box" href="{$product.link|escape:'html':'UTF-8'}">
								<span class="new-label">{l s='New'}</span>
							</a>
						{/if}
						{if isset($product.on_sale) && $product.on_sale && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}
							<a class="sale-box" href="{$product.link|escape:'html':'UTF-8'}">
								<span class="sale-label">{l s='Sale!'}</span>
							</a>
						{/if}
					</div>
					{hook h="displayProductDeliveryTime" product=$product}
					{hook h="displayProductPriceBlock" product=$product type="weight"}
				</div>
				<div class="right-block">
					<h5 itemprop="name">
						{if isset($product.pack_quantity) && $product.pack_quantity}{$product.pack_quantity|intval|cat:' x '}{/if}
						<a class="product-name" href="{$product.link|escape:'html':'UTF-8'}" title="{$product.name|escape:'html':'UTF-8'}" itemprop="url" >
							{$product.name|truncate:45:'...'|escape:'html':'UTF-8'}
						</a>
					</h5>
					{hook h='displayProductListReviews' product=$product}
					<p class="product-desc" itemprop="description">
						{$product.description_short|truncate:360:'...'}
					</p>
					{if (!$PS_CATALOG_MODE AND ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}
					<div itemprop="offers" itemscope itemtype="http://schema.org/Offer" class="content_price">
						{if isset($product.show_price) && $product.show_price && !isset($restricted_country_mode)}
							<span itemprop="price" class="price product-price">
								{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}
							</span>
							<meta itemprop="priceCurrency" content="{$currency->iso_code}" />
							{if isset($product.specific_prices) && $product.specific_prices && isset($product.specific_prices.reduction) && $product.specific_prices.reduction > 0}
								{hook h="displayProductPriceBlock" product=$product type="old_price"}
								<span class="old-price product-price">
									{displayWtPrice p=$product.price_without_reduction}
								</span>
								{hook h="displayProductPriceBlock" id_product=$product.id_product type="old_price"}
								{if $product.specific_prices.reduction_type == 'percentage'}
									<span class="price-percent-reduction">-{$product.specific_prices.reduction * 100}%</span>
								{/if}
							{/if}
							{hook h="displayProductPriceBlock" product=$product type="price"}
							{hook h="displayProductPriceBlock" product=$product type="unit_price"}
						{/if}
					</div>
					{/if}
					<div class="button-container">
						{if ($product.id_product_attribute == 0 || (isset($add_prod_display) && ($add_prod_display == 1))) && $product.available_for_order && !isset($restricted_country_mode) && $product.minimal_quantity <= 1 && $product.customizable != 2 && !$PS_CATALOG_MODE}
							{if ($product.allow_oosp || $product.quantity > 0)}
								{if isset($static_token)}
									<a class="button ajax_add_to_cart_button btn btn-default" href="{$link->getPageLink('cart',false, NULL, "add=1&id_product={$product.id_product|intval}&token={$static_token}", false)|escape:'html':'UTF-8'}" rel="nofollow" title="{l s='Add to cart'}" data-id-product="{$product.id_product|intval}">
										<span>{l s='Add to cart'}</span>
									</a>
								{else}
									<a class="button ajax_add_to_cart_button btn btn-default" href="{$link->getPageLink('cart',false, NULL, 'add=1&id_product={$product.id_product|intval}', false)|escape:'html':'UTF-8'}" rel="nofollow" title="{l s='Add to cart'}" data-id-product="{$product.id_product|intval}">
										<span>{l s='Add to cart'}</span>
									</a>
								{/if}
							{else}
								<span class="button ajax_add_to_cart_button btn btn-default disabled">
									<span>{l s='Add to cart'}</span>
								</span>
							{/if}
						{/if}
						<a itemprop="url" class="button lnk_view btn btn-default" href="{$product.link|escape:'html':'UTF-8'}" title="{l s='View'}">
							<span>{l s='More'}</span>
						</a>
					</div>
					{if isset($product.color_list)}
						<div class="color-list-container">{$product.color_list}</div>
					{/if}
					<div class="product-flags">
						{if (!$PS_CATALOG_MODE AND ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}
							{if isset($product.online_only) && $product.online_only}
								<span class="online_only">{l s='Online only'}</span>
							{/if}
						{/if}
						{if isset($product.on_sale) && $product.on_sale && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}
							{elseif isset($product.reduction) && $product.reduction && isset($product.show_price) && $product.show_price && !$PS_CATALOG_MODE}
								<span class="discount">{l s='Reduced price!'}</span>
							{/if}
					</div>
					{if (!$PS_CATALOG_MODE && $PS_STOCK_MANAGEMENT && ((isset($product.show_price) && $product.show_price) || (isset($product.available_for_order) && $product.available_for_order)))}
						{if isset($product.available_for_order) && $product.available_for_order && !isset($restricted_country_mode)}
							<span itemprop="offers" itemscope itemtype="http://schema.org/Offer" class="availability">
								{if ($product.allow_oosp || $product.quantity > 0)}
									<span class="{if $product.quantity <= 0 && !$product.allow_oosp}out-of-stock{else}available-now{/if}">
										<link itemprop="availability" href="http://schema.org/InStock" />{if $product.quantity <= 0}{if $product.allow_oosp}{if isset($product.available_later) && $product.available_later}{$product.available_later}{else}{l s='In Stock'}{/if}{else}{l s='Out of stock'}{/if}{else}{if isset($product.available_now) && $product.available_now}{$product.available_now}{else}{l s='In Stock'}{/if}{/if}
									</span>
								{elseif (isset($product.quantity_all_versions) && $product.quantity_all_versions > 0)}
									<span class="available-dif">
										<link itemprop="availability" href="http://schema.org/LimitedAvailability" />{l s='Product available with different options'}
									</span>
								{else}
									<span class="out-of-stock">
										<link itemprop="availability" href="http://schema.org/OutOfStock" />{l s='Out of stock'}
									</span>
								{/if}
							</span>
						{/if}
					{/if}
				</div>
				{if $page_name != 'index'}
	 				<div class="functional-buttons clearfix">
						{hook h='displayProductListFunctionalButtons' product=$product}
						{if isset($comparator_max_item) && $comparator_max_item}
							<div class="compare">
								<a class="add_to_compare" href="{$product.link|escape:'html':'UTF-8'}" data-id-product="{$product.id_product}">{l s='Add to Compare'}</a>
							</div>
						{/if}
					</div>
				{/if}
			</div><!-- .product-container> -->
		</li>
	{/foreach}
	</ul>
{addJsDefL name=min_item}{l s='Please select at least one product' js=1}{/addJsDefL}
{addJsDefL name=max_item}{l s='You cannot add more than %d product(s) to the product comparison' sprintf=$comparator_max_item js=1}{/addJsDefL}
{addJsDef comparator_max_item=$comparator_max_item}
{addJsDef comparedProductsIds=$compared_products}
{/if}

vekia · July 4, 2014

you've got there truncate modifier

it affects whole code because it cuts of tags, and leave them unclosed

alloffus · July 4, 2014

you've got there truncate modifier

it affects whole code because it cuts of tags, and leave them unclosed

Is there any way to preventing it from doing this?

Thanks in advance

bastien80 · September 18, 2014

Hi, I have the same problem, was any solution found?

stevent · October 4, 2014

Same problem. help please !

wereghost · October 29, 2014

It was kind of answered in a previous post, I found solution by modifying in productlist.tpl

{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}

remove just strip_tag and it should looks like this :

{$product.description_short|truncate:360:'...'}

And the HTML is back (at least for me it worked Prestashop 1.6.0.8

Summit · November 14, 2014

And the HTML is back (at least for me it worked Prestashop 1.6.0.8

Hi,

I just tryed it with prestashop 1.6.0.8

Changed the following file

/prestashop/themes/default-bootstrap/productlist.tpl

from

{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}

to

{$product.description_short|truncate:360:'...'}

but it still deletes my script:

<br />

$('audio,video').mediaelementplayer();

// ]]></script>

<br />

jjryeste · December 12, 2014

Hello i have prestashop 1.6.0.6

in google structured data

me products ,Short description appear as description

can be exchanged in product.tpl
Short description for description

Thank you

khantaj · December 6, 2015

I had a same problem.. but solution is quite easy but was difficult to fine.. here it is

<div class="product-desc" itemprop="description">
{$product.description_short|truncate:360:'...'}
</div>

Just Change the P tag to <div> and remove strip_tag that it... I hove It will definately solve your issue

Lyudo · January 20, 2016

It doesn't work well. It breaks the code from some site pages. This is not solution for me. I hope someone help.

--

P.S. sorry for my bad English

Edited January 20, 2016 by Lyudo (see edit history)

hlecaros · February 22, 2016

Edit file \themes\default-bootstrap\js\global.js

change line 280

html = '<div class="product-container"><div class="row">';

by:

html = '<div class="product-container rte"><div class="row">';

change line 289

html += '<p class="product-desc">'+ $(element).find('.product-desc').html() + '</p>';

by:

html += '<p class="product-desc">'+ $(element).find('.product-desc').text() + '</p>';

Edit File \themes\default-bootstrap\product-list.tlp

change line 128

{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}

by:

{$product.description_short|escape:'html':'UTF-8'}

after you must clear cache.

its working.

motion2082 · April 4, 2016

Had issues with your modification above.

My code is different than the default bootstrap template

<p class="product-desc" itemprop="description">
	<span class="list-desc">{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}</span>
        <span class="grid-desc">{$product.description_short|strip_tags:'UTF-8'|truncate:90:'...'}</span>
</p>

Changing the <p> tags to <div> made Short Description work on LIST view but does not work on GRID view, just appears blank

Tried changing the global.js file to <div> also on both lines but made no difference. The "list-desc" gets hidden on GRID view but the "grid-desc" is not shown.

This really sucks, why have Prestashop not made html short descriptions the default layout. At least allow an option to toggle on/off

If anyone knows why my js would not be working above I would love you to lend a hand

Edited April 7, 2016 by motion2082 (see edit history)

lovemyseo · May 30, 2017

Edit file \themes\default-bootstrap\js\global.js

change line 280
html = '<div class="product-container"><div class="row">';
by:
html = '<div class="product-container rte"><div class="row">';
change line 289
html += '<p class="product-desc">'+ $(element).find('.product-desc').html() + '</p>';
by:
html += '<p class="product-desc">'+ $(element).find('.product-desc').text() + '</p>';
Edit File \themes\default-bootstrap\product-list.tlp

change line 128
{$product.description_short|strip_tags:'UTF-8'|truncate:360:'...'}
by:
{$product.description_short|escape:'html':'UTF-8'}
after you must clear cache.

its working.

Love your answer man worked like charm (y) thumbs up issue resolved big time

tinathegeek · September 26, 2017

oK.. this is great for 1.6 but 1.7 does not even have that file in that directory. Any suggestions on 1.7 version?

Allowing HTML on short description of product list, 1.6.0.8

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites