Make a quick vote 🗳 ️How do you refer to SuiteCRM extensions: add-ons or plug-ins? Click here to have your say 👈

Custom theme for 7.11.4

Hi,

I’ve read the brilliant articles by pgr/pgorod on creating a custom theme but they make it clear that the example commands are for v7.10 and I’ve got a brand new 7.11.4 install that I’d like to tweak.

https://docs.suitecrm.com/blog/customizing-subthemes/
https://pgorod.github.io/Customize-SubTheme/

Has anyone already figured out how to achieve the same thing in 7.11 before I start delving deeper myself?

Many thanks,

Steve

If you simply start with whatever color-palette.scss you find in your current theme, and apply this sort of change

    Top menus
    C2C3C4 > 555555

    Lettering
    817C8D > 111

    Sidebar
    929798 > 626768
    707d84 > 303d44

You will get a functional file.

Anyway, my comment “this applies to 7.10.x” only was made right after 7.10 came out, and there was no 7.11. I am going to fix that sentence now :slight_smile:

Hi pgr,

Thanks for replying.

So are you saying that we can directly edit the color-palette.scss file instead of having to setup a custom theme from scratch? I’ve just tried editing that file (themes/SuiteP/css/Day) in the ‘Day’ theme which I’m using but it’s not worked (I’ve done a rebuild and repair too for good measure!) :frowning:

Are there any other compilation steps or anything else? I’ve also hard refreshed my browser because that often caches CSS content.

Thanks,

Steve

No, you should stick to the method described on the blog post - the step that is missing for you is the SASS compilation. The scss files are never used directly, they are first turned into CSS files.

And I think you’re better off with a new sub-theme, to keep things separated.

The only thing I meant is this: I based my color-palette.scss file on whatever existed at the time. There might be some changes there since then, so you should base your changes on the current version of it. That’s all.

1 Like

Hi,

I’ve figured out what’s been going wrong. I had upgraded from 7.11.2 to 7.11.4 and was editing files in the wrong folder! Once I’d figured that out everything started to work as expected.

Thanks for your help!

Steve

For any custom adjustment in fonts , colors and text size , you may look at this plugin.

https://store.outrightcrm.com/product/suitecrm-theme-style-builder/

Thanks Ashish - if I need to do anything complicated I’ll buy your Style Builder plugin B-)

My needs are simple for now - I’m just doing a proof of concept to see if SuiteCRM will meet our needs fully.

Cheers,

Steve

1 Like

You can do some really nice things with css as well here is what we were able to achieve :

https://www.youtube.com/watch?v=xFinSTYnI0I

1 Like

Nice! It’s just those mint green scroll bars to deal with now :stuck_out_tongue:

If anyone knows how to deal with them please post!

Cheers,

Steve

Change the RGB value to be whatever color you want and this will do it. The rgb’s below are now my blue color :slight_smile: I changed mine after you asked how.
https://www.screencast.com/t/W0LtbFbEGq



/* scroll bar colors */

div::-webkit-scrollbar-thumb {
    background: rgba(75, 151, 196, 1);
}

select::-webkit-scrollbar-thumb {
    background: rgba(75, 151, 196, 1);
}

input::-webkit-scrollbar-thumb {
    background: rgba(75, 151, 196, 1);
}

textarea::-webkit-scrollbar-thumb {
    background: rgba(75, 151, 196, 1);
}

ul::-webkit-scrollbar-thumb {
    background: rgba(75, 151, 196, 1);  
}

/* scroll bar colors */

1 Like

Thanks!

Find best custom theme for SuiteCRM v7.11.4 - https://store.suitecrm.com/addons/techvibrant-theme

https://www.youtube.com/watch?time_continue=15&v=Ss-kLoVCHT8

if you are looking for 100% free suitecrm them click here https://www.techesperto.com/software-products/

We have released a new theme for SuiteCRM 7.18 that adds functionality as well as new graphics. Both the open source and the paid version are released See https://koolsuite.com/

1 Like

marco
its looking good. i installed it but ran into issue with menu opening, dashlet addition on home page and the Top Menu DD not working.

Hi cherub-chum
it should be an error writing files to the cache directory. First, clear your browser cache. It may be a problem with the correct permissions on the filesystem Try to perform a Repair.
If you can’t solve you can contact me. It’s a trivial thing to solve.