---
title: "Metal Toad University #8: The Wolf Theme"
description: This session had us finding new images to create a new theme for our site.  Once our new wolf images and patterns were created and exported, we went about with the theming.
---

[Blog ](https://www.metaltoad.com/blog)

# [Metal Toad University #8: The Wolf Theme](https://www.metaltoad.com/blog/metal-toad-university-8-wolf-theme)

 Written by [Metal Toad Staff](https://www.metaltoad.com/blog/author/metal-toad-staff) | Feb 27, 2013 12:00:00 AM

This session had us finding new images to create a new theme for our site. Once our new wolf images and patterns were created and exported, we went about with the theming. I added one class to the HMTL: wolf. Then we found the styles that were specifying images and copied them to a new location in our CSS and prefixed them with the wolf class. That made this:

 h2:before {   
 content: ".";   
 background: url(../img/skull.png);   
 width: 52px;   
 position: absolute;   
 left: 0px;   
 height: 82px;   
 font-size: 0px;   
 }

 Into this:

 .wolf h2:before {   
 background: url(../img/wolf/bullet.png);   
 height: 56px;   
 top: 11px;   
 }

We didn't have to specify things like position in our new rule because that is still picked up by the original rule.

Once we had created a new theme, we added a toggle for each theme that allows us to switch between the two just by adding and removing the wolf class.

This week we're going to make it live on a VPS (virtual private server), purchase a domain name for it, and talk about version control with github. These types of things are commonly being referred to as DevOps or Developer Operations these days and have a lot to do with serving your pages to the interent rather than the building of the sites that we've been doing. Look for [Tom Martin](https://www.metaltoad.com/people/tom) to help out and talk about some of the lower cost options.

Here's the video from last week:

[View full post](https://www.metaltoad.com/blog/metal-toad-university-8-wolf-theme)

```json
{
  "@context" : "http://schema.org",
  "@type" : "BlogPosting",
  "author" : {
    "@type" : "Person",
    "name" : "Metal Toad Staff"
  },
  "dateModified" : "2023-12-06T23:20:50.151Z",
  "datePublished" : "2013-02-27T00:00:00Z",
  "headline" : "Metal Toad University #8: The Wolf Theme",
  "image" : {
    "@type" : "ImageObject",
    "height" : 500,
    "url" : "https://6104926.fs1.hubspotusercontent-na1.net/hubfs/6104926/Imported_Blog_Media/Metal_Toad_blog_generic-Aug-11-2023-09-59-28-6540-PM.jpg",
    "width" : 870
  },
  "mainEntityOfPage" : "https://www.metaltoad.com/blog/metal-toad-university-8-wolf-theme",
  "publisher" : {
    "@type" : "Organization",
    "logo" : {
      "@type" : "ImageObject",
      "height" : 60.0,
      "url" : "https://6104926.fs1.hubspotusercontent-na1.net/hubfs/6104926/social-suggested-images/6104926.fs1.hubspotusercontent-na1.nethub6104926hubfsMetal_Toad_Logo_orange_horizontal-50-1.jpg",
      "width" : 240.00002
    },
    "name" : "Blog"
  }
}
```