Customizing Mattermost

Troubleshooting
1

Hi,
I am trying to customize my Mattermost Team installation.
I changed the /client/images/logo-email.png file but e-mails are still sent using the default logo in the header.

I also wish to change the background color of the webapp for every users but I cannot find any way about how to do so.

Can you help me please?

2

Hi @decibel83, thank you for reaching out.

Here are complete instructions for changing the email logo: https://docs.mattermost.com/deployment/customize-mattermost.html#mattermost-webapp

I believe you need to change these to customize the theme:


3

Thank you for your reply!
I am trying to understand.
The docs at https://docs.mattermost.com/deployment/customize-mattermost.html#mattermost-webapp does not referer to mattermost-redux repository but to the masttermost-webapp one.
I realized that your information about customizing the theme is about customizing files in mattermost-redux.
I can fork also this repository of course, but what I have to do after customizing the files?
Thanks!

4

Thanks amy.blais, I managed in creating a new custom template as default one.
Now I’m looking for some way to custom the login page.
I know I can customise logo and texts on the System Console, but I wish to customise CSS colours as well, in particular I wish to change the link colours.

I am looking in the source of the mattermost-webapp code where this colour:

.btn.btn-primary {
    background: #2389d7;
    border-color: transparent;
}

and

a {
    color: #2389d7;
    cursor: pointer;
    text-decoration: none;
    word-break: break-word;
}

is specified but I cannot find anything.

Could you help me please?

5

Maybe @hmhealey can you help take a look at this ^

The reporter is looking to customize the login page CSS colours and isn’t sure what code to modify.

6

Our CSS is kind of a mess in some places, so you might have to do some digging to find what you’re looking for. For those two that you’re looking for, the colours used for both are done using a sass variable, so you’d have to look for text like background: $primary-color;. The first rule is applied [in _buttons.scss](https://github.com/mattermost/mattermost-webapp/blob/master/sass/components/_buttons.scss#L28and the second is in _links.scss.

You may also run into the theme system as well if you’re trying to override the colours applied by that since all of that is done programatically, after CSS is applied.