Internet

Firefox Mehrzeilige Lesezeichen-Symbolleiste




In die Lesezeichensymbolleiste passt ja nur eine begrenzte Anzahl von Lesezeichen bzw. Lesezeichenordnern.

Jedes weitere erstellte Lesezeichen bzw. jeder weitere Lesezeichenordner wird dann in ein Überhangmenü verschoben, welches man nach Klick auf den Doppelpfeil >> öffnen kann.

Wem das zu umständlich ist, der kann sich die Lesezeichensymbolleiste auch mehrzeilig anzeigen lassen.
Die zweite Leiste wird erst automatisch geöffnet, wenn in der ersten Leiste kein Platz mehr für weitere Lesezeichen vorhanden ist.

Erforderlich dafür ist ein CSS Code für die userChrome.css Datei.

Bis zur Firefox Version 56 war es möglich einige Funktionen durch diverse Erweiterungen zu ändern.

Das Eine oder Andere ist seit der Firefox Version 57 nicht mehr möglich, da Mozilla dafür (zumindest noch) keine Schnittstelle mehr zur Verfügung stellt.

Aus diesem Grund muss man jetzt diese optischen Änderungen am Firefox mit einer userChrome.css Datei erstellen.

Dazu bedarf es allerdings erst einer kleineren Vorbereitung, die ich hier schon mal erklärt hatte.

userChrome.css erstellen

Und hier mal eine Erklärung wie man sich die Lesezeichensymbolleiste mehrzeilig anzeigen lassen kann.

Dazu gehen wir als erstes in den Profilordner vom Firefox, und öffnen den dort selber angelegten Ordner chrome.

Dann im Ordner chrome die userChrome.css Datei öffnen.

In diese Datei tragen wir nun folgenden CSS Codes ein:

Da der CSS Code zu lang ist, habe ich ihn mal in diese Box eingefügt. Zum öffnen der Box bitte auf den grauen Balken klicken.

CSS - Code

/* Lesezeichensymbolleiste mehrzeilig */ #personal-bookmarks { display: block; } #personal-bookmarks #PlacesToolbar { display: block; min-height: 0px; overflow-x: hidden; overflow-y: auto; max-height: 999px; } #personal-bookmarks #PlacesToolbar > hbox { display: -moz-stack !important; left: 0px; right: 0px; width: 100%; } #personal-bookmarks #PlacesToolbar #PlacesToolbarItems { overflow-x: visible; overflow-y: visible; } #personal-bookmarks #PlacesToolbar #PlacesToolbarItems > box { display: block; } #personal-bookmarks #PlacesToolbar > .bookmark-item{ visibility: visible !important; } #personal-bookmarks #PlacesToolbar .chevron{ display: none; } #personal-bookmarks #PlacesToolbar > hbox > hbox{ overflow-x: hidden; overflow-y: hidden; } #personal-bookmarks #PlacesToolbar #PlacesToolbarDropIndicator[collapsed=“true“], #personal-bookmarks #PlacesToolbar #PlacesToolbarDropIndicator{ display: none; } #personal-bookmarks #PlacesToolbar toolbarbutton.bookmark-item{ padding-top: 2px; padding-bottom: 2px; margin-left: -4px !important; padding-right: 9.5px !important; } #personal-bookmarks #PlacesToolbar toolbarbutton.bookmark-item:hover:active:not([disabled=“true“]), #personal-bookmarks #PlacesToolbar toolbarbutton.bookmark-item[open=“true“] { padding-top: 2px !important; padding-bottom: 2px !important; -moz-padding-start: 4px; -moz-padding-end: 2px; } #personal-bookmarks #PlacesToolbar toolbarseparator{ -moz-appearance: none !important; visibility: visible !important; display: inline; text-shadow: none !important; border-left: 3px solid ThreeDShadow !important; border-right: 3px solid ThreeDHighlight !important; vertical-align: middle; } #personal-bookmarks toolbarbutton.bookmark-item[dragover][open]{ -moz-appearance: toolbarbutton; } #navigator-toolbox toolbar:not(#nav-bar):not(#toolbar-menubar):not(#TabsToolbar) { max-height: 999px !important; }

So sieht der Code dann in der userChrome.css Datei aus:

Damit man später noch genau weiß was der jeweilige Code bedeutet, sollte man sich über dem CSS Code einen aussagekräftigen Hinweis erstellen.

Dazu schreibt man vor dem Text erst einen Slash und einen Stern /* dann die Beschreibung der Funktion…und als Abschluss schreibt man diesmal erst den Stern und dann das Slashzeichen */

Die Zeichen vorher und nachher bedeuten, dass der Text auskommentiert ist, und somit keinen Einfluss auf den CSS Code bzw. seine Funktion hat.

Dann die userChrome.css Datei schließen und speichern, und den Firefox neu starten, damit der Code wirksam wird.

Und so sieht das dann aus mit zum Beispiel zwei Reihen der Lesezeichensymbolleiste:

 

Kindle Paperwhite eReader, 15 cm (6 Zoll) hochauflösendes Display (300 ppi) mit integrierter Beleuchtung, WLAN (Schwarz) - mit Spezialangeboten
10327 Bewertungen
Unverb. Preisempf.: € 119,99 Du sparst: € 20,00 (17%) Prime Preis: € 99,99 Jetzt auf Amazon kaufen*
Preis inkl. MwSt., zzgl. Versandkosten

Mehr anzeigen

2 Comments

  1. Hallo,

    leider ändert sich durch die mehrzeilige Symbolleiste das Aussehen der Trennlinien, die man zwischen die Lesezeichen einfügen kann. Aus einer dünnen schwarzen Linie wird eine viel dickere Doppel-Linie.
    Gibt es dafür eine Lösung?

    MFG MK

    1. Hallo @MK…

      Im unteren Teil vom Code befindet sich dieser Eintrag:

      #personal-bookmarks #PlacesToolbar toolbarseparator{ -moz-appearance: none !important; visibility: visible !important; display: inline; text-shadow: none !important; border-left: 3px solid ThreeDShadow !important; border-right: 3px solid ThreeDHighlight !important; vertical-align: middle; }

      Den bitte mal entfernen und diesen dafür einfügen, und dann testen.

      #personal-bookmarks #PlacesToolbar toolbarseparator{ -moz-appearance: none !important; visibility: visible !important; display: inline; text-shadow: none !important; border-left: 2px solid ThreeDShadow !important;
      margin-right:3px!important;}

      Evtl. die beiden Werte noch selber etwas anpassen dann.

      MfG
      Andreas

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.