fatima1's avatar

read more in paragraph

hi all

i have post that i want to have read more link to show the rest of the post in the same page like this: i print the post {!! $post->description !!}

A paragraph (from the Ancient Greek παράγραφος paragraphos, "to write beside" or "written beside") is a self-contained unit of ...read more

How to do that?

0 likes
5 replies
andylord565's avatar
\Illuminate\Support\Str::words($value, $words = 100, $end = '...')
\Illuminate\Support\Str::limit($value, $limit = 100, $end = '...')

limit the words or the String and add a link on the end

1 like
fatima1's avatar

@S4MUEL - i did this but it doesn't work when i use {!! $post->description !!} to print

s4muel's avatar
s4muel
7 years ago
Best Answer
Level 50

@FATIMA1 blade (HTML) part:

<p>
    {{ str_limit($post->description, 100, '') }}
    @if (strlen($post->description) > 100)
        <span id="dots">...</span>
        <span id="more">{{ substr($post->description, 100) }}</span>
    @endif
</p>

<button onclick="myFunction()" id="myBtn">Read more</button>

CSS part:

#more  {display:  none;}

JS part:

function myFunction() {
    var dots = document.getElementById("dots");
    var moreText = document.getElementById("more");
    var btnText = document.getElementById("myBtn");

    if (dots.style.display === "none") {
        dots.style.display = "inline";
        btnText.innerHTML = "Read more";
        moreText.style.display = "none";
    } else {
        dots.style.display = "none";
        btnText.innerHTML = "Read less";
        moreText.style.display = "inline";
    }
}
2 likes

Please or to participate in this conversation.