Pages index content truncation by browser instead of backend

[Ibai]

Hey there,

I'm using Pages as a blog with 1 column design. 

When something is working slow (internet, server, client browser...), during the load of the web, the full article text is shown. Finally, when the webpage finishes loading, some javascript is run and the content of each article is truncated to N lines.

What fires this truncation is this attributes in the section HTML tag: data-ipsTruncate data-ipsTruncate-size='7 lines'

First question: Why is this being cut in the client and not in the backend? That makes the HTML heavier, CLS issues and so on.

Is there any workaround? 

Then, I see this function which cleans the HTML {$record->truncated()|raw}, but does not cut the text. Is it possible to cut the text in there?

Cheers,

Ibai

[opentype]

16 minutes ago, Ibai said:

Then, I see this function which cleans the HTML {$record->truncated()|raw}, but does not cut the text. Is it possible to cut the text in there?

Yes. If you just cut off the content field, you can cut off HTML tags and brake the page. But you can shorten the truncated text. 

[Ibai]

4 hours ago, opentype said:

Yes. If you just cut off the content field, you can cut off HTML tags and brake the page. But you can shorten the truncated text. 

I know it's possible to break HTML code. However, I guess, the "truncate()" function already "simplifies" the HTML that is being shown, there's no HTML special tags. In fact, there's only <br>s.

I mean, wouldn't it be a good idea to cut the text to 500 chars even if it's more that what's going to be shown? Just as a matter of optimization. If you post contents of thousands of chars, all of them are sent to the response.

Thanks for the advice and idea, I'm going to apply it to my forum 🙂 

[Ibai]

Hey,

Just if somebody was in the same point as me. This is the code that I'm currently using.

The template is in Category Articles -> entry. Find:

{record->truncated()|raw}

Replace with:

{{$real_truncated_text=substr($record->truncated(),0,700);}}{$real_truncated_text|raw}

Warning! This is working for me and for my structure with a sidebar. If you are not using a sidebar, maybe you have to increment the 700 to your desired chars number.

[Nathan Explosion]

Take a look at the optional $length parameter that truncated() has, which defaults to 500 when not specified....

{$record->truncated(false,700)|raw}

The false is the default value of the $oneLine parameter for truncated()

Edited March 14, 2021 by Nathan Explosion

[Ibai]

9 hours ago, Nathan Explosion said:

Take a look at the optional $length parameter that truncated() has, which defaults to 500 when not specified....

{$record->truncated(false,700)|raw}

The false is the default value of the $oneLine parameter for truncated()

Wow thanks!

Then if 500 is the default length for truncated, why is not truncating my content and instead it shows the full content? Maybe this is a bug?

Cheers,

Ibai

[Nathan Explosion]

Or I may be wrong? Taken a look at it a little closer this morning and it has the following comment:

* Text for use with data-ipsTruncate

So maybe it's not used the way I indicated. Try it, see if it makes a difference.

[Ibai]

11 hours ago, Nathan Explosion said:

Or I may be wrong? Taken a look at it a little closer this morning and it has the following comment:

* Text for use with data-ipsTruncate

So maybe it's not used the way I indicated. Try it, see if it makes a difference.

Definitely didn't work hehe.

I think IPS should develop sth. If you have a list of 20 LONG articles, the webpage load is very heavy and suboptimal. Potentially would make it worse in SEO terms. The browser has to wait until the whole page is downloaded and then execute the javascript to perform the lines cut.

Anyhow, thanks for the workaround!

[Ibai]

This is an update, in order not to cut the text in the middle of a <br/> and break the HTML. In this code I try to get the first "space" after 700 chars.

{{$real_truncated_text=substr($record->truncated(),0,strpos($record->truncated(), ' ', 700));}}{$real_truncated_text|raw}
 

Edited March 17, 2021 by Ibai