Update on October 31, 2019: Released Oxygen Essentials plugin.

Below is a list of changes and hacks that I consider to be essential when building WordPress websites with Oxygen.

Not all of them are necessary for every site though and the list is obviously a personal preference.


The following CSS is must-add to ensure responsiveness of images.

img {
  height: auto;
  max-width: 100%;

It is also nice to set vertical-align: top for the images so they do not take up that extra 1 pixel at the bottom than what their height is.

So, combining these two:

img {
  vertical-align: top;
  height: auto;
  max-width: 100%;

and the CSS classes for WordPress’ image (primarily) alignment:

img.alignright { float: right; margin: 0 0 2em 2em; }
img.alignleft { float: left; margin: 0 2em 2em 0; }
img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignright { float: right; }
.alignleft { float: left; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }

(blog post)

HTML5 output for Search Form, Galleries etc.

How to add support for HTML5 markup in Oxygen

Code Snippets

Code Snippets is a great plugin to add PHP snippets with options to activate and deactivate individual snippets.

Functionality Plugin

For full control of loading assets for and initializing jQuery scripts, a functionality plugin is essential.

A basic WordPress Custom Functionality plugin

Smooth scrolling to hash links

Smooth scrolling to hash links and Back to Top in Oxygen

Need help implementing a tutorial in your site or want to hire me for custom work?


Find the article helpful and wish to donate?



You need to be logged in to view and post comments.
Not a member yet? Join here.
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram
%d bloggers like this: