1. petzold
  2. Commercial Templates
  3. Monday, 01 August 2022
  4.  Subscribe via email
Hello, I use the Skylar template.
Is there a CSS possibility to automatically limit the text on the overview page?
I use the template on http://www.brick.tips. I want to write a long text and only the first 300 characters are displayed on the home page.
Is this possible via CSS or elsewhere?
Thank you very much!
Christian
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Christian

Using CSS alone it not possible to limit the character count however it is possible to limit the line count? Would this be a suitable solution? If yes, how many lines would you like to set the limit to?

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
I think about 5 lines... :)
  1. more than a month ago
  2. Commercial Templates
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
Actually, I just realise that this will need an override to achieve. May I suggest sending temporary administration access to your Joomla installation to info@joomla51.com and we will create the override for you. For our reference please paste a link to this post in your email.

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 3
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Ciaran, thank you so far - I wrote you a mail yesterday to info@

Hi Ciaran,

thank you very much for your quick reply!

As already written, it would be nice if in the blog category, instead of always manually inserting the "Weiterlesen" into the text, I automatically received a button to read more ("... mehr ยป";) after xxx characters or even after 6 lines.
There was a plugin for this under Joomla 3, but it no longer seems to be available for Joomla 4.
If you want, you can access my page with admin rights:

http://www.brick.tips/......
User: find in mail
Pass: find in mail

Thank you so much!
Christian
  1. more than a month ago
  2. Commercial Templates
  3. # 4
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Christian

I have amended your template to give the best possible solution with CSS alone however I realize that it probably drops short of what you are looking to achieve as I notice a couple of issues with it...

  • All test wraps to a new line after the image
  • All paragraphs are lost. Text moved to a single paragraph

To revert these changes simply remove the following from your template style custom CSS...

.blog .item-content-inside {
overflow: hidden;
text-overflow: ellipsis;
white-space: initial;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.blog .item-content-inside p + p {
display: contents;
}


Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 5
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!