Support Forum

Please note that this forum is only available to you in read only mode. In order to contribute to this conversation you will need to renew your subscription.

CSS and Theme Magic and "local" files - how do these fit together?

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

I've been trying to style my site (uuwinnipeg.mb.ca/beta -- if it's not there, I might have moved it to the URL without the 'beta' part).

I've used ThemeMagic, and the preview looks fine, and I save it, but sometimes it doesn't "stick" or show up on the site (even though, when I go back into TM I see my changes). Just now, I was trying to change the background colour of the drop-down menu from dark purple to white, and in the preview it was fine, but it's not "on" the site. I cleared my browser cache and Ctrl-F5 reloaded, and still no change.

A related issue is a manual CSS change I did for the top small menu, I changed the colour to dark purple from grey. Initially I did this in css/themes/pink/template.css, and it worked, but then it went back to grey. When I checked with Firebug, the property was in a different CSS file: local/css/themes/pink/template.css.

What is this "local" directory and how does it integrate with the ThemeMagic?

It might be worth noting that I briefly turned on LESS (and might have clicked the "compile to CSS" button) even though I'm not clear on what it does, and then turned it off again. :unsure:

Thanks!
  • Karin Carlson's Avatar
  • Karin Carlson
  • 12 Month basic
  • 27 posts
  • Karma: 0
The administrator has disabled public write access.
Are you compiling LESS to CSS after saving and closing from Theme magic?

Also if you change styling in the core template files on template update or being compiled will see those changes lost

You need to work in the custom.css file when changing template css by overriding it

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
This thread may be useful regarding custom css

www.joomlabamboo.com/index.php?option=com_kunena&view=topic&catid=661&id=110521&Itemid=215
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
I saw the custom.css file (empty as it is) and wondered if that is what it's for. I'll do that for my own, personal fixes, thanks.

It still doesn't explain why the ThemeMagic is being intermittent. I'll just write new styling code and stick it in custom, I guess. It seems that all the bits and pieces start arguing so writing the css I want to shush all the other instructions might be the best way.

Thanks for all your help!
  • Karin Carlson's Avatar
  • Karin Carlson
  • 12 Month basic
  • 27 posts
  • Karma: 0
Last Edit: 9 years 8 months ago by Karin Carlson.
The administrator has disabled public write access.
"Are you compiling LESS to CSS after saving and closing from Theme magic?"

I guess I'm supposed to be doing this? No, I haven't been -- I figured if I had that setting/slider to the off position, I wasn't using LESS. So I guess I don't understand how that works. I'm inferring here that the ThemeMagic saves to the LESS files (?) and compiling them saves the changes to the "live" CSS / front end files.
  • Karin Carlson's Avatar
  • Karin Carlson
  • 12 Month basic
  • 27 posts
  • Karma: 0
The administrator has disabled public write access.
For any change via theme magic is has to be compiled LESS to CSS

I think this article could be useful

www.joomlabamboo.com/blog/how-to-joomla/editing-t3-templates-using-custom-less

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
Yes, that was useful, thanks. (For the record, I know I've been posting a lot lately. :blush: I am doing searches on the forum first to see if my topic is already there, but have been pretty hit-and-miss. I think with the simple search tool in place right now, e.g., can't specify a phrase, only one word at a time, I'm coming up with 100 hits that include the splash pages for each template etc., and the best results are waaaay down in the list... Digressing, sorry.)

The article had a couple of areas I found unclear.

1 - "The code is compiled with the core LESS files to minimise [sic] browser requests. The custom.css file wont load." Does that mean that if I use LESS I can't also use the custom.css file?

2 - "All new and existing variables should be added to the /less/themes/your_theme/variables.less file." I think this means that if I "hand code" my variables (@primary for example), this is the file to do it in. Specifically, this file inside of my new/differently-named theme folder (to protect my changes when updating my template).

3 - To confirm: Whether I hand-code inside the variables.less file and/or use ThemeMagic, either way, I need to click the compile button for those changes to be written to the theme's CSS files. (right? this seemed to work so I think I understand.)

4 - Question: Do I need to set my template to development mode? Is there an advantage to doing this?

5 - Question: Do I need to set the General Setting "build RTS CSS" to on?

Thanks!!!
  • Karin Carlson's Avatar
  • Karin Carlson
  • 12 Month basic
  • 27 posts
  • Karma: 0
The administrator has disabled public write access.
Hi

Using LESS development mode is only intended for development as its resource intensive on a live site - it also breaks the site on old versions of IE

With the custom file to be picked up by the template it needs to be named custom.css

Development mode is for more advanced users who prefer to work that work or for folks to troubleshoot less - its not required and most users don't use development mode

"RTS" do you mean "RTL" as this is for different languages which go right to left so in most cases its not used

Yes - You will need to compile LESS or theme magic changes

Regarding hand coding variables its as described in the doc - I must admit myself I use just the custom css file to add styling or override

Cheers
Paul
  • manh's Avatar
  • manh
  • Moderator
  • 45248 posts
  • 2106 Thanks
  • Karma: 603
The administrator has disabled public write access.
The following user(s) said Thank You: Karin Carlson

zentoolsIf you use Zentools please post a review at the Joomla! Extensions Directory.

Happy Campers