Skip to content

magenio-it/magento2-tinyslider

Repository files navigation

Magento2 Tiny-Slider 2 Integration

This module allows you to use Tiny Slider 2 in your Magento frontend.

GitHub release

Tiny-slider Release

Requirements

Generic badge Generic badge Generic badge

INSTALL

  • run
composer require 'magenio/magento2-tinyslider'

or add the following lines into your composer.json:

"require":{
    ...
    "magenio/magento2-tinyslider":"^1.0.0"
 }

Then run this commands:

composer update
bin/magento cache:flush
bin/magento module:enable Magenio_TinySlider
bin/magento setup upgrade

USAGE

Declarative notation

  • Using data-mage-init attribute. Example:
data-mage-init='{"tinySliderInit":{ 
        "items": 1,
       "responsive": {
            "640": {
                "edgePadding": 20,
                "items": 2
            },
            "1024": {
                "items": 4
            }
      } 
}}'>
  • Using <script type="text/x-magento-init"> ... </script> tag. Example:
<script type="text/x-magento-init">
 {
    "<element_selector>": {
        "tinySliderInit": {
            "items": 1,
            "responsive": {
                 "640": {
                     "edgePadding": 20,
                     "items": 2
                 },
                 "1024": {
                     "items": 4
                 }
            } 
        }
    }
 }
</script>

Imperative notation

<script>
     require([
        'tinySlider'
    ], function () {
         return tns({
               "container": "<element_selector>",
               "items": 1,
               "responsive": {
               "640": {
                   "edgePadding": 20,
                       "items": 2
               },
               "1024": {
                   "items": 4
               }
           }
       });
    });
</script>

Features and Options

All features and options for Tiny Slider are available on tiny-slider's github page:

Tiny Slider 2

Development

  • For work / contribute to development of tiny-slider or for update the library run
npm install

or

npm update --save