Plugins
Adding new plugins#
Adding a new plugin to your theme is simple.Here are two ways you can do that.
Simple approach
Place your new plugin in pages/assets/lib
folder. Eg: to add the typed.js
plugin, we will download it from here, unzip it and place the typed.js-master
folder in pages/assets/lib
folder.
Using NPM
Suppose we are installing the typed.js
plugin. Here are the steps:
Step 1:
Paths = {
...
DEPENDENCIES: {
...
'typed.js': {
FROM: 'node_modules/typed.js/lib/*.*',
TO: lib,
},
},
...
},
Here, lib
refers to pages/assets/lib
, where gulp will copy files from the typed.js
plugin. We actually use the lib
folder to store neccassary plugins
Step 3:
Run the following command:
gulp copy:dependency
Built-in plugins
Semantic UI (Accordion)#
An accordion allows users to toggle the display of sections of content.
Implementation in theme - Full DocumentationChart.js#
Date countdown#
A simple and html agnostic date countdown plugin for jQuery
Implementation in theme - Full DocumentationData Table#
DataTables is a plug-in for the jQuery Javascript library. It is a highly flexible tool, build upon the foundations of progressive enhancement, that adds all of these advanced features to any HTML table.
Implementation in theme - Full DocumentationDate Picker#
Lightweight, powerful javascript datetimepicker with no dependencies.
Implementation in theme - Full DocumentationFancyBox 3#
JavaScript lightbox library for presenting various types of media. Responsive, touch-enabled and customizable.
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.
Implementation in theme - Full DocumentationGoogle Map#
Build customized, agile experiences that bring the real world to your users with static and dynamic maps, Street View imagery, and 360° views.
Implementation in theme - Full DocumentationIs.js#
Micro check plugin. Check types, regexps, presence, time and more...
Full DocumentationPlyr#
A simple, accessible and customisable media player for Video, Audio, YouTube and Vimeo.
Implementation in theme - Full Documentationjqvmap#
JQVMap is a jQuery plugin that renders Interactive, Clickable Vector Maps. It uses resizable Scalable Vector Graphics (SVG) for modern browsers like Firefox, Safari, Chrome, Opera and Internet Explorer 9.
Implementation in theme - Full DocumentationLightbox 2#
Lightbox is a JavaScript library that displays images and videos by filling the screen, and dimming out the rest of the web page.
Implementation in theme - Full DocumentationToastr#
A toastr is a Javascript library for Gnome / Growl type non-blocking notifications. jQuery is required. The goal is to create a simple core library that can be customized and extended.
Implementation in theme - Full DocumentationOwl carousel 2#
Touch enabled jQuery plugin that lets you create a beautiful responsive carousel slider.
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.
Remodal#
Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.
Implementation in theme - Full DocumentationSelect2#
Select2 gives you a customizable select box with support for searching, tagging, remote data sets, infinite scrolling, and many other highly used options.
Implementation in theme - Full DocumentationjQuery.mb.YTPlayer#
Tinymce#
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