Add Background Image to about:blank

[.tommygun.]

.......I'm on Firefox 57.0 (64-bit) and did change the background color of my about:blank page by creating a chrome folder inside my profile and added a userContent.css file to that folder containing:

Code: Select all

@-moz-document url-prefix(about:blank) {*{background-color:#000000;}}

Now I'm trying to add a background image as well, but whatever I tried didn't work.
The image I'm trying to add is also in the chrome folder.
Hopefully someone here can point me to the correct css code to add an image as well as the background color .......

[morat]

I got it working in Fx 57.

Code: Select all

/* Firefox userContent.css */

@-moz-document url-prefix("about:blank") {
  body { background-color: pink !important; }
  body { background-image: url("chrome://branding/content/about-logo.png") !important; }
}

Code: Select all

/* Firefox userContent.css */

/* example.png is in chrome folder */

@-moz-document url-prefix("about:blank") {
  body { background-color: pink !important; }
  body { background-image: url("example.png") !important; }
}

http://kb.mozillazine.org/UserContent.css

[therube]

(I saw the topic subject & laughed. If you add an image to "about:blank", is it still blank .)

[.tommygun.]

@morat

Edit:

Thanks for the css code:

I just managed to do it with this code here for both the about:newtab & about:blank:

Code: Select all

@-moz-document url-prefix(about:blank), url-prefix(about:newtab) {
    html, body, #newtab-customize-overlay {
        background-color: #000000 !important;
        background-image: url("image.png") !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
	     background-attachment: fixed !important;
}

I'm still having one proplem though, if I set my homepage to about:blank firefox does not show my customized about:blank page. instead it shows just an empty blank page.
Is there anyway to work around this ?
Changing the appearance of the about:newtab including scrollbar would do it as well or disable the scrollbar on the about:newtab alltogether.

[morat]

I got it working in the about:blank page and in both the about:newtab pages.

My home page is set to the about:blank page.

Code: Select all

/* Firefox userContent.css */

@-moz-document url-prefix("about:blank"), url-prefix("about:newtab") {
  body {
    background-color: pink !important;
    background-image: url("chrome://branding/content/about-logo.png") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-attachment: fixed !important;
  }
}

There are two about:newtab pages. (needs a restart to change)

* pref browser.newtabpage.activity-stream.enabled true (default)
* pref browser.newtabpage.activity-stream.enabled false

The activity stream feature is shown in the about:support page.

The non-default about:newtab page has the div[id="newtab-customize-overlay"] element.

P.S.

You are missing a "}" character.

[.tommygun.]

....... thank you very much.

You are missing a "}" character.

I noticed but it doesn't matter anymore, because I'm using the exact css from you, except for image location and color. then changed:

browser.newtabpage.activity-stream.enabled in about:config from true to false like you said and it's working nicely now.

Thanks again, I really do appreciate your help .......

Edit:
I just noticed that my homepage is set to about:newtab, if I change it to about:blank it's like it was before.
On Firefox startup I get a blank page only, not the customized one and my cursor is the hourglass.
Anyway, at least the light colored scrollbar on the about:newtab is gone.
BTW, the browser.newtabpage.activity-stream.enabled isn't shown in about;support, it's only in about:config

[morat]

The tweak doesn't work at startup for me as well. The style is applied correctly if I open a random tab in the foreground, then select the about:blank tab.

Thanks again, I really do appreciate your help.

You're welcome.

P.S.

There is a Firefox Features section in the about:support page.

[dfoulkes]

(I saw the topic subject & laughed. If you add an image to "about:blank", is it still blank .)

I suppose that 'if' the image was the word 'BLANK' ... that would fit the criteria?