jQuery - Spiffing up your page where you can't edit the HTML!

[Hall of Famer]

Anyway its a nice tutorial, good job Kyttias. I tried to design the GUI components/containers in a way that all of them have ids to manipulate. If you know how to use javascript, just get them by id and edit to whatever you like.

[Kyttias]

Thanks~

The sole advantage to doing it my way is having it contained all inside your template folder, without modifying the framework. In case you want to change stuff, it's all in one file. (And yeahhhh your code is super intimidating, but thanks for your post, I understand it a little better! <3 I had found the setClass before and was able to set it.)

I'm not sure how I can get Javascript/jQuery to interact directly with PHP variables in any other way than what I'm doing now. So, what I've got may still be the easiest method for template theme builders to understand? A lot of your stuff does come with set ids and classes, or it's pretty easy to add them in like your post explained. But it became worrisome when I wanted to add classes to children in the menu, and they didn't come with a set id to manipulate (and why would it, ids can only be used once per page, and for that matter, there's no way you can predict when someone wants or needs a class on something), so I had to pin point the exact part of the list I wanted to modify, and add a class to it. The button was a bad example, ahaha...

It'll be a lot easier to pop in a new theme template to see if I like it if I don't have to modify the deep source. It could become a real hassle after a while, needing to back up files, needing to remember and note all personal edits that aren't related to the theme...

My largest reason for using jQuery is so I can change, remove or add classes dynamically. I can set and remove classes with your GUI, but what if I need to add one only while doing something crazy, like:

I only want an element to be visible if the page is smaller than 480 pixels? I would make it visible by adding a css class that set it's visibility. That element would be a div or a picture that says 'surprise' and only while being moused over, a div acting as a tooltip pops up with a promo code, because a class was added to this div that made it visible? (Or worse, you don't want it to appear on a page resize, but only a certain time of day.) --I will write up these snippets as I would do them if I were using jQuery later today as soon as I wake up.--

In comparison, my "I want my button to be blue" looks pretty lame, I know. There are lots of ways of doing just that, so it was a pretty tiny example. I'll try and make more complicated snippets in the future so people can use them!

If you can do my new example somewhere in your GUI, that'd probably be better than including it with the template files. (Because that promo code would only appear when that theme was active.......... unless, that's exactly what the website owner wants to happen, and they utilize multiple layouts as a standard feature!) If I wanted this code to be available via jQuery in any layout, I'd probably want to save the file someplace all themes could have access it (not hard, it just has to be separate than the template files).

At some point, I don't know if there's a quick alternative to jQuery's bigger functions without reinventing the wheel. But if you can automate it so users don't have to go through so much copy-pasting of code someday, that'd be spiffy. For now, I think I'll keep on using jQuery rather than touching your deep code, just in case I mess something up. I'm familiar with jQuery and there's an advantage to writing tutorials and snippets, right?