Integrate HTML template Assets

In this tutorial we will integrate the CSS, JS, fonts, and images from the Diamond HTML/CSS template into our base Bootstrap WordPress theme. This will include adding the CSS and JS to our WordPress theme the correct way (enqueue). We will also include Font Awesome and the images needed for our background images.

You need to have an active subscription to view this content.

Register Here!

Diamond HTML/CSS Files

Before you begin the tutorial series on how to integrate a HTML template into a WordPress theme you will need to download the Diamond HTML/CSS files below so you can follow along.

You need to have an active subscription to view this content.

Register Here!

Footer Theme Options to manage the copy

This tutorial goes over how to add two editors in a Footer section to the theme options panel. These editors will allow our theme users the ability to add any type on content they would like to the footer of the theme. These editors are perfect for copyright text and whatever else the user needs to put in the footer.

You need to have an active subscription to view this content.

Register Here!

WordPress Toolbar CSS for Fixed and Static Navigations

In this tutorial I go over some CSS that needs to be added to our WordPress theme based on the position of the navigation to work with the WordPress toolbar. This is determined by the users theme options selection from the WordPress dashboard. If the WordPress toolbar is enabled and the user has a fixed navigation, it might overlap. To fix this, we just add a little CSS to target the fixed navbar.

You need to have an active subscription to view this content.

Register Here!

Adding Media Queries to our WordPress theme

This tutorial will go over how to add CSS media queries to our WordPress theme. This will help us target and style different HTML elements for different devices. Bootstrap is a mobile first framework, so you will learn what this means and how we can use media queries in our responsive WordPress theme.

In this tutorial we will add the CSS styles to left align the footer copyright text on small devices and right align it on all the others. This will all be determined by the CSS styles in the media queries that target certain device widths.

You need to have an active subscription to view this content.

Register Here!