I am new to CS-Cart. I am trying to figure out the best practice for modifying the css of my site.
I assume whatever system I use will need to withstand theme upgrades and version upgrades.
Can someone tell me how I go about editing my CSS files and or creating overrides to existing css files.
I tried using the THEMES>CUSTOMIZE THEME>CUSTOM CSS in the editor but it's acting strange. If I edit an existing css say for the background image of the theme and place the code in the window, when I hit save it makes the change to the site but when I go back into the window, the css is missing.
If I use firebug inspector it tells me the css has been updated and it resides at some standalone.97876960960kg5…location.
So it seems when I create the override of the existing css using this system, it changes a file someplace but I don't know where. Whats worse is I cant even edit the change as it dissapears from the editor window.
Can someone shed some light on this?
Thanks,
iso
At the minimum if someone can let me know why firebug keeps telling me my css resides at a location I cant find, that will help me understand where the css for the THEME resides.
Lets say I want to change the padding around the search box. I use firebug and it tells me the stylesheet is at
standalone.9839458t87348t48h4378ht34t483jf38jf34jt4ud
I know that CS-Cart must be using some sort of system I am not familiar with, otherwise it would give me the path of the stylesheet like other platforms, wordpress, joomla, etc
I would expect it to be in my themes folder under CSS, but none of those stylesheets contain the css I am looking for.
Thanks,
iso
[quote name='isonychia' timestamp='1402517761' post='185540']
I am new to CS-Cart. I am trying to figure out the best practice for modifying the css of my site.
I assume whatever system I use will need to withstand theme upgrades and version upgrades.
Can someone tell me how I go about editing my CSS files and or creating overrides to existing css files.
I tried using the THEMES>CUSTOMIZE THEME>CUSTOM CSS in the editor but it's acting strange. If I edit an existing css say for the background image of the theme and place the code in the window, when I hit save it makes the change to the site but when I go back into the window, the css is missing.
If I use firebug inspector it tells me the css has been updated and it resides at some standalone.97876960960kg5…location.
So it seems when I create the override of the existing css using this system, it changes a file someplace but I don't know where. Whats worse is I cant even edit the change as it dissapears from the editor window.
Can someone shed some light on this?
Thanks,
iso
[/quote]
standalone.97876960960kg5… is file in cache which contains all styles from different files. Do not modify it. If you clear the cache, the file with new name will be generated and your changes will be lost.
The best way to add custom styles is:
- Create the
design/themes/YOUR_THEME/templates/addons/my_changes/hooks/index/styles.post.tpl
file with the following content:
{style src="addons/my_changes/styles.css"}
2. Create the following file and put all your custom CSS to it
design/themes/YOUR_THEME/css/addons/my_changes/styles.less file
3. Make sure that the My changes addon in installed and activated
4. Clear the cache and check the result
Thanks.
I followed the 4 steps and created the styles.less file and added some custom css inside that file but it is not working.
I activated the my changes add on and cleared the cache by going to www.mydomain.com/admin.php?cc
Is there another way I should clear the cache? I also cleared the cache of my browser and the changes do not take.
Am i adding the custom css to the “styles.less” file? Shouldn't the file with my custom css have a .css extension?
iso
Ok, i think i was supposed to create a style.css file and put my custom css in that INSTEAD of inside the style.less file.
Is that correct?
So what is the style.less file for?
Thanks,
iso