msp / lightgallery
LightGallery 的 Magento 模块包装器
0.1.1
2016-10-24 08:10 UTC
Requires
- php: *
- magento/magento-composer-installer: *
- msp/common: *
This package is auto-updated.
Last update: 2024-08-28 22:17:26 UTC
README
此模块允许您通过 requirejs 在 Magento 2 中使用 LightGallery。
安装
composer require msp/lightGallery
bin/magento module:enable MSP_LightGallery
bin/magento setup:upgrade
使用方法
您必须通过布局 XML 包含 CSS,例如,如果您想在产品页面中使用相册,请添加到 catalog_product_view.xml
<head>
...
<css src="MSP_LightGallery::css/lightgallery.min.css"/>
...
</head>
您可以使用 data-mage-init
初始化相册
<div id="your-gallery" data-mage-init='{
"LightGallery": {
"thumbnail":true
}
}'>
<a href="img/kitten1.jpg">
<img src="img/kitten1-thumb.jpg" />
</a>
<a href="img/kitten2.jpg">
<img src="img/kitten2-thumb.jpg" />
</a>
<a href="img/kitten3.jpg">
<img src="img/kitten3-thumb.jpg" />
</a>
</div>
或使用一个 <script type="text/x-magento-init">
<div id="your-gallery">
<a href="img/kitten1.jpg">
<img src="img/kitten1-thumb.jpg" />
</a>
<a href="img/kitten2.jpg">
<img src="img/kitten2-thumb.jpg" />
</a>
<a href="img/kitten3.jpg">
<img src="img/kitten3-thumb.jpg" />
</a>
</div>
<script type="text/x-magento-init">
{
"#your-slider": {
"LightGallery": {
"thumbnail":true
}
}
}
</script>