Laravel article image slideshow

Question

I've got a Laravel project where you can create articles and so on. Of course I want to have an image slideshow with multiple images per article. I've managed to save multiple images in the database in one column via implode. PICTURE

How do I display the slideshow now? I have no idea.

Answer 1

You just need to explode your data from database then show it

$images = explode('|', $post->image);

@foreach ($images as $image)
   <img src="{{ url($image) }} alt="image" />
@endforeach

Then you can use OwlCarousel https://owlcarousel2.github.io/OwlCarousel2/ to create slideshow.

You can create a basic slider with this example https://owlcarousel2.github.io/OwlCarousel2/demos/basic.html

Example: In your blade view

<div class="owl-carousel owl-theme">
    @foreach (explode('|', $post->image) as $image)
       <div class="item"><img src="{{ url($image) }} alt="image" /></div>
    @endforeach
</div>

Answer 2

The short answer is the one @Sang Nguyen posted: The opposite of implode() is explode() .

However I am going to add a more "Laravel-like" way of doing it:

Assuming you have an Article model, add an accessor:

class Article extends Model {
    ...
    public function getImagesListAttribute() {
        return collect(explode('|', $this->images));
    }
    ...
}

Then:

$article = Article::find(1);

var_dump($article->images_list); //would be a Collection of strings (which are your image names)

More about accessors: https://laravel.com/docs/5.6/eloquent-mutators#defining-an-accessor

More about collections: https://laravel.com/docs/5.6/collections