Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

Question about creating custom.css

I've been editing the main style.css of the default theme. Now I've realised I should have created a custom.css. Can I just check a few basic things before continuing?

!) Does custom.css just go in the same directory as the style.css, ie applications/dashboard/design/ ? Does anything else need to be done to activate custom.css or does it override bits of the css from style.css automatically?

2) Can I just find where I have altered style.css and paste those bits into the new custom.css and then replace style.css with a new unaltered one?

Still getting my head round Vanilla so please excuse if this is very basic. Thanks.

Best Answer

Answers

  • peregrineperegrine MVP
    edited September 2013

    this may help too.

    http://vanillaforums.org/discussion/comment/192059/#Comment_192059

    and another example

    http://vanillaforums.org/discussion/comment/191672/#Comment_191672

    by creating your own custom theme and leaving

    applications/dashboard/design/ folder intact and unchanged

    You will be ahead of the game because when you upgrade your changes won;t be overwritten and you can always go back to a pristine default theme in the event of trouble.

    I would suggest restoring the files in applications/dashboard/design/ to their original shape. (you can download core and unzip on a local pc and copy the "prisitine style.css" to your server so it it original.

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • Thank you both, that seems pretty clear. I was confused into thinking I didn't need to create my own theme. But now I see how to do it I realise a theme can be something as basic as just changing, say, the font.

    I haven't made many changes to style.css and I think I can remember what they were, but I've never heard of diffing before. I am on Windows 7, it would be interesting to look in to that.

  • there is probably some file compare. you could also download some some unix like utilities that run on windows.

    https://www.google.com/search?client=ubuntu&channel=fs&q=gnu+unix+utilities+for+windows&ie=utf-8&oe=utf-8

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • Diffing is the process of finding the differencing in files via a program. The original, AFAIK, was a Unix utility called diff.

    I highly recommend WinMerge (http://winmerge.org/) for diffing/merging files on windows. You can run a full folder compare of your current install against a fresh copy to see exactly what you modified an in which files.

    Search first

    Check out the Documentation! We are always looking for new content and pull requests.

    Click on insightful, awesome, and funny reactions to thank community volunteers for their valuable posts.

  • So in themes/my_theme_name/design there should only be my custom.css and the favicon? Is that right?

    Or do I need to also copy over style.css and vanilla.css, which is the impression I get from the README.txt in themes/default

  • peregrineperegrine MVP
    edited September 2013

    if you read my links above, it should explain. The pamela link is copying everything. The avantmike is just copying and editing about.php. both techniques will work. The pamela way is better. You can create your own favicon and replace it.

    theoretically all you need is a correct about.php.

    Anything you add themehooks, custom.css, favicons, etc. will override the default theme.
    No you don't need to copy style.css or vanilla.css.

    ignore the README.txt in themes/default

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • Great thanks. That's what I thought from reading your Pamela post and hgtonight, but that README.txt file had me confused.

    Very helpful forum this.

  • peregrineperegrine MVP
    edited September 2013

    awesome. the README.txt you should have been updated on every core release. :).

    alas!

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • One further thing. Instead of creating a custom.css, could I just place my altered style.css in themes/my_theme_name/design and put a new unaltered style.css in applications/dashboard/design/ ?

    Would that have the same effect as a custom.css, the altered style.css in my theme overriding the original?

  • Would that have the same effect as a custom.css, the altered style.css in my theme overriding the original?

    try it. probably will.

    But, the idea is just to have a custom.css with just the changes needed. So you KNOW exactly what you changed (which you don't currently know:) that overrides the original style.css. That way it is easier to not run into mysterious complications and to debug.

    just find the differences as pointed out above, you will be happier in the long run.

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • Yes, I agree and will make a custom.css, much neater. I was just curious whether it could be done the cheap and nasty way too as I've already messed around with style.css.

  • @sudden156 there are several tutorials covering the issue .

    I was just curious whether it could be done the cheap and nasty way too as I've already messed around with style.css.

    No that is as nasty as it can get because it can render any other theme you wish to try , useless. It creates more work and causes problems. Then you can also lose all your changes. You risk editing the wrong file.
    Basically you make more work for yourself in the long run.

    http://vanillaforums.org/discussion/24813/how-to-go-about-editing-the-default-theme

    Also I recommend trying out several themes so you can learn how they are put together and emulate them.

  • when in question. try it. you can always undo it.

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

Sign In or Register to comment.