thexerteproject / xerteonlinetoolkits

Xerte Online Toolkits
www.xerte.org.uk
Apache License 2.0
62 stars 61 forks source link

installation branding and logo location and types #1239

Closed ronm123 closed 10 months ago

ronm123 commented 11 months ago

I had a question where someone had tried to use the management option to change the logos that appear top left and right of the workspace so I reminded myself whether that still works or not and it seems it has no effect. We should probably remove those form fields or else enable this to work again?

I know we have the branding folder for this but in testing that I wanted to use an .svg rather than png and that doesn't seem to work either, whereas .png does. I was trying to remember if we made this possible when @JohnSmith-LT worked on all the logo permutations for the project templates/themes but perhaps we didn't because using logo_right.svg doesn't work but logo_right.png does. Ideally we should change this so that any format works especially now that the newer image formats are becoming more popular.

ronm123 commented 10 months ago

I'm going to close this because although it would probably still be quite useful to change the code and make it more flexible (including management options) it turns out I could achieve what was needed with some custom css. Part of that is a bit of a hack but it works so will close this issue for now at least.

takadachi commented 10 months ago

@ronm123 Could you share the custom css needed? I was interested in the resolution to this issue.

ronm123 commented 10 months ago

@takadachi the css I've used is kind of specific to the requirements of the university I've tested this for but the basic principal is as follows: in the branding folder you should find a README.txt file that says: -- You can place custom logo's here. Just place 1 or 2 files called logo_left.png and/or logo_right.png So you can replace the default logos by placing files with those exact names in the branding folder. What the README doesn't say but I suspect our release notes do (for the version when this was first added) is that you can add a branding.css file in that location and add css to change relevant aspects of the workspace etc. You'll need to view the relevant core-files or inspect the source with dev tools to identify what you want to change but I guess the trick that I used to change the logo to an svg without changing the core code (because there isn't currently a specific selector) was: .topbar > div:nth-child(1) { width: 50%; height: 55px !important; background-image:url(logo_right.svg)!important; background-repeat:no-repeat; background-position:right; margin-right:22px !important;margin-top:12px; float:right } There's bits of that specific to the logo I've used so px values might need to be changed for different logos. HTH Ron