change the color on the main title

norgepaanytt · Member · Oct 26, 2011 at 9:09 pm
Copy link

Add topic to favorites
Hey.

I’m trying to change the color on my main blog title “norge på nytt 2012”. I want it to be white, but no matter what I do in the css-code, nothing changes.

Can anyone help me?

Thanks!

http://www.norgepånytt.no/

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Oct 27, 2011 at 6:48 am
Copy link
Add the following to your CSS.
```
#header #logo h1 a {
color: #FFFFFF;
}
```
norgepaanytt · Member · Oct 28, 2011 at 2:13 pm
Copy link
Thank you so much!

I also have another problem:

I’d really like to change the background color of the post titles on the spectrum-theme.

Now it’s green and I would like it to be hex #72000A.

Do you think you could help me with that as well?

Thank you!

http://www.norgepånytt.no/
thesacredpath · Member · Oct 28, 2011 at 5:50 pm
Copy link
That is far more involved. The banner behind the titles is made up from three images. Two are single images and one is an image “sprite” that includes a whole bunch of images used in the theme. At the very least you would have to recreate the small angled chunk on the bottom left of the banner (that makes it look like it folds back) that is no in the image sprite. Here are the three images. You would need to make this in the exact colors you wanted, and notice that the little angled chunk that makes it look like the banner folds back around the left site is a slightly darker green to make the banner appear 3-dimensional

http://s0.wp.com/wp-content/themes/pub/spectrum/images/bgs/post/main-title.png
http://s0.wp.com/wp-content/themes/pub/spectrum/images/sprite.png
norgepaanytt · Member · Oct 31, 2011 at 1:15 pm
Copy link
What’s the next step after I change the color?
panaghiotisadam · Member · Oct 31, 2011 at 1:45 pm
Copy link
After you change the color of the images using an image editing application, you upload the modified versions to your blog via Media > Add New and copy the File URLs.
Then you find the parts of your original CSS that pertain to those images and copy-paste them into the CSS editor:
```
.main-title {
	background: #6AB32E url(images/bgs/post/main-title.png) no-repeat 0 0;
}

#respond input#submit {
	background-image: url(images/sprite.png);
}

.main-title .edge {
	background: url(images/bgs/post/main-title-edge.gif) no-repeat 0 0;
}
```
Replace what’s inside the parentheses with the URLs of your images (and change the hex code in the first one as well).
norgepaanytt · Member · Oct 31, 2011 at 6:56 pm
Copy link
Thank you thank you thank you!!
norgepaanytt · Member · Nov 1, 2011 at 7:43 pm
Copy link
There is still som problem with the green color, how can I make it go away?

http://www.norgepånytt.no/
thesacredpath · Member · Nov 1, 2011 at 8:08 pm
Copy link
First, just a slight adjustment to match the colors in the band behind the post titles. Change the color code in the background declaration in .main-title to #841E16 .

On the green bit on the left end (triangle) that is in the image sprite that I referenced. Did you create a new image sprite and change the color of the green triangle to your chosen color (slightly darker red for the 3d effect)?

If not, you can create a new triangle (by itself) of your chosen color and then add the following to your CSS and change the URL to the new triangle image URL.
```
.left-fold {
background-image: url("URL OF NEW TRIANGLE");
}
```
Now, due to the way image sprites are done, the above will likely have to have adjustments made to positioning and we won’t be able to help with that till after you create the triangle and get it uploaded to your media library and give us the URL.

Alternately you can get rid of the green triangle altogether if you wish by adding the following.
```
.main-title {
border-bottom: none;
}

.left-fold {
display: none;
}
```
norgepaanytt · Member · Nov 3, 2011 at 10:07 am
Copy link
Thank you so much!
thesacredpath · Member · Nov 3, 2011 at 5:08 pm
Copy link
You are welcome.

No items found.