Just from looking at all the views you cloned, I can see why you would have an issue.. You do not need to clone all of the views and modules and files to go with it. That is like rebuilding the framework just to style it and it is overkill of the highest degree.
The proper way to style for Vanilla is to get you style going by only using the default.master.php as the template.
Th only files you need in a theme, are the default.master.php or tpl whatever you prefer, and the design folder with the custom.css and the images folder.
You might get away with adding a module folder for some modules but that is all you would need to do. Maybe possibly add a js folder with some js you may want. But that is it.
The way you approached this, is not the correct way and you are making it difficult for yourself.
If I dont go in and edit the views, which most of those are just copied and havent went through and deleted the ones I wont need, than most of the HTML wont change to fit the theme I'm going for as well as call any of my classes. Sorry im not trying to go for some base theme like we find on here but something more detailed and responsive.
So if going through and editing the html as well = not correct than there is 0 reason for almost anyone to use this software and go with the cloud one which apparently can be edited in almost any way you wish and 'easily.' Though in all seriousness if the only way to 'correctly' customize your vanillia stylings is to literally use the same ID's and modify them some than I wasted more time working on the html template than I have trying to theme vanilla towards that template.
Sorry im not trying to go for some base theme like we find on here but something more detailed and responsive.
I'm sorry to break it to you but my themes are not base, and neither are Kasper's themes or any pf the folks that put in weeks of work into their themes. I speak for myself that all my themes are responsive. And that I can make any vanilla forum look any way I want to without having to clone the views .
The idea of how this software works is to simplify the structure to allow for css editing any way you want.
Look At the Bootstrap theme from Kasper or any of his themes and theme creator themes and get an idea of how it's done. That is the most complex you can get to style a theme the right way.
I suggest respectfully that you study how it is built and emulate what he did.
here is 0 reason for almost anyone to use this software
Just because your approach failed it does not mean you can't do it. Speak for yourself not almost anyone, because the truth is that almost anyone can style vanilla any way they want with simplicity and don't need to know a whole lot of code to do it.
Try try again after you gain some insight from studying complex themes like Bootstrap.
I wasted more time
Time is only wasted when you learned nothing from the time spent...
So what you are saying is, as per the documentation, you cant upload your own CSS (ID/Class Names etc) as a custom.css which is where it tells you to put you CSS with the edited views and it work? Cause that is literally my problem. Either it doesnt load the css period or it only loads a small portion of it ALA
As for other themes thats all I did for just about a month before I even started working on my template was download various ones and go through them piecemeal with the documentation open on another monitor or a tablet.
Literally, yet again It seems my main issue ATM is the CSS not loading. For some reason it isnt evne loading the Font Awesome fonts which is fantastic. Now just for the posterity of this the exact same custom.css file on the original template
Sorry, but this reminds me of the story about the driver lost in Ireland, who stops an old farmer.
'Excuse me, could you tell me how to get to Cork?'
The old man pauses, then replies, 'Well, I wouldn't start from here.'
You appear to have gone completely the wrong way about modifiying a Vanilla installation, and now seem to want to blame Vanilla for not working how you think it should.
Your assumptions about what Vanilla can or can't do, and how, are just wrong.
If you want to contiunue to tell us how wrong Vanilla have got it, there's not much we can do to help you.
If you want to know how things should be done (and most changes can be made very easily) then why not pick one particular thing you want to change, and state that here.
Then someone can explain how they would go about it, rather than trying to get your way to work.
@Bleistivt said:
Another note: Changing CSS classes in views will make your forum incompatible with its own javascript, plugins and future updates. Never do this.
Awesome.... Just awesome. @whu606 Want me to state where it went wrong. There. Right there. That should be in the Documentation that is very limited and pretty much non existent. Which I honestly don't get.
So In other words I cant change classes but I can edit the HTML? Makes no sense as well. IF the open source is limited in this sense, and if you guys say it isnt even with this you're nutters, than there is 0 reason for anyone above a learner to go with this software because your customization can only go so far. Using the current styles will limit what I have going on in my page so much it wont look right.
Thanks for everyone's help. Also. My process wasn't wrong. I literally did the steps in order -> Copied the CSS -> Copied a the views I needed to change to match my HTML/Site-> Edited the Views to match my HTML and CSS Markups which was literally just changing the HTML portions and removing what PHP I didnt 'need' IE like the options area on one specific category. Than nothing. All because the classes didnt match some JS code?? Come on, thats ridiculous. If someone knew what JS Was limiting that I'd go fix it cause from this point on I wont deal with it. When I get to work I will also be fighting to remove vanilla from our work flow for something more suitable for the environment. Now I understand why people in pretty much every corner of the web I've seen Vanilla being used complains about it. It isnt anything you guys did, just the limited scope of view the designers have.
Sorry, but you don't know what you are talking about when it comes to Vanilla, and will be giving poor information to your employers based on your own lack of understanding, but that's their look-out.
You seem far more interested in making a point than in making progress.
To clarify, I have no affiliation with Vanilla.
I'm an independent user of the open source software they provide.
The difference between us is that whenever I have found something I can't do in Vanilla, I've come on here and asked, assuming it was me that didn't get it, and pretty much every time, someone has shown me how to do what I need.
That's why I have stayed on the forum, and try to help others when they need it.
As a result, I have a forum set up exactly how I want it to be, including custom Div IDs with matching CSS rules, and added code snippets.
I do (and I'm no expert); you don't, but you feel you are competent to warn off others about using Vanilla.
If my employers cant get something looking professional they wont touch it which is what Vanilla OS is thus far.
@vrijvlinder
So again I would have to go into the custom.css / style.css in the theme folder (Not the core ones.......) and use what they supply and go adding to that with jquery? Seems more work than needed. As for what I am doing its not a cop out. The way the documentation reads when you upload you custom.css the System will load that into the pages. So any classes on those pages will load from that CSS which isnt what happens. You Load the css and if the classes match some 'hard coded' system it will load them if not oh well to sad jack. If it wasnt than what I did earlier would be fine. Kind of like any other Forum software I've worked with. Seriously. You go in upload the css and any tag in any html file in that system will be laoded from that tag. IE totallyawesometag is in the main CSS file so any other totallyawesometag found in the html will be loaded as such. Its how CSS works, how HTML works. It doesnt do its own thing to change the way they are done.
INB4 Thats now how comments.
Seriously?! Dude a few comments above literally stated that it will have issues with the JS in the system. Literally stated it. It cant be any clearer than that.
It is only one sentence no work at all. You can also use plugins for that.
So any classes on those pages will load from that CSS which isnt what happens.
It loads the style sheets for anything you have enabled and gives priority to files named custom.css customadmin.css etc. the only style sheets that would supersede this would be plugin style sheets. So I would recommend going the plugin way. Because that is what Vanilla is all about. It is about extensibility . Being able to extend the framework with the use of plugins.
Dude a few comments above literally stated that it will have issues with the JS in the system.
That dude is a very knowledgeable and his name is Bleitvst , and it makes total sense because we develop plugins and themes to work with the framework. That means using classes that exist or hooking into events and functions that exist.
I will give you an example of what happened to me. I made a plugin called Index. It is a simple plugin that adds a drop down where you can add any links you want.
It worked perfectly with any theme using the default vanilla classes, but not with themes like Bootstrap and bittersweet because they use different class names and or ID. Since the plugin works by CSS alone, I had to write the css for my plugin to be compatible with those themes and include them in the style sheet for the plugin. Then my plugin worked for those themes.
You can totally do what you want to achieve by the pics you showed with the result on pages that worked, but your approach is not the best considering it half way works. And that you are shooting yourself in the foot if you consider using plugins that rely on the Vanilla Library.
Which is not to say you can't add your own Library with edited stuff and call it on your theme. You can. But that would be called forking the framework and you would basically have a one of a kind Vanilla forum which there is no support for except by you.
Really, wow. Your arrogance is extraordinary, not least because, from what I can see, you have nothing to be arrogant about.
If your employers can't get Vanilla looking 'professional' (whatever that means to you) they aren't using the wrong software, they are using the wrong staff, which clearly includes you.
There is obviously no point in commenting further, as you clearly have no interest in learning how to actually use Vanilla properly.
I've pointed out a couple of times, and given you a link to prove it, where I have added custom Div IDs and CSS rules, but you still insist that it isn't possible.
If you manage to get over yourself, have a look through some of the forum threads, and see how many people get the help they ask for, or look at some of the highly professional open source Vanilla sites, and then wonder how they all managed to do something you can't do.
Your bad-mouthing of Vanilla will have no personal impact on me, but it is just a bit tiresome to see know-nothings talking bollocks.
You have a few issues with your master template. You need to include the head asset as well as the foot asset. Without the head asset, Vanilla can't load your (or any plugins') resources automatically (like JS and CSS). The foot asset is needed/used for JS definitions used by the framework.
You should also add the body class/id to the body element. This should be the only class you "need" to have to make the framework JS work. Some (many) plugins assume standard markup, but that is generally an easy fix (change a selector or two).
It also looks like you are stubbing out your panel with some fake modules. If you plan on creating "live" modules, I suggest adding the panel asset back in.
@Kreios using view overrides to introduce you own classes to an existing framework simply to add css rule is the wrong approach.
If you want to style any framework, don't take this approach.
Use that selector that are available and style them using specificity. You should only ever add selector where absolutely have to and certain don't remove anything you don't know what it may be used for.
It is really that simple.
Otherwise you are creating something difficult to update an maintain, if it doesn't break thing already.
Even with the buzz around boostrap, which if used incorrectly encourages this sort of thing, you should instead through LESS/SASS, etc merge the boostrap selector rules into the native ones.
Comments
Alrighty, I started back from scratch so im missing alot of the views but here is the theme thus far on this attempt codypresley.com/van/adonis.7z
Just from looking at all the views you cloned, I can see why you would have an issue.. You do not need to clone all of the views and modules and files to go with it. That is like rebuilding the framework just to style it and it is overkill of the highest degree.
The proper way to style for Vanilla is to get you style going by only using the default.master.php as the template.
Th only files you need in a theme, are the default.master.php or tpl whatever you prefer, and the design folder with the custom.css and the images folder.
You might get away with adding a module folder for some modules but that is all you would need to do. Maybe possibly add a js folder with some js you may want. But that is it.
The way you approached this, is not the correct way and you are making it difficult for yourself.
❌ ✊ ♥. ¸. ••. ¸♥¸. ••. ¸♥ ✊ ❌
If I dont go in and edit the views, which most of those are just copied and havent went through and deleted the ones I wont need, than most of the HTML wont change to fit the theme I'm going for as well as call any of my classes. Sorry im not trying to go for some base theme like we find on here but something more detailed and responsive.
So if going through and editing the html as well = not correct than there is 0 reason for almost anyone to use this software and go with the cloud one which apparently can be edited in almost any way you wish and 'easily.' Though in all seriousness if the only way to 'correctly' customize your vanillia stylings is to literally use the same ID's and modify them some than I wasted more time working on the html template than I have trying to theme vanilla towards that template.
I'm sorry to break it to you but my themes are not base, and neither are Kasper's themes or any pf the folks that put in weeks of work into their themes. I speak for myself that all my themes are responsive. And that I can make any vanilla forum look any way I want to without having to clone the views .
The idea of how this software works is to simplify the structure to allow for css editing any way you want.
Look At the Bootstrap theme from Kasper or any of his themes and theme creator themes and get an idea of how it's done. That is the most complex you can get to style a theme the right way.
I suggest respectfully that you study how it is built and emulate what he did.
Just because your approach failed it does not mean you can't do it. Speak for yourself not almost anyone, because the truth is that almost anyone can style vanilla any way they want with simplicity and don't need to know a whole lot of code to do it.
Try try again after you gain some insight from studying complex themes like Bootstrap.
Time is only wasted when you learned nothing from the time spent...
❌ ✊ ♥. ¸. ••. ¸♥¸. ••. ¸♥ ✊ ❌
So what you are saying is, as per the documentation, you cant upload your own CSS (ID/Class Names etc) as a custom.css which is where it tells you to put you CSS with the edited views and it work? Cause that is literally my problem. Either it doesnt load the css period or it only loads a small portion of it ALA
As for other themes thats all I did for just about a month before I even started working on my template was download various ones and go through them piecemeal with the documentation open on another monitor or a tablet.
Literally, yet again It seems my main issue ATM is the CSS not loading. For some reason it isnt evne loading the Font Awesome fonts which is fantastic. Now just for the posterity of this the exact same custom.css file on the original template
@Kreios
Sorry, but this reminds me of the story about the driver lost in Ireland, who stops an old farmer.
'Excuse me, could you tell me how to get to Cork?'
The old man pauses, then replies, 'Well, I wouldn't start from here.'
You appear to have gone completely the wrong way about modifiying a Vanilla installation, and now seem to want to blame Vanilla for not working how you think it should.
Your assumptions about what Vanilla can or can't do, and how, are just wrong.
If you want to contiunue to tell us how wrong Vanilla have got it, there's not much we can do to help you.
If you want to know how things should be done (and most changes can be made very easily) then why not pick one particular thing you want to change, and state that here.
Then someone can explain how they would go about it, rather than trying to get your way to work.
Just noticed you have a default.master called backup in your folder.
The very first time I tried to modify Vanilla I did that and I couldn't work out why the changes to default.master weren't taking: http://vanillaforums.org/discussion/17780/solved-cant-edit-my-themes-default-master#latest
Try moving it out of that folder.
Another note: Changing CSS classes in views will make your forum incompatible with its own javascript, plugins and future updates. Never do this.
My themes: pure | minusbaseline - My plugins: CSSedit | HTMLedit | InfiniteScroll | BirthdayModule | [all] - PM me about customizations
VanillaSkins.com - Plugins, Themes and Graphics for Vanillaforums OS
Awesome.... Just awesome. @whu606 Want me to state where it went wrong. There. Right there. That should be in the Documentation that is very limited and pretty much non existent. Which I honestly don't get.
So In other words I cant change classes but I can edit the HTML? Makes no sense as well. IF the open source is limited in this sense, and if you guys say it isnt even with this you're nutters, than there is 0 reason for anyone above a learner to go with this software because your customization can only go so far. Using the current styles will limit what I have going on in my page so much it wont look right.
Thanks for everyone's help. Also. My process wasn't wrong. I literally did the steps in order -> Copied the CSS -> Copied a the views I needed to change to match my HTML/Site-> Edited the Views to match my HTML and CSS Markups which was literally just changing the HTML portions and removing what PHP I didnt 'need' IE like the options area on one specific category. Than nothing. All because the classes didnt match some JS code?? Come on, thats ridiculous. If someone knew what JS Was limiting that I'd go fix it cause from this point on I wont deal with it. When I get to work I will also be fighting to remove vanilla from our work flow for something more suitable for the environment. Now I understand why people in pretty much every corner of the web I've seen Vanilla being used complains about it. It isnt anything you guys did, just the limited scope of view the designers have.
@Kreios
Sorry, but you don't know what you are talking about when it comes to Vanilla, and will be giving poor information to your employers based on your own lack of understanding, but that's their look-out.
You seem far more interested in making a point than in making progress.
To clarify, I have no affiliation with Vanilla.
I'm an independent user of the open source software they provide.
The difference between us is that whenever I have found something I can't do in Vanilla, I've come on here and asked, assuming it was me that didn't get it, and pretty much every time, someone has shown me how to do what I need.
That's why I have stayed on the forum, and try to help others when they need it.
As a result, I have a forum set up exactly how I want it to be, including custom Div IDs with matching CSS rules, and added code snippets.
I do (and I'm no expert); you don't, but you feel you are competent to warn off others about using Vanilla.
How does that work?
You can add a class to the existing classes or ID . For example :
I want to add some css to something but do not want it to affect anything else with that class
body.Discussions #Body.Main{ background:#000; }How do I add extra classes to existing elements with classes ?
https://api.jquery.com/addclass/
This will add your special classes to any element you want, this way you do not make the original classes obsolete.
You have gone about this in the wrong way. There is no need to edit core files to use CSS or to add or remove classes.
You are blaming the instrument for not knowing how to play it. That is simply a cop out...
❌ ✊ ♥. ¸. ••. ¸♥¸. ••. ¸♥ ✊ ❌
Edit Wrong link and info.
@whu606
If my employers cant get something looking professional they wont touch it which is what Vanilla OS is thus far.
@vrijvlinder
So again I would have to go into the custom.css / style.css in the theme folder (Not the core ones.......) and use what they supply and go adding to that with jquery? Seems more work than needed. As for what I am doing its not a cop out. The way the documentation reads when you upload you custom.css the System will load that into the pages. So any classes on those pages will load from that CSS which isnt what happens. You Load the css and if the classes match some 'hard coded' system it will load them if not oh well to sad jack. If it wasnt than what I did earlier would be fine. Kind of like any other Forum software I've worked with. Seriously. You go in upload the css and any tag in any html file in that system will be laoded from that tag. IE totallyawesometag is in the main CSS file so any other totallyawesometag found in the html will be loaded as such. Its how CSS works, how HTML works. It doesnt do its own thing to change the way they are done.
INB4 Thats now how comments.
Seriously?! Dude a few comments above literally stated that it will have issues with the JS in the system. Literally stated it. It cant be any clearer than that.
It is only one sentence no work at all. You can also use plugins for that.
It loads the style sheets for anything you have enabled and gives priority to files named custom.css customadmin.css etc. the only style sheets that would supersede this would be plugin style sheets. So I would recommend going the plugin way. Because that is what Vanilla is all about. It is about extensibility . Being able to extend the framework with the use of plugins.
That dude is a very knowledgeable and his name is Bleitvst , and it makes total sense because we develop plugins and themes to work with the framework. That means using classes that exist or hooking into events and functions that exist.
I will give you an example of what happened to me. I made a plugin called Index. It is a simple plugin that adds a drop down where you can add any links you want.
It worked perfectly with any theme using the default vanilla classes, but not with themes like Bootstrap and bittersweet because they use different class names and or ID. Since the plugin works by CSS alone, I had to write the css for my plugin to be compatible with those themes and include them in the style sheet for the plugin. Then my plugin worked for those themes.
You can totally do what you want to achieve by the pics you showed with the result on pages that worked, but your approach is not the best considering it half way works. And that you are shooting yourself in the foot if you consider using plugins that rely on the Vanilla Library.
Which is not to say you can't add your own Library with edited stuff and call it on your theme. You can. But that would be called forking the framework and you would basically have a one of a kind Vanilla forum which there is no support for except by you.
❌ ✊ ♥. ¸. ••. ¸♥¸. ••. ¸♥ ✊ ❌
@Kreios
Really, wow. Your arrogance is extraordinary, not least because, from what I can see, you have nothing to be arrogant about.
If your employers can't get Vanilla looking 'professional' (whatever that means to you) they aren't using the wrong software, they are using the wrong staff, which clearly includes you.
There is obviously no point in commenting further, as you clearly have no interest in learning how to actually use Vanilla properly.
I've pointed out a couple of times, and given you a link to prove it, where I have added custom Div IDs and CSS rules, but you still insist that it isn't possible.
If you manage to get over yourself, have a look through some of the forum threads, and see how many people get the help they ask for, or look at some of the highly professional open source Vanilla sites, and then wonder how they all managed to do something you can't do.
Your bad-mouthing of Vanilla will have no personal impact on me, but it is just a bit tiresome to see know-nothings talking bollocks.
@Kreios Welcome to the community!
I just took a look at your theme.
You have a few issues with your master template. You need to include the head asset as well as the foot asset. Without the head asset, Vanilla can't load your (or any plugins') resources automatically (like JS and CSS). The foot asset is needed/used for JS definitions used by the framework.
You should also add the body class/id to the body element. This should be the only class you "need" to have to make the framework JS work. Some (many) plugins assume standard markup, but that is generally an easy fix (change a selector or two).
It also looks like you are stubbing out your panel with some fake modules. If you plan on creating "live" modules, I suggest adding the panel asset back in.
For reference, here is the master template file as I would suggest modifying it:
http://pastebin.com/raw.php?i=1Wyn0gRe
I agree with others that changing markup to match your existing theme's selectors is the tail-wagging-the-dog.
That said, do what you need to do.
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.
@Kreios using view overrides to introduce you own classes to an existing framework simply to add css rule is the wrong approach.
If you want to style any framework, don't take this approach.
Use that selector that are available and style them using specificity. You should only ever add selector where absolutely have to and certain don't remove anything you don't know what it may be used for.
It is really that simple.
Otherwise you are creating something difficult to update an maintain, if it doesn't break thing already.
Even with the buzz around boostrap, which if used incorrectly encourages this sort of thing, you should instead through LESS/SASS, etc merge the boostrap selector rules into the native ones.
This is simply a case of good practice.
grep is your friend.