Blogging, CSS, CSS Upgrade, CustomCSS, Life, Themes, Thoughts, Web designing, Wordpress

Uncovering the New Blog Look

After ranting about the free WordPress themes for more than a year, I finally decided to take the plunge and get myself the CSS upgrade. This was a difficult decision for me because I’m only a basic user of CSS, but after experimenting with the “Preview” function in another blog, I did start feeling more confident about my coding abilities.

This design is based on the CSS skin called Baubles. Most of the CSS skins that are free and ready to download (for WordPress.com) are based on either the Sandbox/Sandbox-10 or the K2-Lite theme. It’s important to know that there are many many WordPress themes available for download…but 98% of them are only available for WordPress.org users.

Some of the major changes made by me:

1. Wide, 3 column look- Most of the three column themes at WordPress suck, except for maybe Digg-3, which is one of the most widely used themes here. So, this was a conscious decision to be different and try to incorporate all the good things in the same theme.

2. Footer- I added a strip of picture to my footer and tried to spice it up.

3. I’ve personalized the background color for comments made by the blog author.

4. Those of you who are WordPress users can probably see the new, green color for the navigation bar! I can also make it disappear with a piece of code

5. Also made a small signature using GIMP. I plan to use it for all my posts henceforth.

Problems with the Theme-

1. I removed the Blog Header and Description from the style sheet and added the blog header image, which is no longer click-able. There is a new widget in my Presentation tab that adds the Home Page link though.

2. I don’t like the border around some images in my sidebar. I need to find a way to remove them.

6. You must have noticed the small leafy, images in the sidebar and at the beginning of each blog title. I made them using GIMP, Irfanview and some free images that I downloaded from the internet. Those of you who have the upgrade or just want to learn CSS anyway, should download the Firefox add-on called CSS Viewer, that lets a user view the detailed CSS of any blog/website. It’s a great tool if you want to try to replicate the style of some other blog/website.

I also really like the Diurnal skin by the same designer. I plan to use it next (whenever I make the theme change, that is). My question for you is- Do you like the new look? Any suggestions? 🙂

ruhi.jpg

Advertisements
Standard

24 thoughts on “Uncovering the New Blog Look

  1. like it???
    its wonderfull …really .. there’s something catchy about the theme ..dont know it.. 😛
    yet it is so simple..:D
    i am loving being here on ur blog..
    by the way i am not able to see ur “AGAIN ” of time and again in the header..is that my browsers problem or problem with ur theme..

  2. @Cat

    Yes, it is really nice! I do want to ‘clean’ up the theme before using it though. I don’t like the body background too much. I’ll try to find something else on the internet.

    Do you know about any other CSS designer? I know that sunburntkamel makes some skins too.

    @Arvind

    Thanks Arvind 🙂 I checked my header after seeing your comment in three browsers (Flock, Firefox and IE6). I can see no problem whatsoever…let’s see if anyone else also has a problem.

  3. first what hit me was,it got a look that will stand close to nature(header image and all)and especially i like that piece of leaf or flower or watever is there at the beginning of post title and widgets…thats cool….and tha background color feature for author’s comment also…

  4. It’s a sweet theme, very clean and fast..just like I like it. Having said and done, I’ll tell you what I think can be improved. Don’t kick me if it’s too difficult to do lol. I’m not a CSS master myself.

    I see you removed the clickable title. Is there anyway you could make the header image go to the home page? I mean the entire image can be a hyperlink. I believe you can do that with simple HTML..depends on how you’ve done your stylesheet actually.

    The Feed icon is fabulous, just center justify it if possible. Shouldn’t be too tough I believe. You can use the align property of the paragraph tag. If I type it here, I think it’ll be stripped.

    The footer is a great idea but ends too quickly and leaves some whitespace at the bottom. I can give you a screenshot if you don’t understand what I mean. This is happening in Firefox btw.

    Just put an empty paragraph tag in all the text widgets so that there is some space between the headings and the underlying text. I hope you understand what I mean.

    Green dashboard bar is cool, don’t remove it. It’s very useful..atleast I click that all the time to get to my dashboard.

    Having said all that, it’s a very healthy feeling here thanks to all the greenery. You can always keep tweaking the CSS, that’s how you gain the confidence. Damn I need the CSS upgrade too, wish I had the money. 😛

  5. @ rohanmanoharlovetobe:

    thanks a lot rohan! I am still a little skeptical about the leafy look though. I might remove it and put a black and white header.

    @ish

    I always appreciate your feedback because you’re honest 🙂 I have centered the feed button and put some space before it. This didn’t even occur to me! Duh!

    Footer- Actually the html usage in the style sheet is pretty limited. There should be a way to make it start from the end of the screen and remove the white space completely, but frankly speaking, I really like this “strip” look. So, I’m going to leave it like that.

    Header- I have to remove the blog title and description class from the style sheet because it was not going very well with the rest of the skin. I don’t know how to make the header image link back to the main page and have asked this question in the forum. Hopefully, someone will be able to help!

    I really like my Green navbar too 😛 I was in two minds regarding the upgrade. But I think this will really keep me blogging for another year!! There are so many things that we can do. You really need to ask your parents to give you $15 as a belated birthday gift. It’s not too late. What say? Will they fall for it?

  6. Yep, that was my mistake. I don’t think there’s a way you can make the header clickable without having an access to the main system files. Actually I’d done that somewhere and was thinking it would work here but I forgot this is an attached stylesheet. My bad. But maybe some CSS person will know how to do it in the forums. I tried editing your CSS for half an hour but it was refusing to work out. Dumb me lol.

    Anyhow, even if I do ask my parents for the $15, how am I gonna pay for the upgrade? I don’t have an account or a credit card and I can’t tell them because I don’t want them to know about the blog.

  7. Btw, if you’re trying to use that archGfx tip from the forums, I believe that’ll give you a clickable text so basically I think you’ll have to remove all that you’re written on the image and have a link in stylish text. Right now it’s showing the upper part of “Time and Again”

  8. @ ish:

    Anyhow, even if I do ask my parents for the $15, how am I gonna pay for the upgrade? I don’t have an account or a credit card and I can’t tell them because I don’t want them to know about the blog.

    Can’t you make a dummy blog and show it to your parents? Then ask them for money? You can use their credit card and in case they don’t use one, then you can ask one of your friends to use his/her card and pay him/her in cash. No?

    I am trying to do that forum stuff, but it’s not working. In fact, I doubted that it would work at all. What you saw-the white time and again font-i was trying to do something. I can make the white space below the image point to my main page…but it doesn’t make sense.

    so basically I think you’ll have to remove all that you’re written on the image and have a link in stylish text.

    It didn’t work with my theme at all!

    Btw, thanks so much for working on my CSS for 30 mins. 🙂 You’re making me feel like a jack ass. I need to do something nice for you.

  9. Lol, no need to do something nice for me, and it was not you being a jack ass, I was lol. But I’ll try to see that archGFX thing again..I’m still thinking it should work. I will e-mail you about it sometime because any coding put here will be stripped.

    Everything’s looking cool now btw.

  10. @ ish:

    Check out my reply in the forum! So this thing does work. But there is a lot of white space above the image (Around 200px) after I removed the image from the body background tag (where it was originally) and used the code provided in the forum. Any idea how can shift it up? I also had to change the height and width specifications.

  11. @Ankur

    Apparently 🙂 Else this feature wouldn’t have been there. Next on my list is the domain mapping thing. I already have it for another blog.

    @Arvind

    I know there are always browser compatibility issues. Which browser and OS are you using?

  12. Wow, the blog is looking good Ruhi. I personally need 3 columns and I feel it can really give space for so many things. I like the way you have customized yoru favorite theme so you can have this feature. I always wanted to upgrade but basically do not have the guts to because of my poor tech ability. However I know one of these days I will do it, when I have more time so I can learn CSS. I am experimenting with html these days.

  13. @ madhubalan:

    Thanks and welcome to my blog 🙂 keep visiting!

    @Arvind

    Hmm…I’ll try to run a check and see what’s happening here. Thanks for letting me know. 🙂

    @Nita

    Thank you 🙂 You do have lots of information in your sidebars and a good, spacious theme should do your content a lot of good. You might find it encouraging to know that I’ve hardly ever worked on CSS myself. In fact, I just “managed” to get this look together because of some tech knowledge. The forum people are really helpful. Like I mentioned, there are some free themes that you can use, if you want. I used a free theme as my base and tweaked it a hell LOT. There is hardly any similarity left between the two, as you can see. But it did give me the basic code to use.

  14. Check out the ‘customcss’ tag both in the tagsurfer and the .com forums. I know a guy called inrepair or nrepair and devblog did some as well.

    And there’s a thread in the Offtopic forum on .com called ‘Show off your custom CSS’.

    Hth. 🙂

  15. Looks good, and expecting more from you here 🙂 again, I am lazy to learn css to, I keep editing the stuff on my blog, but I seldom try to learn something on css.. hihhi good job Ruhi 🙂

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