Add button "view less" for the text in manufacture´s page

[santinuro]

Hello everybody,

 

Using my current theme, and in the manufacturer’s page, I get the option to add a description. These descriptions that I add are sometimes long, so the theme just shows part of them and then a link with the word “more” and when I click on it I can see the entire text.

 

Well, now what I want is that when I have the entire text shown, I want a “Less” button to appear, so the text goes back to its initial length.

 

I understand I have to do it at manufacture.tpl, but, honestly, I have no idea how to do it.

 

Could somebody help me out?

 

Thank toy very much!

[rocky]

Try changing lines 43-45 of manufacturer.tpl from:

					<a href="#" class="lnk_more" onclick="$(this).prev().slideDown('slow'); $(this).hide();$(this).prev().prev().hide(); return false;">
						{l s='More'}
					</a>

to:

					<a href="#" class="lnk_more" onclick="$(this).prev().slideDown('slow'); $(this).hide();$('.lnk_less').show();$(this).prev().prev().hide(); return false;">
						{l s='More'}
					</a>
					<a href="#" class="lnk_less" onclick="$(this).prev().prev().hide(); $(this).hide();$('.lnk_more').show();$(this).prev().prev().prev().slideDown('slow'); return false;" style="display:none">
						{l s='Less'}
					</a>

[santinuro]

Hi @Ambassadors

 

thank you very much for your reply! However it´s not working, you can check it here: http://areab2b.lenubu.com/es/15_firstbike 

 

I modified the manufacture.tpl and cleaned the cache. Any idea??

 

Here it´s the code of manufacture.tpl

{include file="$tpl_dir./errors.tpl"}

{if !isset($errors) OR !sizeof($errors)}
	<h1 class="page-heading product-listing">
		{l s='List of products by manufacturer'} {$manufacturer->name|escape:'html':'UTF-8'}
	</h1>
	{if !empty($manufacturer->description) || !empty($manufacturer->short_description)}
		<div class="description_box rte">
			{if !empty($manufacturer->short_description)}
				<div class="short_desc">
					{$manufacturer->short_description}
				</div>
				<div class="hide_desc">
					{$manufacturer->description}
				</div>
				<a href="#" class="lnk_more" onclick="$(this).prev().slideDown('slow'); $(this).hide();$(this).prev().prev().hide(); return false;" title="{l s='More'}">
					{l s='More'}
				</a>
				<a href="#" class="lnk_less" onclick="$(this).prev().prev().hide(); $(this).hide();$('.lnk_more').show();$(this).prev().prev().prev().slideDown('slow'); return false;" style="display:none">
						{l s='Less'}
					</a>
			{else}
				<div>
					{$manufacturer->description}
				</div>
			{/if}
		</div>
	{/if}

	{if $products}
		<div class="content_sortPagiBar">
	    	<div class="sortPagiBar clearfix">
				{include file="./product-sort.tpl"}
				{include file="./nbr-product-page.tpl"}
			</div>
	    	<div class="top-pagination-content clearfix">
	        	{include file="./product-compare.tpl"}
	            {include file="$tpl_dir./pagination.tpl" no_follow=1}
	        </div>
		</div>

		{include file="./product-list.tpl" products=$products}

		<div class="content_sortPagiBar">
	        <div class="bottom-pagination-content clearfix">
	        	{include file="./product-compare.tpl"}
				{include file="./pagination.tpl" no_follow=1 paginationId='bottom'}
	        </div>
		</div>
	{else}
		<p class="alert alert-warning">{l s='No products for this manufacturer.'}</p>
	{/if} 
{/if}

[rocky]

You forgot to update the JavaScript in the More link. Copy the full code from my post, not just the Less link.

[santinuro]

Thank you very much!!