UserChrome.css anlegen?

Paivren

Hallo zusammen,

richte gerade meinen neuen Rechner mit Windows 10 ein und habe Probleme mit der Lesezeichen- Sidebar in Firefox.
Die ist mir zu breit, und ich habe den Eindruck, dass sie auf meinem alten PC deutlich schmaler war und die Websites mehr Platz hatten. Nun muss ich auf jeder zweiten Seite horizontal scrollen, wenn ich alles sehen will.

Ich habe also nach einer Möglichkeit gesucht, die Sidebar manuell zu verkleinern und habe herausgefunden, dass man dafür einen gewissen Codeschnipsel in die userChrome.css-Datei einfügen muss (welcher das ist, keine Ahnung, verschiedene Seiten geben verschiedene Antworten).
Nun gab es bei mir aber noch keinen Chrome-Ordner und erst recht keine Css-Datei.

Ich habe beides angelegt unter:
C:\Users\NAME\AppData\Local\Mozilla\Firefox\Profiles\afud0fz6.default\Chrome

Die Css-Datei ist jetzt aber ein leeres Text-Dokument und wenn ich einen der gefundenen Code-Schnipsel da einfüge, abspeichere und Firefox neustarte, hat sich nichts geändert.

Kann mir wer helfen?

Viele Grüße

Paivren

Zitronella

Völlig falscher Ort!

Eine userChrome.css erstellen und ins entsprechende Firefox Profil einfügen. --> http://mozhelp.dynvpn.de/dateien/forum/…s-erstellen.gif

2002Andreas

Hallo und Willkommen hier im Forum.

Zitat von Paivren

horizontal scrollen, wenn ich alles sehen will.

Mit diesem Code wird die Sidebar erst eingeblendet, wenn du mit der Maus den linken Rand berührst.
Kannst das ja mal testen, und die Werte wenn dann für dich anpassen.

CSS

@-moz-document url("chrome://browser/content/bookmarks/bookmarksPanel.xul"), 


url("chrome://browser/content/browser.xul"),


url("chrome://browser/content/history/history-panel.xul") {


#sidebar-search-container{
max-width:170px!important;}


.sidebar-placesTreechildren::-moz-tree-separator  {
margin: 0px 100px !important;}


#sidebar-box {
position:fixed!important;
top:115px;
bottom:12px;
width: 0px !important;
overflow-x: hidden !important;
-moz-appearance: none !important;
border: 1px solid transparent !important;
border-left: 0 !important;
opacity: 0 !important;
-moz-transition: width .2s ease-out .2s, opacity .2s ease-out .2s !important;
}




#sidebar-box:hover {
width: 170px !important; 
opacity: 1 !important;
-moz-transition: width .2s ease-out .2s, opacity .2s ease-out .2s !important;
}


#sidebar-header {
width:100%;
border: 0 !important;
}


#sidebar {
width:100%!important;
height:95%;}
}

Alles anzeigen

Einzutragen in die Erweiterung Stylish oder der userChrome.css

https://addons.mozilla.org/de/firefox/addon/2108

Sollte der Ordner chrome nicht vorhanden sein musst du ihn dir erst erstellen, und in ihm dann eine userChrome.css
Du mußt dir im Profilordner einen neuen Ordner chrome erstellen und in diesem dann eine Textdatei ( mit einem Editor ) in die du den Code kopierst, bzw. einträgst.
Hier kopierst du als erstes folgenden Text rein:

Code

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");

anschließend folgt der von dir gewünschte Code.

Dann schließt du die Datei und speicherst sie als userChrome.css ab.
Danach mußt du den Fx neu starten.

PS:
Du musst dir dazu die versteckten Dateiendungen anzeigen lassen.

Um das einzustellen geht man im Windows Explorer (wenn man einen Ordner offen hat) links oben auf

"Organisieren" -> "Ordner und Suchoptionen" -> "Ansicht"

und entfernt das Häkchen bei "Erweiterungen bei bekannten Dateitypen ausblenden"

Wo finde ich meinen Profilordner

Hilfe zu Stylish

[attachment=0]Screenshot (15).png[/attachment]

Paivren

Hallo Andreas,

vielen Dank für den ausführlichen Beitrag.
Leider klappt es noch nicht wirklich.

Ich habe die Css-Datei erstellt, unter
C:\Users\name\AppData\Local\Mozilla\Firefox\Profiles\afud0fz6.default\chrome

Die versteckte .txt endung der Datei habe ich gelöscht, sodass die Datei auch auf .css endet.
Ich habe die ersten zwei Zeilen zum Präparieren der Datei eingefügt und direkt darunter den ganzen Code für die Ansichtsänderung. Speichern --> Schließen --> Firefox Neustart.
Nichts passiert

2002Andreas

Hast du denn die Sidebar über Ansicht..Sidebar..Lesezeichen auch aktiviert?

Zitronella

Zitat von Paivren

Ich habe die Css-Datei erstellt, unter
C:\Users\name\AppData\Local\Mozilla\Firefox\Profiles\afud0fz6.default\chrome

Ich habe oben schon geschrieben dass dieser Pfad falsch ist und dir extra eine bebilderte Anleitung gegeben, wie du zum richtigen Pfad gelangst.

2002Andreas

Zitat von Zitronella

dass dieser Pfad falsch ist

Ups..das hatte ich glatt übersehen :oops:

Paivren

Danke Leute, es passt jetzt

nfoflake

bin gerade per Zufall auf diesen alten Thread gestoßen, hoffentlich bekomme ich noch eine Antwort.
Aktuelle Firefox Version Quantum 58.0.2 (64-Bit)

Ich möchte mir eine Sidebar mit dem Tab Whatsapp Web anlegen, welche bei inaktivität verschwindet und beim hovern an den linken Rand wieder erscheint. Der Code in Beitrag #3 von 2002Andreas funktioniert auch soweit, aber ich kann die Breite des Bereiches zwar beliebig erhöhen, aber ab einer Breite von 432 px wird die Sidebar nur mit einer weißen Fläche erweitert.

Zuvor hatte ich eine fixe Sidebar, welche ich beliebig von der Größe ändern konnte mit der einfachen Zeile:

CSS

#sidebar { min-width:0px !important; max-width:none !important; }

Hier hatte ich keine weiße Fläche über einer Breite von 432 px.

Was mache ich falsch?

Meine aktuelle userChrome.css lautet:

CSS

#sidebar-box {
position:fixed!important;
top:91px;
bottom:0px;
width: 0px !important;
overflow-x: hidden !important;
-moz-appearance: none !important;
border: 1px solid transparent !important;
border-left: 0 !important;
opacity: 0 !important;
-moz-transition: width .2s ease-out .2s, opacity .2s ease-out .2s !important;
}


#sidebar-box:hover {
width: 500px !important; 
opacity: 1 !important;
-moz-transition: width .2s ease-out .2s, opacity .2s ease-out .2s !important;
}


#sidebar {
width:100%!important;
height:95%;}
}

Alles anzeigen

Anbei noch ein Bild, zum einfacheren Verständnis. (nicht beirren lassen, die Chats links habe ich herausgeschnitten.

miku23 · Screen Shot 2018-02-07 at 4.13.09 PM.png

Ich habe das Thema erst gerade gelesen und wollte nur kurz anmerken dass es zumindest für die Kompaktheit auch eine Firefox eigenen Einstellung gibt, ganz ohne CSS
Öffne dazu das Hamburger Menü, klicke auf Anpassen und dann auf folgende Schaltfläche:
[attachment=0]Screen Shot 2018-02-07 at 4.13.09 PM.png[/attachment]

Ändere diese Einstellung je nach Wunsch. Vielleicht reicht dir das ja auch schon aus.

nfoflake

Zitat von miku23

Ich habe das Thema erst gerade gelesen und wollte nur kurz anmerken dass es zumindest für die Kompaktheit auch eine Firefox eigenen Einstellung gibt, ganz ohne CSS
Öffne dazu das Hamburger Menü, klicke auf Anpassen und dann auf folgende Schaltfläche:
[attachment=0]Screen Shot 2018-02-07 at 4.13.09 PM.png[/attachment]
Ändere diese Einstellung je nach Wunsch. Vielleicht reicht dir das ja auch schon aus.

Danke für die rasche Antwort, aber leider nein, das ändert nur die Größe der Abstände und Symbole, aber die max. Darstellungsbreite von 432px ändert sich hierdurch nicht.