We're calling on all EU-based Mozillians with iOS or iPadOS devices to help us monitor Apple’s new browser choice screens. Join the effort to hold Big Tech to account!

Avatar for Username

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Hierdie gesprek is in die argief. Vra asseblief 'n nuwe vraag as jy hulp nodig het.

How to change the about:home Brand Logo in Firefox portable using CSS

Quisquose
Quisquose
more options

I searched Mozilla Support and I found this archived topic: https://support.mozilla.org/en-US/questions/944199

However the CSS provided in that answer does not work in current versions of Firefox.

1. What CSS should be used to replace the about:home brand logo in Firefox Portable v29 (Australis).

2. If I wish to store my replacement image somewhere inside the Firefox Portable folder, how do I specify a relative path (instead of an absolute one) so that the replacement image can always be found, regardless of where Firefox portable folder is located.

I searched Mozilla Support and I found this archived topic: https://support.mozilla.org/en-US/questions/944199 However the CSS provided in that answer does not work in current versions of Firefox. 1. What CSS should be used to replace the about:home brand logo in Firefox Portable v29 (Australis). 2. If I wish to store my replacement image somewhere inside the Firefox Portable folder, how do I specify a relative path (instead of an absolute one) so that the replacement image can always be found, regardless of where Firefox portable folder is located.

All Replies (1)

Gingerbread Man
Gingerbread Man
more options

Put the following in the userContent.css file. 

@-moz-document url("about:home") {
#brandLogo { background-image: url("brandlogo.png") !important; }
}
  • Your image should be 192×192.
  • Your image should be placed in the chrome folder, next to userContent.css.
  • Otherwise, you can use relative paths as usual, ../ meaning up one folder and so on. See Absolute and Relative Paths | About.com for details.
  • If you're using Stylish instead, then you have a choice of either embedding the image using the Insert button, or specifying an absolute path. Firefox presumably tries to fetch the image from chrome://… so specifying a relative path isn't possible.

Gewysig op deur Gingerbread Man