Plugin
Simple approach(without npm)
Place your new plugin in public/vendors
folder. Eg: to add the flatpickr
plugin, we will download it from here, unzip it and place the flatpickr-master
folder in public/vendors
folder. You can now simply link the plugin files to your HTML and use them.
Using npm
Suppose we are installing the flatpickr
plugin. Here are the steps:
Step 1:
run npm command for install plugin. for flatpickr
we can run
npm i flatpickr
Step 2:
Go to vendors.json
file and give the path directory from node_modules as follow
"flatpickr": {
"src": ["dist/flatpickr.min.js", "dist/flatpickr.min.css"],
"dest": "flatpickr"
}
Here, dest
refers to public/vendors/
, where gulp will copy files from the flatpickr
plugin. We actually use the vendors
folder to store neccassary plugins. And all the plugins folder name will be as we give the dest value
Step 3:
Run the following command:
gulp vendor:move
Built-in plugins
Anchor.js
A JavaScript utility for adding deep anchor links to existing page content. AnchorJS is lightweight, accessible, and has no dependencies.
Implementation in theme - Full DocumentationChoices
Choices.js is a lightweight, configurable select box/text input plugin. Similar to Select2 and Selectize but without the jQuery dependency
Implementation in theme - Full DocumentationCountUp
CountUp.js is a dependency-free, lightweight JavaScript class that can be used to quickly create animations that display numerical data in a more interesting way.
Implementation in theme - Full DocumentationDayjs
Day.js 2KB immutable date-time library alternative to Moment.js with the same modern API.
Full DocumentationDraggable.js
Dropzone
DropzoneJS is an open-source library that provides drag & drop file uploads with image previews.
Implementation in theme - Full DocumentationEcharts.js
A powerful, interactive charting and visualization library for browser.
Implementation in theme - Full DocumentationEmoji Button
Flatpickr
Lightweight, powerful javascript datetimepicker with no dependencies.
Implementation in theme - Full DocumentationFontAwesome 5
Get vector icons and social logos on your website with Font Awesome, the web's most popular icon set and toolkit.
Full DocumentationFullCalendar
Glightbox
Glightbox is a pure javascript lightbox. It can display images, iframes, inline content and videos with optional autoplay for YouTube, Vimeo and even self hosted videos.
Implementation in theme - Full DocumentationGoogle Map
Falcon uses Google map with Snazzy Maps, with different color schemes aimed towards web designers and developers.
Implementation in theme - Full DocumentationIs.js
Micro check plugin. Check types, regexps, presence, time and more...
Full DocumentationLeaflet Map
List.js
Tiny, invisible and simple, yet powerful and incredibly fast vanilla JavaScript that adds search, sort, filters and flexibility to plain HTML lists, tables, or anything.
Implementation in theme - Full DocumentationLodash
A modern JavaScript utility library delivering modularity, performance, & extras.
Full DocumentationLottie Web
Render After Effects animations natively on Web, Android, and iOS, and React Native.
Implementation in theme - Full DocumentationOverlay Scrollbars
A javascript scrollbar plugin which hides native scrollbars, provides custom styleable overlay scrollbars and keeps the native functionality and feeling.
Implementation in theme - Full DocumentationPlyr
A simple, lightweight, accessible and customizable HTML5, YouTube and Vimeo media player that supports modern browsers.
Implementation in theme - Full DocumentationProgressBar.js
With ProgressBar.js
, it's easy to create responsive and stylish progress bars for the web. Animations perform well even on mobile devices. It provides a few builtโin shapes like Line
, Circle
and SemiCircle
but you can also create custom
shaped progress bars with any vector graphic editor.
Rater
Star rating widget for the browser. Unlimited number of stars. No dependencies. No Jquery required.
Implementation in theme - Full DocumentationSwiper
Swiper is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. It is intended to be used in mobile websites, mobile web apps, and mobile native/hybrid apps.
Implementation in theme - Full DocumentationTinymce
The world's most popular JavaScript library for rich text editing.
Implementation in theme - Full DocumentationTyped Text
A JavaScript library that types out, deletes them, and then types again.
Implementation in theme - Full Documentation