Modify Framework skin's colors

A place for discussion about skinning and design. Before posting questions here you should review the documentation about creating skins.

12/14/2017 10:50:49 AM
KH
Gravatar
Total Posts 2

Modify Framework skin's colors

Hi,

I have been trying to modify the colors on the framework skin but the colors does not apply to my page. I tried editing the main.css and variable.less to change the colors but nothing works. I also disabled css caching on both Administration page and web.config file. I don't know what else to do. 

Please help.

Thanks,

Karen

12/14/2017 2:32:27 PM
Gravatar
Total Posts 192
Community Expert

mojoPortal Hosting & Design @ i7MEDIA!

Re: Modify Framework skin's colors

Hi Karen,

There are two ways to change the colors in Framework.

  1. You can modify the main.css file by using find & replace to change any color code (#333; or rgba(123,123,123,1) for instance) throughout the whole file. After this you'll need to clear your browser cache (ctrl+shift+r or ctrl+f5 usually does it), and/or reset your skin GUID. To do this click "Administration" in your admin bar on the left, then go to Advanced Tools > Design Tools > Cache Tool, then click the "Reset Skin Version GUID" button.
  2. You can modify the skin using the .LESS code (as you said, in variables.less) and then recompile the skin using a tool like Prepros. Instructions for this can be found in this page, under the "What does this all involve?" heading. Basic steps:
    1. Download Prepros and run it.
    2. Download your skin and drag your skin folder onto the Prepros window.
    3. You should see a folder named "Framework" inside Prepros now, right click the folder and click the "refresh project" option
    4. Make the change to your variables.less file.
    5. After Prepros says it has compiled, copy your skin back over to your website.
    6. Reset the skin GUID (as mentioned above).
    7. Reload the page (ctrl+shift+r to be safe).

Hope this helps!

12/15/2017 8:54:40 AM
KH
Gravatar
Total Posts 2

Re: Modify Framework skin's colors

I used Prepros and it worked! Thanks a lot!