prestashop: Show read more at product description if description longer than XXX number of characters

Question

Would you guys recomend me a way i could make the read more button appear only if the description has a certain ammount of characters only?

{if isset($product) && $product->description }
    <!-- full description -->
    <div id="idTab1"  style="overflow:hidden;height:250px;font-family:avantgarde-book;font-size:12px;line-height:14px;">{$product->description}</div>
    <input id="button" type="button" style="margin-top:5px;font-size:12px;color:white;font-family:avantgarde-book; width:120px;background:#4e3248;border:none;height:30px;border-radius:5px;" value="Mostrar +" onclick="showMore()"> 
            <input id="button2" type="button" style="margin-top:5px;display:none;font-size:12px;color:white;font-family:avantgarde-book; width:120px;background:#4e3248;border:none;height:30px;border-radius:5px;" value="Mostrar -" onclick="showLess()">

{/if}

i got this code so far and its working fine but the button appears even when its too short description, so i want to make the condition to show of only when the description is XXX number of characters long or more...

Answer 1

This is fairly easy since prestashop uses smarty.

Let's say you want to limit your description to 200 chars and after that display read more button

You can use count_characters. Here is a example:

{if isset($product) && $product->description }
        {* full description *}
        <div id="idTab1"  style="overflow:hidden;height:250px;font-family:avantgarde-book;font-size:12px;line-height:14px;">{$product->description}</div>
        {if $product->description|count_characters:true > 200 }
            <input id="button" type="button" style="margin-top:5px;font-size:12px;color:white;font-family:avantgarde-book; width:120px;background:#4e3248;border:none;height:30px;border-radius:5px;" value="Mostrar +" onclick="showMore()"> 
            <input id="button2" type="button" style="margin-top:5px;display:none;font-size:12px;color:white;font-family:avantgarde-book; width:120px;background:#4e3248;border:none;height:30px;border-radius:5px;" value="Mostrar -" onclick="showLess()">
        {else}
            {* don't display anything *}
        {/if}

{/if}

You can read about count_characters and about it's attributes from here

http://www.smarty.net/docsv2/en/language.modifier.count.characters.tpl

P.S right way to display something as a comment in smarty syntax is to display it between these tags {* *}

BR's

(if this helps you dont forget to accept it :) )