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 Documentation
Chart.js#

Simple HTML5 Charts using the canvas element

Implementation in theme - Full Documentation
Date countdown#

A simple and html agnostic date countdown plugin for jQuery

Implementation in theme - Full Documentation
Data 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 Documentation
Date Picker#

Lightweight, powerful javascript datetimepicker with no dependencies.

Implementation in theme - Full Documentation
FancyBox 3#

JavaScript lightbox library for presenting various types of media. Responsive, touch-enabled and customizable.

Implementation in theme - Full Documentation
FontAwesome 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 Documentation
Google 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 Documentation
Is.js#

Micro check plugin. Check types, regexps, presence, time and more...

Full Documentation
Plyr#

A simple, accessible and customisable media player for Video, Audio, YouTube and Vimeo.

Implementation in theme - Full Documentation
jqvmap#

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 Documentation

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 Documentation
Toastr#

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 Documentation

Touch enabled jQuery plugin that lets you create a beautiful responsive carousel slider.

Implementation in theme - Full Documentation
ProgressBar.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.

Implementation in theme - Full Documentation
Remodal#

Responsive, lightweight, fast, synchronized with CSS animations, fully customizable modal window plugin with declarative configuration and hash tracking.

Implementation in theme - Full Documentation
Select2#

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 Documentation
jQuery.mb.YTPlayer#

An HTML5 Background player for YouTube video.

Implementation in theme - Full Documentation
Tinymce#

The world's most popular JavaScript library for rich text editing.

Implementation in theme - Full Documentation
Typed text#

A JavaScript library that types out, deletes them, and then types again.

Implementation in theme - Full Documentation