Gantry5 Atom Archives

Block Reveal Atom

Docs

Ideas for revealing content in a schematic box look as seen around the Web lately. The effect first shows a decorative block element drawn and when it starts to decrease its size, it uncovers some content underneath. See how Block Reveal can be designed beautifully on Demo Page.

# Block Reveal Package contents

Files	Description
jlblockreveal.yaml	Contains the Block Reveal Atom settings.
jlblockreveal.html.twig	The Twig file to pull information, settings.
reveal.js	Contains the Block Reveal JavaScript

Installing the particle on your website is a really simple process. You can refer to the document here to know more.

Documentation

Introduction

This document covers the installation and use of this template and often reveals answers to common problems and issues – we encourage you to read this document thoroughly if you need an in-depth guide on how to use the template.

If you have any questions that are beyond the scope of this document, feel free to ask via ticket support system: Ticket System

Docs

Create Beautiful Fullscreen Scrolling Websites

Installing the particle on your website is a really simple process. You just need to follow the below instructions depending on the platform you are on.

Docs

Video Background makes it extremely easy to add video across your website in no time!. See how Video Background can be designed beautifully on Demo Page.

# Video Background Package contents

Files	Description
jlvideobackground.yaml	Contains the Video Background Atom settings.
jlvideobackground.html.twig	The Twig file to pull information, settings.
jquery.mb.YTPlayer.min.css	Contains the Video Background Atom CSS.
jquery.mb.YTPlayer.min.js	Contains the Video Background Atom JavaScript.

Installation Installing the particle on your website is a really simple process. You can refer to the document here to know more.

Docs

This is a library for create icon from “Pe Icon 7 Stroke”. After enable, add class name of icon to your element.

Installing the particle on your website is a really simple process. You just need to follow the below instructions depending on the platform you are on.

Docs

This is a library for display icon from “Elegant Icons”. After enable, add class name of icon to your element.

Installing the particle on your website is a really simple process. You just need to follow the below instructions depending on the platform you are on.

Docs

This is a library for create icon from “Strow Gap Icons” After enable, add class “strokegap-icon” and class name of icon to your element.

Installing the particle on your website is a really simple process. You just need to follow the below instructions depending on the platform you are on.

Docs

Reveal Animations When You Scroll. Easily customize animation settings: style, delay, length, offset, iterations…

Installing the particle on your website is a really simple process. You just need to follow the below instructions depending on the platform you are on.

Docs

A lightweight Gantry5 Atom for creating particles. See how ParticleJS can be designed beautifully on Demo Page. 🙂

# ParticleJS Atom Package contents

Files	Description
jlparticlejs.yaml	Contains the ParticleJS Atom settings.
jlparticlejs.html.twig	The Twig file to pull information, settings.
particles.min.js	Contains the ParticleJS JavaScript.

Installation Installing the particle on your website is a really simple process. You can refer to the document here to know more.

Docs

Create toggleable notifications or show a banner to inform your visitors of cookies used by your website. See how Notification can be designed beautifully on Demo Page.

# Notification Package contents

Files	Description
jlnotification.yaml	Contains the Notification particle settings.
jlnotification.html.twig	The Twig file to pull information, settings.
js.cookie.min.js	Contains the JavaScript to handle the cookie. Notification and Alert particle using the same cookie js script to handle the cookie.

Installation Installing the particle on your website is a really simple process. You can refer to the document here to know more.

Docs

Make elements remain at the top of the page even when a user scrolls the page, like a sticky navigation. See how Sticky can be designed beautifully on Demo Page.

# Sticky Atom Package contents

Files	Description
jlnavsticky.yaml	Contains the Sticky Atom settings.
jlnavsticky.html.twig	The Twig file to pull information, settings.

Installation Installing the particle on your website is a really simple process. You can refer to the document here to know more.

Docs

Free Gantry5 atom to create a “smooth scroll back to top” button. Improve your website’s user experience with a very simple arrow which fades in when visitors start scrolling the page. See how Back To Top can be designed beautifully on Demo Page.

# Back To Top Package contents

Files	Description
jlbacktotop.yaml	Contains the Back To Top atom settings.
jlbacktotop.html.twig	The Twig file to pull information, settings.
_jlbacktotop.scss	Deprecated ~~The custom Back To Top style sheet. Use `@import "jlbacktotop";` in your custom.scss file to import it. Gantry will automatically pick it up and compile it properly.~~

Installation Installing the particle on your website is a really simple process. You can refer to the document here to know more.

Docs

Cookie Consent is a Gantry5 Atom for alerting users about the use of cookies on your website. It is designed to help you comply with the hideous EU Cookie Law. See Live Demo

# Cookie Consent Package Contents

Files	Description
jlcookieconsent.yaml	Contains the Cookie Consent atom settings.
jlcookieconsent.html.twig	The Twig file to pull information, settings.
cookieconsent.min.css	Contains the Cookie Consent CSS.
cookieconsent.min.js	Contains the Cookie Consent JavaScript.

Installing the particle on your website is a really simple process. You can refer to the document here to know more.

Gantry5 Atom

Block Reveal Atom

# Block Reveal Package contents

Wilson Documentation

Introduction

FullPage Scroll Atom Documentation

Video Background Atom

# Video Background Package contents

Pe icon 7 stroke Atom Documentation

Elegant Icons Atom Documentation

Stroke Gap Icons Atom

Scroll Reveal Atom Documentation

ParticleJS Atom Documentation

# ParticleJS Atom Package contents

JL Notification Gantry 5 Particle

# Notification Package contents

Sticky Atom Documentation

# Sticky Atom Package contents

Back To Top Atom Documentation

# Back To Top Package contents

Cookie Consent Atom

# Cookie Consent Package Contents

Gantry5 Particles