Override Loginscreen Logo

Neos / Flow FAQ
1

Hi, neos noob here :wave:

Is there a way to alter the “N” logo from the login screen (preferably without having to alter the Neos.Neos package)?
As far as I can see it seems to be possible to override the css (https://github.com/neos/neos-development-collection/blob/master/Neos.Neos/Configuration/Settings.yaml#L290), but the logo is defined in html.

Thanks in advance (and I hope this is not a duplicate).

2

There is no prepared way to adjust this. The login screen is rendered here

You should be able to register some additional fusion to via Views.yaml

-
  requestFilter: 'isPackage("Neos.Neos") && isController("Login") && isAction("index") && isFormat("html")'
  viewObjectName: 'Neos\Fusion\View\FusionView'
  options:
    fusionPathPatterns:
      # default fusion
      - 'resource://Neos.Neos/Private/Fusion/Backend'
      # additional fusion
      - 'resource://Vendor.Example/Private/Fusion/Backend/ModifyLoginScreen.fusion'

Then you can override stuff via fusion:

prototype(Neos.Neos:View.Login) {
    renderer {
        content {
            renderer.@process.appendStuff = ${value + "foobar"}
        }
    }
}

Kinda dirty but that would work. Maybe use some ${String.pregReplace(value, __seaarch__, __replace__)} to avoid messsing with all fusion pathes.

Offcourse the clean way would be to add aSetting Neos.Neos.userInterface.backendLoginForm.logoImage and create a PR for that. Be prepared for a discussion wether we want to support this or not.

2 Likes
3

I did an override of the logo via css in one project.
You can include additional css files via the Neos.Neos.userInterface.backendLoginForm.stylesheets setting.

1 Like
4

Hmm if this happens more than once maybe we should really add a setting for that. Could be fun if we start playing with animated svgs.

5

Like Animojis that follow the cursor in the password field :wink:

6

Thanks a lot guys!

@sebobo About the CSS variant: I see that you can add css. But the picture itself is not defined there… so did you just set the original logo to invisible and add another image via css or what?

@mficzel It does not look that dirty imho, if it survieves updates to neos that is all I ask for :slight_smile: thanks a lot. Though I will first get a bit more familiar with the cms before opening a PR (I literally started yesterday)

7

Yes something like that, I inserted a custom SVG via a data-url in css.

1 Like