https://discord.umbraco.com
Join Discord
Background Color
# help-with-umbraco
y
How can I change the Umbraco Cms logo and the background color ?
c
Hi! I found this article which to my knowledge is still accurate, which you could give a try! 🙂 https://www.liquidint.com/blog/technology/how-to-customize-umbraco-backoffice-colors
y
@Corné Hoskam I tryed this but it not work
c
Could you specify which version of Umbraco you are using, and what exactly you have tried/is/isn't working?
y
@Corné Hoskam 12
s
You can add a plugin - I have one that detects the environment (dev / uat / stage / live) and changes the header colour and adds a border so I don't update content in live by accident. Happy to share * * disclaimer being I probably borrowed it from some else on the web but can't credit them
Drop that in your App_Plugins directory (create one if you don't have one) and run dev tools in the backoffice to clear the cache and do a hard refresh. Customise to your own delight. https://cdn.discordapp.com/attachments/1184780943186202734/1184867867838132285/BackOfficeStyles.7z?ex=658d8931&is=657b1431&hm=d3ee6cbfe9b52eae0e3dc8f983fdfc1d0095764f3129395934cf3637cadc69d7&
Just dropped this into two of my projects (as I had it on a todo list to port over from v7). One worked and picked it up - the other I had to add: "Umbraco": { "CMS": { "RuntimeMinification": { "UseInMemoryCache": true, "CacheBuster": "Version", "Version": "1001" } } } To my appsettings.json to get it to rebuild the back office frontend. If you wish to dev and test just keep incrementing the version if it gets stuck
y
@SiempreSteve Thank you, it work ow, what about the backgrond for the login, could I change the logo and the backgrong image ?
s
c
The options are very limited in 13 (and poss 12). I raised a discussion about it last night: https://github.com/umbraco/Umbraco-CMS/discussions/15477
s
Are you not able to just add a custom login css file with something like .login-overlay__logo { display: none } I haven't tried this - never had to customise the login screen
Ah - I see - this is not just outputting the custom css - it requires you to change the css vars . Hopefully that can be more flexible as you say
y
@SiempreSteve @Craig100 , Hello All , For me I used App_Plugin Direct as a package and it work,I hide the main logo and I add another logo and everything is good , I add a custom login css file with .login-overlay__logo { display: none } and add one more class.
Thank you Friends
@SiempreSteve @Craig100 should use before the clas name : .dev .className{} for the dev environment and for the live : .live .className{}
s
Is that on v13 though - I tried and couldn't get my css to load.
c
I can confirm this works, if you want a logo but don't want a background image:-
Copy code
"Content": {
    "LoginBackgroundImage": "#",
    "LoginLogoImage": "../images/tiucl_logo_white.svg"
}
But you get your logo is in the same relative position as you would had you had a background image. Still can't get it to replace the Umbraco logo that you get when you don't have either a background or logo image.
11 Views
PreviousNext
Powered by

Umbraco

A hub and casual space for you to interact with fellow community members and learn more about Umbraco!

Powered by