This topic contains 9 replies, has 4 voices, and was last updated by Sean Sean 2 months, 1 week ago.

Abount customizing styles and colors


  • xcasalsv
    Participant

    Posts: 12
    Member Reply #3352

    Hi, I’m a Metronic theme user, and I wish to customize some of its parts. Basically these changes will comprise colour, although also I want to fine-tuning some elements to adapt to our brand styles. Is there any “white paper” or user guide to understand SCSS hierarchy? What I want is to avoid recursive styles and bloat the site with thousands of repetitive and unused code.

    As I work with SASS, I would appreciate some hint about which “scss” file I must use to override the default Metronic theme. Should I to work over any of the “scss” files contained in the “Themes” folder (for example “blue.scss”)?

    On the other hand, about “layout.scss”, “_base.scss” and “custom.scss” files. Which are their mission in the hierarchy? Which should I customize?

    (I know the “custom.scss” from Bootstrap kits, but I’m not familiarized by the other two)

    Many thanks in advance.

    Sean
    Sean
    Keymaster

    Posts: 4527
    Support Staff Reply #3370

    Hi :),

    Thanks for your feedback.

    Our advice depends on the Metronic version. Could you please let us know what Metronic version are you using ?

    Thanks.


    xcasalsv
    Participant

    Posts: 12
    Member Reply #3380

    v3.8.1

    Thank you

    Sean
    Sean
    Keymaster

    Posts: 4527
    Support Staff Reply #3397

    Hi,

    Please note there are layout based scss files, global scss component and plugin files under “scss” folder. Each admin theme has own layout scss files under “scss/admin/layout”, “scss/admin/layout2”, “scss/admin/layout3”. etc.
    Each layout has own theme colors defined under “themes” folder of each layout. _base.scss defines base styles for each theme color and in blue.scss for example you will just set the color through variables. I would suggest you to change some variables and compile scss to update the actual css files under assets folder.

    If you need any further assistance please let us know.

    Thanks.


    xcasalsv
    Participant

    Posts: 12
    Member Reply #3617
    This reply has been marked as private.
    Sean
    Sean
    Keymaster

    Posts: 4527
    Support Staff Reply #3630
    This reply has been marked as private.

    dezonfranz
    Participant

    Posts: 2
    Member Reply #5967

    I used keenthemes for my major business website aspects, however, does it still covers its terms when I have someone from other source like some expert at http://eatmywords.com/ works on it? like altering some themes attributes and values?

    Sean
    Sean
    Keymaster

    Posts: 4527
    Support Staff Reply #5977

    Hi dezonfranz,

    Yes, sure. You can purchase the theme and hire any consultant or developer to develop your site further by altering Metronic according to your project requirements. This is normal approach when you purchase a premium themes.

    Thanks.


    lalabili
    Participant

    Posts: 1
    Member Reply #18750

    Hi,

    I’m still using Metronic v. 4.7.5 and would like to use my custom color. And I followed your advice above by adding new colorname or change colorcode in _colors.scss under sass/global but still not working

    “pinkk”: (base:#FF69B4, font: #ffffff),

    Would you please suggest what I need to do to make it working?

    Many thanks in advance 🙂

    Sean
    Sean
    Keymaster

    Posts: 4527
    Support Staff Reply #18800

    Hi,

    By right it should work if you just added a new color, as the rest of the colors already work. Did you compile the sass files to regenerate the css files ? Please refer to the documentation on how to compile the theme sass.

    ========

    May I ask if you have active support subscription ? Metronic support subscription must be renewed every 6 months according to the Envato’s recent changes in the support policy. Could you please provide your support subscription to continue with the theme support. 

    Thanks.

You must be logged in to reply to this topic.