screenshot of css

Twenty Eleven Child Theme; Make It Tacky With These 3 Easy CSS Mods!

In the Clark College WordPress Class We have downloaded Instant WordPress, which is a server designed to act like WordPress.org. It is free to download, and includes features such as plugins and use of the editor. However, the website that you create with this software is NOT live, and remains on your hard drive. Where it stays. Reclused from the world and worn out while you test its limits. But I digress…

The class has been assigned to create a child theme for Twenty Eleven. This class is welcome to Developers and non-developers alike, and sung beautifully by Robb Crabtree is a quick tutorial on how to create a child theme: Child Theme and CSS.

Now, since the class is riddled with said Developers and non-developers alike, I chose to start where anyone would, with colors, tacky bullets, and plugins!

Custom Image Bullets
Content Background Color
Content Box Shadow
Plugins

Custom Image Bullets

I hate to admit that the very first thing I did was change the unordered list bullet style. Don’t judge me, I don’t know what compelled me to make this my first alteration in the vast land of possibilities. In this case, I added an image instead of a boring square or circle bullet.

Here’s the code to change your bullets into an image:

ul {
list-style-image: url('http://i.imgur.com/f5p6l3T.png');
}

There you have it! Now your bullets should look awesome, like these:
bullets


content background color

Here is another silly one, but it may be of some use for someone out there. Changing your content background color to something other than Twenty Elevens two options: black or white.
In twenty eleven, the main content is embedded in an id called “primary”. So instead of only changing the #content color, changing the #primary color will change and override the color of all elements withing it, including #content.

Here’s the code to do that:

#primary {
background-color:#c3b4b6;}

contentbkgd

Box Shadows

Hey, Maybe you were expecting me to start big, but I like my box shadows. I tried making the background a CSS3 animation before trying this, but it didn’t want to work, so while I play around with that behind the scenes, in the mean time a box shadow is way better than nothing.

box_shadow

To learn how a box shadow works, I recommend going to W3Schools for their awesome box-shadows tutorial.

plugins

While writing my Plugin article, Top WordPress Plugins; 2012 versus 2013 for the Clark College WordPress Class,
I was exposed to the highest rated and most popular plugins.
Some of these sparked my interest, and I went ahead and tried a few of them out.

Some led me to find ones that were not mentioned that I ended up liking better, and some sounded better than what they turned out to be. In the article, I included “Isobels Picks“, which include some of my favorite plugins, even if most of them are a little unnecessary.

For a review and installation tutorial on one of the plugins I installed, Shortcodes Ultimate, check out my article:

Plugin Install and Review; Shorcodes Ultimate

This review includes instruction on how to install a plugin and activate it for use on your site!

So, as you can see, I have not completed anything impressive, but not to worry! That will come, and so will the tutorials!

For More Information

Advertisements

4 thoughts on “Twenty Eleven Child Theme; Make It Tacky With These 3 Easy CSS Mods!”

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s