Plugins

Adding new plugins

Adding a new plugin to your Sparrow is simple. You Here are two ways you can do that.

Simple approach(without npm)

Place your new plugin in public/vendors folder. Eg: to add the typed.js plugin, we will download it from here, unzip it and place the typed 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 typed.js plugin. Here are the steps:

Step 1:

run npm command for install plugin. for typed.js we can run

 npm i typed.js

Step 2:

Go to vendors.json file and give the path directory from node_modules as follow

"typed.js": {
	"src": ["lib/typed.js"],
	"dest": "typed.js"
}

Here, dest refers to public/vendors/, where gulp will copy files from the typed.js 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 Documentation

BigPicture

BigPicture 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 Documentation

CountUp

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 Documentation

FontAwesome 5

Get vector icons and social logos on your website with Font Awesome, the web's most popular icon set and toolkit.
Full Documentation

Google Map

Sparrow uses Google map with Snazzy Maps, with different color schemes aimed towards web designers and developers.
Implementation in theme - Full Documentation

GreenSock

Ultra high-performance, professional-grade animation for the modern web.
Implementation in theme - Full Documentation

Imagesloaded

Detect when images have been loaded.
Full Documentation

Is.js

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

Isotope

Filter & sort magical layouts.
Implementation in theme - Full Documentation

Loaders.css

Delightful and performance-focused pure css loading animations.
Full Documentation

Lodash

A modern JavaScript utility library delivering modularity, performance, & extras.
Full Documentation

Plyr

A simple, accessible and customisable media player for Video, Audio, YouTube and Vimeo.
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

Rellax

Rellax is a buttery smooth, super lightweight (1021bytes gzipped), vanilla javascript parallax library.
Implementation in theme - Full Documentation

Swiper

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 Documentation

Typed Text

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