Ein ausgeklügelter Trick für die Browser-Lesezeichen

Ich habe viel Freude an einem kleinen Firefox-Hack: Mit dem blen­det sich die Book­marks-Leiste nach Bedarf auto­ma­tisch ein und aus.

Welches ist der effizienteste Weg, um im Browser eine Website aufzurufen? Und gibt es gute Gründe, mehr als eine Methode zu verwenden? Darüber werde ich mich gleich auslassen. Doch erst will ich euch einen Trick nahebringen, den ich in Firefox entdeckt habe und den ich praktisch finde – auch wenn er ein gewisses Ablenkungspotenzial aufweist.

Aber in medias res: Mit diesem Trick ist es möglich, in Firefox die Leiste für die Lesezeichen automatisch ein- und ausblenden zu lassen. Das ist standardmässig nicht möglich: Wir können über die Einstellungen nur wählen, ob die Lesezeichen-Leiste immer sichtbar, nie sichtbar oder nur auf der Seite für einen neuen Reiter angezeigt wird¹. Manuell blenden wir die Leiste mit Ctrl Shift b ein ein und aus.

Nur sichtbar, wenn wir sie auch brauchen

Die Lesezeichen erscheinen nun, sobald wir die Maus auf die Adressleiste oder die Reiter am oberen Rand des Firefox-Fensters bewegen. Sobald wir die Maus von dort entfernen, verschwindet sie wieder. Das heisst: Wir haben die Bookmarks zur Verfügung, wenn wir tatsächlich navigieren möchten. Doch wenn wir lesen oder Links folgen, erscheint die Leiste nicht und von der Benutzeroberfläche ist nur das Allernotwendigste sichtbar.

Die Leiste mit den Lesezeichen, hier auf der Seite für einen neuen Reiter (mit der hier besprochenen Erweiterung Tabliss).

Der Trick gehört zu den CSS-Hacks für Firefox, die auf Github zusammengestellt hat. Sie basieren darauf, dass sich die Benutzerschnittstelle von Firefox nicht nur über die Einstellungen, sondern auch via Stildateien beeinflussen lässt. Für die automatisch erscheinende und verschwindende Lesezeichen-Leiste benötigen wir die Stildatei autohide_bookmarks_toolbar.css, die wir in über die Datei userChrome.css einbinden².

Bewährt sich dieser «Hack»?

Ob dieser «Hack» bei mir auf Dauer im Einsatz bleiben wird, bleibt abzuwarten: Einerseits ist es unbestreitbar nützlich, die Lesezeichen in Griffnähe zu haben. Andererseits finde ich Elemente der Benutzeroberfläche, die sich bei Mauskontakt automatisch einblenden, ablenkend. Es gibt dieses Verhalten für die Taskleiste von Windows und fürs Dock vom Mac. Bei beiden Systemen hatte ich die entsprechende Option phasenweise eingeschaltet, sie dann aber wieder deaktiviert, weil mich die Bewegung auf Dauer gestört hat. Ob der Nutzen oder die Ablenkung grösser ist, bleibt eine Frage des persönlichen Geschmacks.

Und noch eine Frage drängt sich auf: Ist diese Lesezeichen-Leiste überhaupt sinnvoll oder ein Relikt der Vergangenheit? Ich habe die Bookmarks lange Jahre links liegen lassen und diese Linksammlungen für ein Relikt aus der Steinzeit des WWW gehalten. Stattdessen habe ich modernere Methoden ausprobiert und vor allem auf die Tags und Schlüsselwörter von Firefox gesetzt. Doch in letzter Zeit haben die Lesezeichen ein eigentliches Revival erlebt. Das liegt daran, dass ich für meine Arbeit auf immer mehr Webtools angewiesen bin, bei denen ich mich nicht immer sofort an den Namen erinnere: Da ist es praktisch, sie via Lesezeichen-Leiste im passenden Ordner sofort abrufbereit zu haben.

Fussnoten

1) Diese drei Optionen wählen wir über das Menü am rechten Rand der Adressleiste. Wir klicken auf Weitere Werkzeuge > Symbolleiste anpassen. Es erscheint das Fenster Firefox anpassen, in dem wir am unteren Rand das Dropdown-Menü Symbolleisten vorfinden. Wenn wir darauf klicken, erscheint der Menüpunkt Lesezeichen-Symbolleiste mit den Optionen Immer anzeigen, Nur bei neuem Tab anzeigen und Nie anzeigen.

Mit dieser Option erscheint die Lesezeichen-Symbolleiste nur auf der «New Tab»-Seite.

Ich finde die Option Nur bei neuem Tab anzeigen praktisch: Sie führt dazu, dass die Lesezeichen-Leiste normalerweise nicht sichtbar ist, aber beim Öffnen eines neuen Reiters zur Verfügung steht – das ist logischerweise dann, wenn die Bookmarks besonders praktisch sind. Auch das Tastaturkürzel Ctrl Shift b finde ich nützlich – leider aber wechselt das zwischen den Optionen Immer anzeigen und Nie anzeigen: Wenn wir standardmässig Nur bei neuem Tab anzeigen verwenden möchten, müssen wir aufs Tastaturkürzel verzichten.

2) Die Vorgehensweise ist etwas ungewohnt – zumindest für Leute, die sich mit der Bearbeitung von Konfigurationsdateien nicht auskennen. Sie ist aber nicht so schwierig, und MrOtherGuy beschreibt die sie auch ausführlich. Das hier ist eine knappe Zusammenfassung:

Als Erstes müssen wir dafür sorgen, dass Firefox die Datei userChrome.css – mehr zu der übrigens unter userchrome.org – auch benutzt. Dazu geben wir in die Adressleiste about:config ein, klicken die Warnung weg und stellen sicher, dass der Parameter toolkit.legacyUserProfileCustomizations.stylesheets auf true gesetzt ist.

Zweitens stöbern wir die Datei userChrome.css auf. Sie steckt im Profilverzeichnis von Firefox. Um das zu tun, klicken wir aufs Menü am rechten Rand der Symbolleiste und wählen dort Hilfe > Weitere Informationen zur Fehlerbehebung aus. Im Abschnitt Allgemeine Informationen achten wir auf die Zeile Profilordner und klicken dort auf Ordner öffnen. In diesem Ordner müsste der Unterordner chrome zu finden sein, den wir öffnen. Dort ist die Datei userChrome.css vorzufinden. (Bei meiner Windows-Installation lautet der ganze Pfad C:\Users\[Benutzername]\AppData\Roaming\Mozilla\Firefox\Profiles\[Profilname]\chrome\userChrome.css.)

Wir öffnen die Datei in einem Texteditor und ergänzen die Zeile zu der Stildatei. Wir tun das über folgende Zeile:

@import url(chrome/autohide_bookmarks_toolbar.css);

Alternativ können wir auch einfach den Inhalt der Stildatei am Ende von userChrome.css einfügen.

Ach ja, damit die Stildatei auch gefunden wird, müssen wir sie an besagtem Ort speichern. Am besten holen wir uns dafür die aktuelle Version von Github. Ich habe diese Variante hier verwendet:

/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_bookmarks_toolbar.css made available under Mozilla Public License v. 2.0
See the above repository for updates as well as full license text. */

#PersonalToolbar{
  --uc-bm-height: 20px; /* Might need to adjust if the toolbar has other buttons */
  --uc-bm-padding: 4px; /* Vertical padding to be applied to bookmarks */
  --uc-autohide-toolbar-delay: 600ms; /* The toolbar is hidden after 0.6s */
  
  /* 0deg = "show" ; 90deg = "hide" ;  Set the following to control when bookmarks are shown */
  --uc-autohide-toolbar-focus-rotation: 0deg; /* urlbar is focused */
  --uc-autohide-toolbar-hover-rotation: 0deg; /* cursor is over the toolbar area */
}

:root[uidensity="touch"] #PersonalToolbar{ --uc-bm-padding: 7px }

#PersonalToolbar:not([customizing]){
  position: relative;
  margin-bottom: calc(-1px - var(--uc-bm-height) - 2 * var(--uc-bm-padding));
  transform: rotateX(90deg);
  transform-origin: top;
  transition: transform 135ms linear var(--uc-autohide-toolbar-delay) !important;
  z-index: 1;
  /* The following properties should allow the themes with trasparent toolbars to work */
  background-color: transparent !important;
  background-repeat: no-repeat,no-repeat,var(--lwt-background-tiling);
  --uc-bg-y: calc(-2 * (var(--tab-block-margin) + var(--toolbarbutton-inner-padding) + var(--toolbarbutton-outer-padding)) - var(--tab-min-height) - 16px - var(--bookmark-block-padding));
  background-position: top left,top left,var(--lwt-background-alignment,top left);
  background-position-y:top,top,var(--uc-bg-y),var(--uc-bg-y),var(--uc-bg-y);
  background-image: var(--toolbar-bgimage,linear-gradient(transparent,transparent)), linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)),var(--lwt-header-image,var(--lwt-additional-images)) !important;
}

#PlacesToolbarItems > .bookmark-item,
#OtherBookmarks,
#PersonalToolbar > #import-button{
  padding-block: var(--uc-bm-padding) !important;
}

#nav-bar:focus-within + #PersonalToolbar{
  transition-delay: 100ms !important;
  transform: rotateX(var(--uc-autohide-toolbar-focus-rotation,0));
}

#navigator-toolbox:hover > #PersonalToolbar{
  transition-delay: 100ms !important;
  transform: rotateX(var(--uc-autohide-toolbar-hover-rotation,0));
}

#navigator-toolbox:hover > #nav-bar:focus-within + #PersonalToolbar {  
  transform: rotateX(0);
}

/* Uncomment to enable compatibility for multi-row_bookmarks.css */
/* This would break buttons placed in the toolbar but that is likely not happening if you are using multi-row setup  */
/*
#PersonalToolbar:not([customizing]){
  min-height: 0 !important;
  margin-bottom: 0;
  height: 0;
  overflow-y: visible !important;
  z-index: 2;
  padding-inline: 0 !important;
}
#personal-bookmarks{
  background: inherit;
  height: min-content;
}
#PlacesToolbarDropIndicatorHolder{
  pointer-events: none !important;
}
*/

Beitragsbild: Ein Ad-hoc-Lesezeichen – auch praktisch fürs Web (Jeffrey Robb, Pixabay-Lizenz).

Kommentar verfassen