Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

Query Loop Post excerpt lenght in pixel

  • Hey is is possible to change the Post excpert from a query loop to pixels or letters instead of words. Sometimes we have big words there and sometimes not…so it looks sometimes really bad 😉

    Best Kevin

  • Hi there,

    it is possible to trim the excerpt by characters with some PHP
    Or using CSS you could trim the text to a number of lines.

    And does this apply to just Query Loops ? Or anywhere an excerpt is displayed ?

  • Hey David

    Ohh good to know that with Lines 😉 3 would be amazing.

    At the moment its just QueryLoops

  • Can I see a page with the query loop ? I need to see how the excerpt is being displayed to provide the correct CSS.

  • like here….on mobile we hide excerpt

  • OK.

    1. add this CSS to your site:

    
    .clamp-lines-3 {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        white-space: normal;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    

    2. select the Headline block that is displaying the excerpt and in Advanced > Additional CSS Classes add: clamp-lines-3

    NOTE: in your query loop post templates, I notice that the Headline blocks for the Post Meta and the Excerpt have a HTML Tag of H2. You may want to consider setting them to a DIV or a P

  • wow thank you, that works perfect. Also thank you for your great eye on the H2.

  • Glad to be of help!

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.