Khóa học Newnet Framework

Bài 16: Quản lý Slider: Module Slider

Module Slider dùng để quản lý các slide hình ảnh sử dụng trong website như các banner ở trang chủ, hay logo các brand cộng tác, hoặc một số thông tin như testimonial những thứ gì liên quan tới hình ảnh đều có thể áp dụng được.

Để cài đặc module chúng ta sử dụng composer: 

composer require newnetcms/slider

Sau đó chạy migrate để sinh ra các bảng dữ liệu cần thiết:

php artisan migrate

Slider được đặt trong tag Nội dung của trang quản trị viên.

Sau khi tạo thành công slider với các item slider, ta nhận được 1 mã code và paste chúng vào nơi chúng ta muốn hiển thị.

Vì slider sẽ theo giao diện của template nên sẽ không có mẫu nào cố định

Chúng ta sẽ truyền blade view vào hàm render làm tham số thứ 2:

{!! SliderRender::render('banner-slider', 'components.slider') !!}

trong file slider.blade.php

<div class="swiper-container" id="swiper-banner">
   {{ $slider->name }}
    <div class="swiper-wrapper">
        @foreach($sliderItems as $item)
            <div class="swiper-slide">
                <div class="banner-item">
                    <a href="{{ $item->link ?? '#' }}" class="link-cover"></a>
                    <span class="image-cover" style="background-image: url('{{ $item->image }}')"></span>
                </div>
            </div>
        @endforeach
    </div>
    <div class="swiper-pagination"></div>
</div>

Bên trong blade chúng ta có thể sử dụng 2 biến là $slider$sliderItems với $sliderItems được khai báo trait HasMediaTrait nên ta có thể lấy hình ảnh 1 cách dễ dàng