Hilfe durchsuchen

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

Firefox Home Page Customization

  • 4 Antworten
  • 1 hat dieses Problem
  • 56 Aufrufe
  • Letzte Antwort von colinfrankel1

more options

I have set my new tab to look like image one and I really like it but I want to have pages I use A LOT under like image two but then it gets rid of the logo and looks bad. Just to clarify I want it to look like the 3rd image. Sorry if this is a dumb question I just switched from chrome.

Angefügte Screenshots

Geändert am von colinfrankel1

Ausgewählte Lösung

It's a bit messy to inject two different background images, but check this out:

@-moz-document url("about:newtab"), url("about:home") {
  #root::before { /* Logo */
    display: block;
    position: absolute;
    left: 50%; 
    top: 20px;
    transform: translateX(-143px);
    content: "";
    width: 96px; height: 96px;
    background: url("chrome://branding/content/icon128.png") no-repeat;
    background-size: 96px;
  }
  main::before { /* Firefox name */
    display: block;
    position: absolute;
    left: 50%; 
    top: 20px;
    transform: translateX(-37px);
    content: "";
    width: 172px; height: 96px;
    background: url("chrome://branding/content/firefox-wordmark.svg") no-repeat center center;
    background-size: 172px;
    -moz-context-properties: fill;
    fill: var(--newtab-search-wordmark-color);
  }
}

If you want to push the logos further down the page, adjust both of the top values from 20 pixels to some higher number of pixels.

Diese Antwort im Kontext lesen 👍 1

Alle Antworten (4)

more options

Maybe this reddit post may help to solve your problem: https://www.reddit.com/r/FirefoxCSS/comments/cco3il/adding_top_sites_or_highlights_removes_firefox/


This would mean you need to create (or - if already existing - adjust) a "manual correction" using file userContent.css to manually insert the logo into about:newtab / about:home tab even when top sites are enabled to be shown. As a pre-requisite, this would require that in "about:config" the setting "toolkit.legacyUserProfileCustomizations.stylesheets" is set to True to be able to use the userContent.css file. How to create the file and where to place it, can be found here: http://kb.mozillazine.org/index.php?title=UserContent.css.

Hilfreich?

more options

Hey thanks for the response. I got this to work but I have no idea how to add the text after the logo.

Geändert am von colinfrankel1

Hilfreich?

more options

Ausgewählte Lösung

It's a bit messy to inject two different background images, but check this out:

@-moz-document url("about:newtab"), url("about:home") {
  #root::before { /* Logo */
    display: block;
    position: absolute;
    left: 50%; 
    top: 20px;
    transform: translateX(-143px);
    content: "";
    width: 96px; height: 96px;
    background: url("chrome://branding/content/icon128.png") no-repeat;
    background-size: 96px;
  }
  main::before { /* Firefox name */
    display: block;
    position: absolute;
    left: 50%; 
    top: 20px;
    transform: translateX(-37px);
    content: "";
    width: 172px; height: 96px;
    background: url("chrome://branding/content/firefox-wordmark.svg") no-repeat center center;
    background-size: 172px;
    -moz-context-properties: fill;
    fill: var(--newtab-search-wordmark-color);
  }
}

If you want to push the logos further down the page, adjust both of the top values from 20 pixels to some higher number of pixels.

Hilfreich?

more options

Thank you so much!

Hilfreich?

Stellen Sie eine Frage

Sie müssen sich mit Ihrem Benutzerkonto anmelden, um auf Beiträge zu antworten. Bitte stellen Sie eine neue Frage, wenn Sie noch kein Benutzerkonto haben.