CODEWITHSUNDEEP
templatessymfonytwig
Ramón Devesa
Ramón Devesa

Reputation: 397

Limit String Twig

How can I limit a string length? I'm getting a description value from my database, but I want to only display a number of specific characters.

Upvotes: 14

Views: 34630

Answers (6)

sotn0r
sotn0r

Reputation: 109

You could use this Twig extension:

Usage

{{ text|ellipsis(20) }}
{{ text|ellipsis(20, '///') }}

namespace AppBundle\Twig;

//src/AppBundle/Twig/TwigTextExtension.php
class TwigTextExtension extends \Twig_Extension
{
    public function getFilters()
    {
        return array(
            new \Twig_SimpleFilter('ellipsis', array($this, 'ellipsisFilter')),
        );
    }

    public function ellipsisFilter($text, $maxLen = 50, $ellipsis = '...')
    {
        if ( strlen($text) <= $maxLen)
            return $text;
        return substr($text, 0, $maxLen-3).$ellipsis;

    }
}

Register it as a service in services.yml

services:
    twig.extension.twigtext:
        class: AppBundle\Twig\TwigTextExtension
        tags:
            - { name: twig.extension }

Upvotes: 0

Raja Khoury
Raja Khoury

Reputation: 3195

I used this to truncate blog posts and show an ellipsis..

{{ post.excerpt|striptags|length > 100 ? post.excerpt|striptags|slice(0, 100) ~ '...' : post.excerpt|striptags }}

If the post excerpt length is greater than 100 characters then slice it at the 100s character starting from the first one and append an '...' Otherwise show full text..

Upvotes: 14

Ron
Ron

Reputation: 201

I know this is not an answer to your specific question since you want to truncate to a certain number of characters, but something similar can also be achieved using CSS. That is unless you are still supporting IE8 and IE9 then there are some caveats.

With text-overflow this can be done using the ellipses value. Here is a sample from CSS-TRICKS:

.truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

This will allow you to truncate the text to the containers width, HOWEVER, for specific character counts the accepted TWIG resolution with the TRUNCATE function works perfectly.

REFERENCE: https://css-tricks.com/snippets/css/truncate-string-with-ellipsis/

Upvotes: 1

user2359967
user2359967

Reputation:

Try with Truncate function:

First, you need to activated Text extension:

# app/config/config.yml
  services:
    twig.extension.text:
        class: Twig_Extensions_Extension_Text
        tags:
            - { name: twig.extension }

Then, you can call truncate() helper within your Twig template as follow:

{{ variable.description | truncate(100, true) }}

Upvotes: 15

lordchancellor
lordchancellor

Reputation: 4105

So there's a couple of options listed above that aren't given any detail, so here's a bit more info:

{{ variable.description|truncate(100) }}

This will cut your text off at 100 characters exactly. The problem here is that if the 100th character is in the middle of a word, that word will be cut in half.

So to work around this, we can add 'true' into the truncate call:

{{ variable.description|truncate(100, true) }}

When we do this, truncate will check to see if we are in the middle of a word at the cut-off point and if we are, it will cut the string at the end of that word.

If we're also looking to truncate a string that may contain some HTML, we need to strip those tags away first:

{{ (variable.description|striptags)|truncate(100) }}

The only slight disadvantage to this is that we will lose any newline characters (such as those built into paragraph tags). If you are truncating a relatively short string though, this will possibly not be an issue.

Upvotes: 1

A.L
A.L

Reputation: 10483

Try this :

{{ entity.description|striptags|slice(0, 40) }}
  1. the striptags filter will remove the HTML tags, this will avoid to cut a tag in 2, example of this base case: Text ... <img src="http://examp
  2. the slice filter will cut the text, keeping only the 40 first characters

Upvotes: 26

Related Questions