I have created a custom preset in the Helix II template (preset4) and made changes to the template.css file located at templates/shaper_helix_ii/css. My custom preset works and so do the the changes I made to the template.css file. But every time I click the save button in the Template Manager, and whenever I purge the cache, the template.css file and the custom preset css file get overwritten/reset to the original template.css file (which shouldn't exist anymore) and the preset css is overwritten with "preset1.css."
To clarify further, the file "preset4.css" still exists but it's contents are overwritten to be identical to those of "preset1.css" and all my changes are gone. And again, the file "template.css" still exists but all my changes are gone and the contents of the file have reverted back their original state.
This forces me to keep a backup of both template.css and preset4.css and upload them to their appropriate locations whenever I make a change in the Template Manager or purge the cache.
What can I do to avoid this problem?
Archived Forums
Accepted Answer
I figured it out. Although I'm very disappointed that NONE of the Joomshaper team responded in any way.
All css is being automatically generated by the .less files. So if you're having similar issues, or have only worked with straight css in the past this might be helpful information for you.
You can add any css code that you want to the .less files and they'll show up in the auto-generated css files (and not go away or be reset) and be visible on site refresh. Working with .less can do some other cool things too so I'd suggest looking up some information on the subject if you're a .less noob like me.
The lack of clear documentation on almost every subject pertaining to Joomshaper's products is very sad. I've found some features of pre-made templates that have to be manually added to the template core files before they work and even then they don't work right. And that's too bad because they have developed a really flexible framework / template / menu system that has lots of promise.
All css is being automatically generated by the .less files. So if you're having similar issues, or have only worked with straight css in the past this might be helpful information for you.
You can add any css code that you want to the .less files and they'll show up in the auto-generated css files (and not go away or be reset) and be visible on site refresh. Working with .less can do some other cool things too so I'd suggest looking up some information on the subject if you're a .less noob like me.
The lack of clear documentation on almost every subject pertaining to Joomshaper's products is very sad. I've found some features of pre-made templates that have to be manually added to the template core files before they work and even then they don't work right. And that's too bad because they have developed a really flexible framework / template / menu system that has lots of promise.
- more than a month ago
- Helix-II
- # Permalink
Hello mossm,
I am having the same problem as you have described above. So, please tell me what you did to fix the issue.
I am still not able to resolve it.
Thanks
I am having the same problem as you have described above. So, please tell me what you did to fix the issue.
I am still not able to resolve it.
Thanks
I figured it out. Although I'm very disappointed that NONE of the Joomshaper team responded in any way.
All css is being automatically generated by the .less files. So if you're having similar issues, or have only worked with straight css in the past this might be helpful information for you.
You can add any css code that you want to the .less files and they'll show up in the auto-generated css files (and not go away or be reset) and be visible on site refresh. Working with .less can do some other cool things too so I'd suggest looking up some information on the subject if you're a .less noob like me.
had the same issue and found your post; I'm also new to .less but I managed to write the css that I wanted from the less file. Thank's for sharing.
Hello All,
Thank you for the information on how to manipulate the .LESS file to retain the CSS styles from being overwritten. Please can you direct me to the list of files to work on and those not to. Its a bit fraustrating having to make considerable changes and it just gets overwritten in one go.
Thanks
Thank you for the information on how to manipulate the .LESS file to retain the CSS styles from being overwritten. Please can you direct me to the list of files to work on and those not to. Its a bit fraustrating having to make considerable changes and it just gets overwritten in one go.
Thanks
Dears all
If you want to do the normal css then you have to disable the less.css from template managers Advanced option. Also check the screenshot: https://copy.com/oNtt4F7XDFS0
If you want to do the normal css then you have to disable the less.css from template managers Advanced option. Also check the screenshot: https://copy.com/oNtt4F7XDFS0
Hello,
I too would like to know where should I make the changes to preserve the preset4.css file and not have it overwritten each time.
I know how to use less but adding the code to my less file will just over run the current preset4.css file.
Why loading all that css code if I'm going to overwrite it ussing less? And in many cases I have to add !important for the less changes to take effect. That leaves me with a problem making additional changes to responsive design.
I would like to make my changes directly to preset4.css. Is that possible?
Regards,
Guy.
I too would like to know where should I make the changes to preserve the preset4.css file and not have it overwritten each time.
I know how to use less but adding the code to my less file will just over run the current preset4.css file.
Why loading all that css code if I'm going to overwrite it ussing less? And in many cases I have to add !important for the less changes to take effect. That leaves me with a problem making additional changes to responsive design.
I would like to make my changes directly to preset4.css. Is that possible?
Regards,
Guy.
Guy Walder wrote:
Hello,
I too would like to know where should I make the changes to preserve the preset4.css file and not have it overwritten each time.
I know how to use less but adding the code to my less file will just over run the current preset4.css file.
Why loading all that css code if I'm going to overwrite it ussing less? And in many cases I have to add !important for the less changes to take effect. That leaves me with a problem making additional changes to responsive design.
I would like to make my changes directly to preset4.css. Is that possible?
Regards,
Guy.
To disable .LESS and only use CSS, see Sohan's post and linked screenshot in this thread from Monday, April 07 2014, 12:11 PM. (https://copy.com/oNtt4F7XDFS0)
You can't use both .LESS and CSS unless you only add CSS to a new "custom.css" file which will work as an override in many cases. Just about everything else is auto generated by the .LESS files. Think of it this way... basically the css files don't actually exist. When a page is viewed in a web browser it needs to read the CSS to style the page so the CSS is created on the fly by the .LESS code.
The .LESS files are found in the folder:
root > templates > 'template name' > less
Or here in the Joomla backend:
Extensions > Template Manager > Templates > Template Name > less
Hi Mossm,
Thank you for the detailed replay.
I would like to keep on using less so disabling it will do me no good.
So, if CSS files are generated on the fly from LESS files, where are the LESS files that generate the preset CSS files?
Here's my problem, my preset.ccs file gets a higher priority then less files when trying to override it. This causes me to use "!important" to force the changes. But, after that I can't add more changes to the same item in responsive designs or for any other reason. This is my main issue right now.
I've created a new preset by duplicating preset3, and it has lots of css code which I would like to change or replace. HOW???
Thanks again for helping.
Guy.
Thank you for the detailed replay.
I would like to keep on using less so disabling it will do me no good.
So, if CSS files are generated on the fly from LESS files, where are the LESS files that generate the preset CSS files?
Here's my problem, my preset.ccs file gets a higher priority then less files when trying to override it. This causes me to use "!important" to force the changes. But, after that I can't add more changes to the same item in responsive designs or for any other reason. This is my main issue right now.
I've created a new preset by duplicating preset3, and it has lots of css code which I would like to change or replace. HOW???
Thanks again for helping.
Guy.
Thank you Sohan I will.
What if I like to delete some code instead of overwriting it. Where can I please locate the source of my preset?
What if I like to delete some code instead of overwriting it. Where can I please locate the source of my preset?
Dear Sohan,
There's no issue. I'm trying to learn how to work in a better, smarter and more efficient way with your framework.
When I duplicate a preset to create my own I get allot of styling with it. I would like to clean this styling so I wouldn't need to override everything.
This is why I've asked to know where is the origin of the presets styling.
Thank you,
Guy
There's no issue. I'm trying to learn how to work in a better, smarter and more efficient way with your framework.
When I duplicate a preset to create my own I get allot of styling with it. I would like to clean this styling so I wouldn't need to override everything.
This is why I've asked to know where is the origin of the presets styling.
Thank you,
Guy
This is not the best way to delete the preset the file. Because all property doesn't come from the preset.less file.
Sohan wrote:
This is not the best way to delete the preset the file. Because all property doesn't come from the preset.less file.
So where does this preset styling comes from? What is the best way to get a clean slate?
Hi Guy Walder,
if you want to delete preset just remove that preset group code eg:
and then go to template settings 'administrator > Extensions > template manager > template' save it. that's all.
this is proper way.
- Thanks
if you want to delete preset just remove that preset group code eg:
<!--Start Preset6-->
<field name="preset6_bg" class="preset6" type="picker" default="#ffffff" label="Background Color" />
<field name="preset6_text" class="preset6" type="picker" default="#242424" label="Text Color" />
<field name="preset6_link" class="preset6" type="picker" default="#7C5C3A" label="Link
<!--End Preset6--> and then go to template settings 'administrator > Extensions > template manager > template' save it. that's all.
this is proper way.
- Thanks
There are no replies made for this post yet.
Be one of the first to reply to this post!
Be one of the first to reply to this post!