After customization – tabs have lost their color
-
First, I am very pleased with what WordPress.com offers: free hosting; 3 GB; advanced themes; columns; tabs; and more!
I have tried upgrading to be able to alter my CSS. I am pleased that now may middle column is wider, and I can change the fonts of the text – and their sizes.
Just two things trouble me right now (I hope you can help me with at least one of them):
1. Now that the body is wider, I would like to make the header larger. Is this possible?
2. The theme used to have green tabs that stood out nicely. But now that I have changed the CSS — the tabs have turned to grey (which is the save color as the rest of the margin). I don’t think I did anything to cause this. I hope you can help me with this!
-
Rockerinfo,
If you don’t know the answer to the question, don’t spam the thread posting your blog’s URL.
avrohomd,
1) yes
Re No. 2, it can be fixed, but after seen your blog… Your CSS is messed up. The footer is out of place, and I don’t know what else you did… To fix one thing, other stuff needs to be fixed as well, and I don’t have the time to do it right now. Maybe one of the other volunteers with CSS knowledge will be able to help.
-
1) If yes, (that I can change the width of the header) — please tell me how. I tried changing it in the CSS – but I didn’t see a change.
2) I hope someone will have time to help me with my tabs (and footer) problems.
-
I’ll address #2 first and then move on to #1 in a few minutes. It is never a good idea to paste the entire CSS stylesheet into the CSS edit window. Your new CSS stylesheet is stored in a different directory from the original which means all the relative URL links end up broken. Only paste the exact sections, and the specific declarations that you are changing into the CSS edit window.
To fix this the way it is now, you are going to have to figure out the original URL for each and every image called in the CSS and then replace the relative URL with the absolute URL.
-
1. You will first have to create a new header overlay image the correct width for your modified theme. You then will have to add a background declaration to #header-overlay.
Here is the original image you will have to modify and upload to your media library: http://s2.wordpress.com/wp-content/themes/pub/digg3/images/bg_header_overlay.png .
One other thing I will mention. A good percentage of people are still on 1024 x 768 monitor resolution which means a good portion of people out there are going to have to horizontally scroll to see your blog, and that is the number 3 of the top ten things that irritate people about the web – horizontal scrolling.
-
Also, you will have to create a brand new header for your theme, and you will have to insert the header image URL into the appropriate place in the CSS.
As far as the images lost for the tabs, see my previous about the broken relative links.
-
Thank you for the good advice.
Shouldn’t it say on the dashboard, next to the option: ‘Start from scratch and just use this’ something like: ‘usually not recommended’.
I want to try like you say, just to paste in my changes.
Can I do like it says in the documentation:
I messed up. How can I reset my theme’s stylesheet?
Go to Appearance -> Edit CSS, remove all CSS code from the editor, and click Save Stylesheet.
Would this work for me?
-
Yes, remove everything from the edit window, make sure “add to existing…” is selected and click save and it will return back to the original.
-
So I removed everything. And we are back to square one.
Now I want the center column to be wider. So I have increased it by 200px. But I didn’t change the whole CSS stylesheet — as you have advised.
And I think we have had partial success. The middle column is wider. And the tabs are still green!
But like DevBlog noted, my footer is now out of place.
And also, I would like the header to be wider.
Any more suggestions?
-
I’ve got to run some errands and will probably be back in about 2 hours. I’ll look at things for you then.
-
Thank you! I guess you have a life to live also.
In addition, if you could also help when you get back:
My blog is wider now, but the middle column does not seem any wider!
-
I found the problem:
.entry {
max-width:650px;
}Now the center column is wider — like is desired. And the tabs look good. Just would like to see the header wider.
-
I was working on my blog for the last two hours — and the tabs looked perfect.
But now that I stopped — and came back to it — the tabs are missing their color again!
They are very hard to see. And for the last hour, I have just been editing a post and not the CSS.Where did the color to the tabs go?
-
It looks like you either pasted the entire CSS again, or you still have the “add to existing” checked. If you add the entire CSS to the window, then you should have the “start from scratch” button is selected, and you need to fix the URL’s in your CSS and change them from relative to absolute.
The image for the tabs seems to be missing. This is what is in the CSS but it leads to a 404 file not found error: http://choveveitzion.wordpress.com/images/bg_tab_left.gif .
The URL for that image should actually look like this: http://s2.wordpress.com/wp-content/themes/pub/digg3/images/bg_tab_right.gif .
The other part of the button should look like this: http://s2.wordpress.com/wp-content/themes/pub/digg3/images/bg_tab_left.gif .
Replace the URL’s in your CSS with the above.
-
The information you gave me was very helpful.
I wasn’t pasting the entire CSS again, nor was “add to existing” checked.
But thanks to your help, somehow I saw things in the CSS that I was adding that was about the tabs!
I don’t know how it got there. But I took those out and now the tabs seem fine.
Thank you!
Now on to my other issue (even though it doesn’t concern me as much as the tabs).
How can I make the header wider? I tried making some changes in the CSS for that – but the header is still not wider.
Suggestions?
-
-
- The topic ‘After customization – tabs have lost their color’ is closed to new replies.