Blog Documentation Book a Demo
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.

Theming Vanilla 2

gentoo7gentoo7
edited August 2009 in Vanilla 2.0 - 2.8
If I wanted to change the header of Vanilla, for example add a banner to the header or maybe even to the sidebar, what file can I edit to achieve this? I am sort of confused as how themes are built in Vanilla. My knowledge of php is very limited and I handle html and css fairly well.

Comments

  • gentoo7gentoo7
    bump*
  • golampogolampo
    edited August 2009
    In the Quick Guide to Theming Mark says:

    Master Views: These represent everything that wraps the main content of every page. If all you want to do is add a menu or banner above Vanilla, this is the only file you will need to alter. To do so, copy the default master view from /applications/garden/views/default.master.tpl to /themes/your_theme_name/views/default.master.tpl and edit it there.

    So, it's possible to change by editing the file '/applications/garden/views/default.master.tpl', but the proper way is to create a new theme and override the file.
  • mclovinmclovin New
    Anyone else thinks that theming is a lot more difficult than it should have been in Vanilla 2?
    I have seen lots of people use Vanilla forums, but very few have taken the time to drastically redesign the UI.

    I understand the Vanilla 2 is built on top of Garden, but that shouldn't be adding extra complexity to the theme developer.
  • gentoo7gentoo7
    @golampo thanks a lot for the info! It completely helped out.

    @mclovin I agree! i had to edit 6 different style-sheets to have a consistent look through out the forum. It feels extremely redundant.
  • XBleedXBleed
    @gentoo7 -- I'm working on a reset theme that will prevent that.. The painful part is that you have to alter some core appcontroller files to get it to work correctly..
  • gentoo7gentoo7
    @XBleed thanks a lot man and you are right!
  • mclovinmclovin New
    @gantoo7 any plan to open source your theme?
  • XBleedXBleed
    I plan on releasing it, yes. I'm working on my own fork of Garden right now to make the theming to my own personal liking, which I feel makes it much simpler to work with. Hopefully @Mark will find my alterations more beneficial and add them to core, we will have to see on that one.

    My reset theme is nothing more than CSS cleanup (right now, I have replicated close to 50% of the default theme with just around 50 lines of css), some minor markup tweaks to fit my preferences (the site heading h1 tag being moved out of the menu division, and the removal of some unnecessary divs), and some stronger cross-browser compatibility.. The overall goal of the reset is to be a very simple base to make it much easier for themes to be developed from scratch.
  • ToddTodd Vanilla Staff
    @XBleed Is your stuff on github now? Can we have a look while you are developing it.
  • XBleedXBleed
    @Todd -- I do, but I'm having some troubles with it. It's only allowing me to edit files.. sometimes.. So it's taking me a while longer than I wanted it to. Maybe I'm not doing something right?

    http://github.com/XBleed/Garden/tree/master
  • mclovinmclovin New
    @XBleed, any idea how I can change the color of the dropdown menu? I mean which file exactly?
  • XBleedXBleed
    @Todd -- Sorry, but I'm totally having a hard time with this Git stuff. I just read into it, and it's a lot more complex than I thought it was (didn't realize it was a terminal thing, I thought it was just github?). I guess I have a lot more reading to do before I can do this through git.. :/

    @mclovin -- Currently, the #Menu styles are set in several css files. What you'll want to do is create a theme under yoursitedirectory/themes. Copy and paste the 'default' theme folder that is there now, and rename it to whatever you want to call it. Let's say, for example, you name it 'my_theme'. Now open my_theme/about.php and edit the $ThemeInfo array (change 'Default' to the name of your theme). Now you should be able to activate the theme via the dashboard. By default, it will load theme files via applications/garden, so you'll want to copy over whatever files you want to alter. If you just want to change the menu dropdown colors, you'll have to copy over: activity.css, garden.css, and profile.css from applications/garden/design to themes/my_theme/design. You'll also want to copy vanilla.css (from applications/vanilla/design), and conversations.css (from applications/conversations/design) Each one of those css files specifies the #Menu ul background over and over again.

    It's very redundant for now, but if I can get this git thing figured out, and if @Mark / @Todd / whoever else approves of my new setup, you'd only have to copy / edit it once.
  • mclovinmclovin New
    @XBleed Thanks so much. Exactly what I needed. Didn't realize div.Menu was so all over.
  • raykrayk New
    @XBleed , looking forward to what you come up with!
Sign In or Register to comment.