fadriqueclickennet / slider-module
ClickennetCMS 的滑块模块
Requires
- php: ^7.1.3
- composer/installers: ~1.0
- fadriqueclickennet/core-module: dev-master
- fadriqueclickennet/media-module: dev-master
Requires (Dev)
- doctrine/dbal: ^2.6.3
- friendsofphp/php-cs-fixer: ^2.7
- orchestra/testbench: 3.8.*
- phpunit/phpunit: ^7.5
This package is auto-updated.
Last update: 2024-09-25 21:48:05 UTC
README
用法
先决条件
默认情况下,滑块模块使用 Bootstrap Carousel https://bootstrap.ac.cn/javascript/#carousel 创建,因此请确保您已加载所有标准 Bootstrap Carousel(Bootstrap Carousel CSS 和 JS)的先决条件。
基本用法
您可以使用 AsgardCMS 管理界面创建基本滑块 - 您可以创建并命名您的滑块(请注意这里的 系统名称 字段,它将在以后用于渲染),并创建单独的幻灯片。幻灯片可以链接到媒体模块中的图片,或具有指向外部图片的 URL。它们还可以包含指向网站任何页面的超链接、固定 URI 或 URL。
当滑块创建后,您可以使用 {!! Slider::render('slider_system_name') !}}
在模板中渲染它。
高级用法
使用您自己的滑块模板
如果您想更改滑块的渲染方式,使用自定义 HTML、CSS 类等,您可以将 Blade 模板名称作为 render()
方法的第二个参数传递,例如 {!! Slider::render('slider_system_name', 'slider/my-own-slider') !}}
模板可能看起来像这样
{-- Themes/MyTheme/views/slider/my-own-slider.blade.php --} <div id="{{ $slider->system_name }}" class="my-own-slider-class"> @foreach($slider->slides as $index => $slide) <div class="slide"> <a href="{{ $slide->getLinkUrl() }}"> <img src="{{ $slide->getImageUrl() }}" /> </a> </div> @endforeach </div>
您将在 $slider
变量中拥有 Modules\Slider\Entities\Slider
实例
提供您自己的滑块实例
您也可以将 Modules\Slider\Entities\Slider
实例作为第一个参数传递,而不是滑块的 system_name
,以渲染动态创建的滑块。
首先,在控制器中创建您的滑块实例并添加幻灯片,并将其传递给视图
<?php ... // import classes needed to create your own instance use Modules\Slider\Entities\Slider; use Modules\Slider\Entities\Slide; class HomepageController { ... /** * controller method */ public function displayHomepage() { // make a new Slider instance $mySlider = new Slider; $mySlider ->system_name = 'custom_slider'; // create slide 1 $slide1 = new Slide; $slide1->title = 'First Slide'; $slide1->caption = 'First slide text'; $slide1->external_image_url = 'https://placeholdit.imgix.net/~text?txtsize=33&txt=Slide1&w=800&h=300'; // create slide 2 $slide2 = new Slide; $slide2->title = 'Second Slide'; $slide2->caption = 'Second slide text'; $slide2->external_image_url = 'https://placeholdit.imgix.net/~text?txtsize=33&txt=Slide2&w=800&h=300'; // add slides to slider $mySlider->slides->add($slide1); $mySlider->slides->add($slide2); // render view return View::make('homepage') ->with('mySlider', $mySlider); }
然后,在 homepage.blade.php
模板内部,您可以使用 {!! Slider::render($mySlider) !!}
渲染滑块