Finished Look:

The highlighted section will be changed.

Go to:

Dashboard / Appearance / Editor / style.css

Code:

.secondary a {
color:#000000;
}

Back End Example:

Your dashboard should look something like this.

This will be your website with the new widths in place.

Go to:

Dashboard / Appearance / Editor / style.css

Code:

.columns-two #page {
width: 900px;
}

.columns-two #primary {
position: top left;
width: 600px;
padding: 10px;
}

Back End Example:

Your dashboard should look something like this.

Finished Look:

The highlighted section will be a link to your chosen URL.

Go to:

wp-content / themes  / k2 / header.php

Scroll to around line 38 and you should see this code <div id=”header”>. Replace this code with the one below.

Code:

<div id=”header” role=”banner” onclick=”location.href=’http://www.YOURDOMAINHERE!!!.com/’;” style=”cursor: pointer;”>

Back End Example:

Your header.php file should look something like this.

Here is the before and after of what the gallery will look like.

Go to:

Dashboard / Plugins / Installed Plugins / Find NEXT Gen Gallery and hit Edit

Then scroll down to ‘nextgen-gallery/css/nggallery.css‘ under the list of Plugin Files and click it.

Scroll down til you see /* ———– Gallery style ————-*/ and change overflow of the .ngg-galleryoverview to visible. Also add in a height value for .ngg-gallery-thumbnail-box (this will tell NEXT Gen how much space to use for the thumbnails in its image gallery. I used 60px and it pretty much eliminated all the extra space between the rows. As Steffen pointed out the navigation was hidden behind the thumbnails after the height was changed so add in the padding-top 35px for the .ngg-navigation.

Code:

.ngg-navigation {
padding-top:35px;

}

.ngg-galleryoverview {
overflow: visible;
margin-top: 10px;
width: 100%;
clear:both;
display:block !important;
}

.ngg-gallery-thumbnail-box {
float: left;
height: 60px;
}

Back End Example:

Your dashboard should look something like this.

Finished Look:

The highlighted section will be removed.

Go to:

Dashboard / Appearance / Editor / style.css

Code:

.comments {
display:none
}

Back End Example:

Your dashboard should look something like this.

Use this as a general guide when editing your background. Every time you use another property it will change your theme making it unique. To learn more about CSS click here.

CSS Background Properties:

• background
• background-attachment
• background-color
• background-image
• background-position
• background-repeat
• background-clip
• background-origin
• background-size

Use this as a general guide when editing your font. Every time you use another property it will change your theme making it unique. To learn more about CSS click here.

CSS Font Properties:

• color
• font-family
• font-size
• font-style
• font-variant
• font-weight

When using a child theme you can place the banner image in your custom theme’s ‘headers‘ folder. Each child theme should have an ‘images‘ and ‘headers’ folder. For more on child themes click here.

Design:

Create a header image that you want to use for your site.

TIP:

Images of exactly 780 × 200 pixels will be used as-is. Create your banner that size and you will not have to crop it when you upload.

It’s a good idea to customize the rest of your site to complement the banner after its finished.

Go to:

Dashboard / Appearance / Header

• Upload your custom header from your computer
• Choose if you would like to display text (title and description).
• If you chose to display text insert your color.

Back End Example:

This is what your blog will look like.

Go to:

Dashboard / Appearance / Editor / style.css

Code:

.entry-title, .entry-title a, .entry-title a:visited,
h2, h2 a, h2 a:visited,
h3, h3 a, h3 a:visited,
h4, h4 a, h4 a:visited {
color: red;
}

Back End Example:

Your dashboard should look something like this.