How to add Slick in Magento 2?

The name of the pictureThe name of the pictureThe name of the pictureClash Royale CLAN TAG#URR8PPP





.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty margin-bottom:0;







up vote
1
down vote

favorite












I have added slick.min.js in my custom module in the path below




app/code/company_name/vendor_name/mymodule/view/frontend/web/js/slick.min/js




and my slick initialization js for my template is 



require([
 'jquery',
 'slick'
], function ($) 
$(document).ready(function () 
 $(".slider").slick(
 autoplay: true,
 slidesToShow: 1,
 slidesToScroll: 1,
 autoplay: true,
 autoplaySpeed: 2000,

 );
);
);


and added in requirejs-config.js as



var config = 
 paths: 
 'slick': "xxx_yyy/js/slick.min"
 ,
 map: 
 '*': 
 slickSlider: 'xxx_yyy/js/slick-slider'
 
 ,
 shim: 
 slick: 
 deps: ['jquery']
 
 ,
;


Now it is working except the design. How to add slick.less and slick-theme.less files in custom module?






slider magento2.2.6 js-css







share|improve this question



























    up vote
    1
    down vote

    favorite












    I have added slick.min.js in my custom module in the path below




    app/code/company_name/vendor_name/mymodule/view/frontend/web/js/slick.min/js




    and my slick initialization js for my template is 



    require([
     'jquery',
     'slick'
    ], function ($) 
    $(document).ready(function () 
     $(".slider").slick(
     autoplay: true,
     slidesToShow: 1,
     slidesToScroll: 1,
     autoplay: true,
     autoplaySpeed: 2000,

     );
    );
    );


    and added in requirejs-config.js as



    var config = 
     paths: 
     'slick': "xxx_yyy/js/slick.min"
     ,
     map: 
     '*': 
     slickSlider: 'xxx_yyy/js/slick-slider'
     
     ,
     shim: 
     slick: 
     deps: ['jquery']
     
     ,
    ;


    Now it is working except the design. How to add slick.less and slick-theme.less files in custom module?






    slider magento2.2.6 js-css







    share|improve this question























      up vote
      1
      down vote

      favorite









      up vote
      1
      down vote

      favorite











      I have added slick.min.js in my custom module in the path below




      app/code/company_name/vendor_name/mymodule/view/frontend/web/js/slick.min/js




      and my slick initialization js for my template is 



      require([
       'jquery',
       'slick'
      ], function ($) 
      $(document).ready(function () 
       $(".slider").slick(
       autoplay: true,
       slidesToShow: 1,
       slidesToScroll: 1,
       autoplay: true,
       autoplaySpeed: 2000,

       );
      );
      );


      and added in requirejs-config.js as



      var config = 
       paths: 
       'slick': "xxx_yyy/js/slick.min"
       ,
       map: 
       '*': 
       slickSlider: 'xxx_yyy/js/slick-slider'
       
       ,
       shim: 
       slick: 
       deps: ['jquery']
       
       ,
      ;


      Now it is working except the design. How to add slick.less and slick-theme.less files in custom module?






      slider magento2.2.6 js-css







      share|improve this question













      I have added slick.min.js in my custom module in the path below




      app/code/company_name/vendor_name/mymodule/view/frontend/web/js/slick.min/js




      and my slick initialization js for my template is 



      require([
       'jquery',
       'slick'
      ], function ($) 
      $(document).ready(function () 
       $(".slider").slick(
       autoplay: true,
       slidesToShow: 1,
       slidesToScroll: 1,
       autoplay: true,
       autoplaySpeed: 2000,

       );
      );
      );


      and added in requirejs-config.js as



      var config = 
       paths: 
       'slick': "xxx_yyy/js/slick.min"
       ,
       map: 
       '*': 
       slickSlider: 'xxx_yyy/js/slick-slider'
       
       ,
       shim: 
       slick: 
       deps: ['jquery']
       
       ,
      ;


      Now it is working except the design. How to add slick.less and slick-theme.less files in custom module?






      slider magento2.2.6 js-css




      slider magento2.2.6 js-css






      share|improve this question













      share|improve this question











      share|improve this question




      share|improve this question










      asked 38 mins ago









      Pavitra

      616




      616




















          1 Answer
          1






          active

          oldest

          votes

















          up vote
          2
          down vote



          accepted










          You can create a '_module.less' file and then call your less files in it.



          Add your 'slick.less' and 'slick-theme.less' file under the following directory



          app/code/Vendor/Module/view/frontend/web/css/source


          Now create '_module.less' file as given below




          app/code/Vendor/Module/view/frontend/web/css/source/_module.less




          @import 'slick.less';
          @import 'slick-theme.less';


          Then run the deploy command



          php -dmemory_limit=2G bin/magento setup:static-content:deploy -f





          share|improve this answer






















          • Thanks for the Reply!!! It worked...!!!
            – Pavitra
            9 mins ago










          Your Answer







          StackExchange.ready(function()
          var channelOptions =
          tags: "".split(" "),
          id: "479"
          ;
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function()
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled)
          StackExchange.using("snippets", function()
          createEditor();
          );

          else
          createEditor();

          );

          function createEditor()
          StackExchange.prepareEditor(
          heartbeatType: 'answer',
          convertImagesToLinks: false,
          noModals: false,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: null,
          bindNavPrevention: true,
          postfix: "",
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          );



          );













           

          draft saved


          draft discarded


















          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f245475%2fhow-to-add-slick-in-magento-2%23new-answer', 'question_page');

          );

          Post as a guest

















          1 Answer
          1






          active

          oldest

          votes








          1 Answer
          1






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes








          up vote
          2
          down vote



          accepted










          You can create a '_module.less' file and then call your less files in it.



          Add your 'slick.less' and 'slick-theme.less' file under the following directory



          app/code/Vendor/Module/view/frontend/web/css/source


          Now create '_module.less' file as given below




          app/code/Vendor/Module/view/frontend/web/css/source/_module.less




          @import 'slick.less';
          @import 'slick-theme.less';


          Then run the deploy command



          php -dmemory_limit=2G bin/magento setup:static-content:deploy -f





          share|improve this answer






















          • Thanks for the Reply!!! It worked...!!!
            – Pavitra
            9 mins ago














          up vote
          2
          down vote



          accepted










          You can create a '_module.less' file and then call your less files in it.



          Add your 'slick.less' and 'slick-theme.less' file under the following directory



          app/code/Vendor/Module/view/frontend/web/css/source


          Now create '_module.less' file as given below




          app/code/Vendor/Module/view/frontend/web/css/source/_module.less




          @import 'slick.less';
          @import 'slick-theme.less';


          Then run the deploy command



          php -dmemory_limit=2G bin/magento setup:static-content:deploy -f





          share|improve this answer






















          • Thanks for the Reply!!! It worked...!!!
            – Pavitra
            9 mins ago












          up vote
          2
          down vote



          accepted







          up vote
          2
          down vote



          accepted






          You can create a '_module.less' file and then call your less files in it.



          Add your 'slick.less' and 'slick-theme.less' file under the following directory



          app/code/Vendor/Module/view/frontend/web/css/source


          Now create '_module.less' file as given below




          app/code/Vendor/Module/view/frontend/web/css/source/_module.less




          @import 'slick.less';
          @import 'slick-theme.less';


          Then run the deploy command



          php -dmemory_limit=2G bin/magento setup:static-content:deploy -f





          share|improve this answer














          You can create a '_module.less' file and then call your less files in it.



          Add your 'slick.less' and 'slick-theme.less' file under the following directory



          app/code/Vendor/Module/view/frontend/web/css/source


          Now create '_module.less' file as given below




          app/code/Vendor/Module/view/frontend/web/css/source/_module.less




          @import 'slick.less';
          @import 'slick-theme.less';


          Then run the deploy command



          php -dmemory_limit=2G bin/magento setup:static-content:deploy -f






          share|improve this answer














          share|improve this answer



          share|improve this answer








          edited 5 mins ago

























          answered 16 mins ago









          Dinesh Yadav

          3,3971731




          3,3971731











          • Thanks for the Reply!!! It worked...!!!
            – Pavitra
            9 mins ago
















          • Thanks for the Reply!!! It worked...!!!
            – Pavitra
            9 mins ago















          Thanks for the Reply!!! It worked...!!!
          – Pavitra
          9 mins ago




          Thanks for the Reply!!! It worked...!!!
          – Pavitra
          9 mins ago

















           

          draft saved


          draft discarded















































           


          draft saved


          draft discarded














          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fmagento.stackexchange.com%2fquestions%2f245475%2fhow-to-add-slick-in-magento-2%23new-answer', 'question_page');

          );

          Post as a guest
































































          Comments

          Post a Comment

          Popular posts from this blog

          What does second last employer means? [closed]

          Image
          Clash Royale CLAN TAG #URR8PPP .everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty margin-bottom:0; up vote -3 down vote favorite Say, for example I have worked in the following companies, Company A => 2010 - 2011 Company B => 2011 - 2012 Company C => 2012 - Till Date Company D => Have offer Now assume Company D is asking to submit documents from my second last employer. So from the list of companies given, which company would be qualified as second last employer? software-industry employer share | improve this question asked Aug 10 '14 at 5:16 Rajaprabhu Aravindasamy 559 1 6 13 closed as off-topic by Jim G., jmort253 ♦ Aug 11 '14 at 1:58 This question appears to be off-topic. The users who voted to close gave this specific reason: "Questions seeking advice on company-specific regulations, agreements, or policies should be directed to your manager or HR department. Questions that address...
          Read more

          Installing NextGIS Connect into QGIS 3?

          Image
          Clash Royale CLAN TAG #URR8PPP .everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty margin-bottom:0; up vote 1 down vote favorite Just acquired free version of NEXTGIS and trying to install the plugin for QGIS. It tells me it was not designed for version 3 of QGIS. How do I set up the QGIS-NEXTGIS interface then? qgis qgis-plugins nextgis share | improve this question edited 3 hours ago PolyGeo ♦ 51.9k 17 77 233 asked 4 hours ago IanGS 16 4 New contributor IanGS is a new contributor to this site. Take care in asking for clarification, commenting, and answering. Check out our Code of Conduct. add a comment  |  up vote 1 down vote favorite Just acquired free version of NEXTGIS and trying to install the plugin for QGIS. It tells me it was not designed for version 3 of QGIS. How do I set up the QGIS-NEXTGIS interface then? qgis qgis-plugin...
          Read more

          One-line joke

          A one-liner is a joke that is delivered in a single line. A good one-liner is said to be pithy - concise and meaningful. [1] Comedians and actors use this comedic method as part of their act, e.g. Jimmy Carr, Tommy Cooper, Rodney Dangerfield, Norm Macdonald, Ken Dodd, Stewart Francis, Zach Galifianakis, Mitch Hedberg, Anthony Jeselnik, Milton Jones, Shappi Khorsandi, Jay London, Mark Linn-Baker, Demetri Martin, Groucho Marx, Dan Mintz, Emo Philips, Tim Vine, Steven Wright and Henny Youngman and Arnold Schwarzenegger. [ citation needed ] Many fictional characters are also known to deliver one-liners, including James Bond, who usually includes pithy and laconic quips after disposing of a villain. [ citation needed ] Examples "A baby seal walks into a club." "A dyslexic man walks into a bra." (Anonymous) "There are three types of people, those who can count and those who can't." "Venison's dear, isn't it?" (Jimmy Carr) "An escala...
          Read more