Skip to main content
Style Guide Control Panel

Hello, universe!

Oxygen is a Bootstrap template for an informational website. Use it as a starting point to create something more unique or scrap it altogether and start fresh!

Page Banner

Key Features

Built on the best

Utilizes Bootstrap 4, the most popular frontend framework for building responsive, mobile-first projects quickly and easily. Includes over 675 icons from Font Awesome.

Core components

Oxygen includes global components like a site-wide alert banner, script manager support, advance social media share options and more! Includes core account pages and user sign-up.

Advanced functionality

Powerful plugins to handle a variety of advanced functionality. Includes LazySizes, Fancy Box 4 and Slick Slider!

Where do I start?

If you're using Oxygen as a starter theme to build your own, the best place to start is with the README.md that came with this theme or view it directly on github. This document thoroughly explains how to develop using Oxygen, as well as how to use some of it's built in functionality!


Plugin Examples

Lazy Loading

Oxygen utilizes the Lazysizes plugin to lazy load images as they appear on screen. Lazysizes offers a variety of benefits over other traditional lazy loading approaches. Give an image a class of lazy and set it's source to data-src to use default lazy loading.

Lazy loading supports responsive images and comes configured on oxygen with sm, md, lg, and xl breakpoints for picture sets that matchup with bootstrap. responsive image example

Slick Slider

Create a quick slick slider using the data-slick attribute on a div container. Customize slick with their documented settings!

Fancybox

Use the data attribute data-fancybox on an anchor or button to open an item or set of items in fancybox! Please see fancybox docs for full information on how to use!

Open Fancybox

Can also open a single image or group of images in a fancybox pop up with a slider, thumbnail selector and more!

Panels Components

Oxygen comes with panel components to use for anything you like! Please consult the Wiki for full details on how these panels work and how to get started making your own! The mobile menu that comes with oxygen is an example of an overlay panel. You can easily swap this for a dropdown panel, as they accept the same parameters.