Ein Hintergrund für Firefox New Tab

Nach längerer Zeit mal wieder ein CSS-Schnipsel für die userContent.css von Firefox. Eigentlich dachte ich wir hätten, was Anpassungen angeht, hier schon alles gehabt. Das stimmt aber nicht. Es gibt noch immer neue und klasse Tweaks.

Nachfolgender Code für die userContent.css bindet ein Bild auf der Seite „New Tab“ ein. Das Ergebnis könnt ihr auf dem Titelfoto bewundern. Damit erhält Firefox ein Feature, dass bei anderen Browsern schon längere Zeit üblich ist. Die benötigen Bilder könnt ihr bei Unsplash oder Pixabay herunterladen. Obiges Bild findet ihr bei Pixabay.

/*
 * new-tab-background
 * nach einem Reddit Thread
 * https://www.reddit.com/r/FirefoxCSS/comments/d5suwl/a_small_tweak_i_made_for_changing_the_background/
 * https://github.com/OliveOil1/New-Tab-Background
 */
 
:root{
  /*---??customizations??---*/
  --backgroundImageUrl: url("man-1915351-pixabay.jpg")
}

/*---Add background image to about:home and about:newtab---*/
@-moz-document url(about:home), url(about:newtab){
  body {
    background-image: var(--backgroundImageUrl) !important;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    left: 0;
    margin: 0;
    padding: 0;
    position: fixed;
    top: 0;
    transition: opacity 700ms;
    width: 100%;   
  }
}

Die Zeile --backgroundImageUrl: url("man-1915351-pixabay.jpg") nimmt den Namen des Bildes auf. Das Bild muss in meinem Beispiel im Ordner chrome gespeichert werden.

userContent.css und userChrome.css verändern das Aussehen. Während die Datei userContent.css das Aussehen von Webseiten verändert, verändert userChrome.css das Aussehen von Firefox. Die Dateien gehören in den Ordner chrome des Profils und müssen dort erzeugt werden. Um nun an den Profilordner zu kommen muss man via „Burgermenü“ => „Fragezeichen“ den Menüpunkt „Informationen zur Fehlerbehebung“ öffnen. Der Profilordner wird im Windows-Explorer geöffnet wenn ihr den Button „Ordner anzeigen“ in der Zeile „Profilordner“ nutzt. Legt dort einen neuen Ordner mit dem Namen chrome an. In diesem neu angelegten Ordner müsst ihr dann Textdateien mit der Bezeichnung userChrome.css und userContent.css erzeugen. Das ist eigentlich schon alles. Ihr müsst die so erzeugten Dateien nur noch mit einem ordentlichen Texteditor (Notepad gehört nicht dazu) öffnen und mit den passenden Codeschnipsel füllen. Die Codezeilen werden nach einem Browser-Neustart wirksam.

Achtung: Mozilla ändert ab Firefox 69, um die Startzeit des Browsers zu verkürzen, den Umgang mit den Dateien userChrome.css und userContent.css Beide beachtet der Browser ab dieser Version in der Standardeinstellung nicht. Um die Dateien zu nutzen muss man ab Firefox 69 vorher per „about:config“ den Schalter „toolkit.legacyUserProfileCustomizations.stylesheets“ auf „true“ stellen.

3 Antworten auf “Ein Hintergrund für Firefox New Tab”

  1. CSS-Schnipsel, nachdenken: „Herr Horst mag doch eigentlich ganz leere Seiten?!“ – aallles nebensächlich, grins!

    „Obiges Bild findet ihr bei Pixabay.“ – DAS hab´ ich gelesen. Und: „Unbedingt muß ich dieses Bild haben, so groß als möglich!“

    Obwohl ich abertausende von Wallpapern gespeichert habe, dieses eben noch nicht. Waren sogar kleine Klimmzüge nötig, um das Wall in

    4959×3163

    runter zu laden: nur „würdige“ (angemeldete User) können das. Aber da kenn´ ich dann auch nix – habe ich mich eben angemeldet.

    Später kann ich es mir gemütlich zurechtschneiden, dieses mal für 16:10, 16:9 und 5:4 – ob ich das als Wallpaper verwende, ist natürlich noch eine andere Sache…

    1. Jupp! Ich mag leere Seiten. Leider, leider spielt da nicht jeder Browser mit. Aber Firefox kann das!!! Wobei wir jetzt streiten müssten ob eine Seite „Neuer Tab“ mit Hintergrundbild und sonst nix nicht auch als leer gilt.

Schreibe einen Kommentar

Diese Funktion speichert ihre Daten. Mehr dazu in der Datenschutzerklärung.