Alte Suche mit Firefox 57

Speravir

OK, OK, aktuell ist Stand heute Fx 58.0.2.

Aris hat es doch tatsächlich geschafft, das alte/klassische Suchverhalten – Suchmaschine vorher auswählen, dann Suchbegriff eingeben, Enter, aktuell eingestellte Suchmaschine bleibt aktiviert – wiederherzustellen. Das wird solange funktionieren, solange der Firefox XBL-Bindings unterstützt. Getestet hat Aris bis inklusive Fx 60.

Entweder das gesamte Paket CustomCSSforFx herunterladen (siehe auf Releases-Seite) und dort die Regel aktivieren oder wenigstens oldsearch.css und oldsearch_fx57.xml. Wer sich die Dateien separat lädt, muss den Pfad der XML-Datei anpassen. Alles ist als experimentell gekennzeichnet und Erweiterungen oder Bugfixes sind möglich (gut, das stimmt immer).

foto59

Das ist das einzige was meine Frau vermisst, aber meine Englischkenntnisse sind leider nicht so toll.
Kann mir jemand den einfachsten Weg erklären wie ich das mit den 2 Dateien hin bekomme?

AngelOfDarkness

Also ich habe es eben mal in einem neuen frischen Profil unter 58.0.2 ausprobiert. Allerdings irgendwie nicht sehr erfolgreich.
Ich habe die oldsearch.css per @import "css/oldsearch.css" in die userChrome.css geholt. Die Datei oldsearch_fx57.xml im Ordner /chrome/xml gespeichert. (/xml muss ggf. neu angelegt werden). Zudem noch die drei Grafiken, die in der oldsearch.css angegeben sind, noch unter /chrome/image/ (ggf. auch noch neu anlegen) gespeichert. Nach einem Neustart war keine Grafik der Suchleiste zu sehen unter Anpassen. Man kann das Teil zwar verschieben in eine Toolbar aber auch dort dann keine Grafik zu sehen.

Speravir

Zitat von foto59

Das ist das einzige was meine Frau vermisst, aber meine Englischkenntnisse sind leider nicht so toll.
Kann mir jemand den einfachsten Weg erklären wie ich das mit den 2 Dateien hin bekomme?

Ich hatte noch die Bilddateien vergessen, allerdings könnte man die vermutlich auch weglassen (ungetestet), wobei dann die CSS-Regeln anzupassen wären.
Ein chrome-Verzeichnis mit userChrome.css existiert schon?

Zitat von AngelOfDarkness

Also ich habe es eben mal in einem neuen frischen Profil unter 58.0.2 ausprobiert. Allerdings irgendwie nicht sehr erfolgreich.
Ich habe die oldsearch.css per @import "css/oldsearch.css" in die userChrome.css geholt. Die Datei oldsearch_fx57.xml im Ordner /chrome/xml gespeichert. (/xml muss ggf. neu angelegt werden). Zudem noch die drei Grafiken, die in der oldsearch.css angegeben sind, noch unter /chrome/image/ (ggf. auch noch neu anlegen) gespeichert. Nach einem Neustart war keine Grafik der Suchleiste zu sehen unter Anpassen. Man kann das Teil zwar verschieben in eine Toolbar aber auch dort dann keine Grafik zu sehen.

Hmm, bei mir funktioniert es, aber ich nutze das gesamte Paket. Die Pfade innerhalb der CSS-Datei hast Du angepasst?

ArisCTR

Ich empfehle jedem mit dem vollständigen Paket zu arbeiten. Die Pfade sind alle so angepasst, dass intern auf korrekte Dateien verwiesen wird.

Falls jemand nur die "Alte Suche" haben will, werden diese Dateien und Pfadstruktur benötigt:

oldsearch.css -> chrome/css/generalui/oldsearch.css
oldsearch_fx57.xml -> /chrome/xml/oldsearch_fx57.xml
searchbar-dropdown-arrow.png -> /chrome/image/searchbar-dropdown-arrow.png
search-glass.png -> /chrome/image/search-glass.png
search-glass32.png -> /chrome/image/search-glass32.png

Code

https://raw.githubusercontent.com/Aris-t2/CustomCSSforFx/master/classic/css/generalui/oldsearch.css
https://raw.githubusercontent.com/Aris-t2/CustomCSSforFx/master/classic/xml/oldsearch_fx57.xml
https://raw.githubusercontent.com/Aris-t2/CustomCSSforFx/master/classic/image/searchbar-dropdown-arrow.png
https://raw.githubusercontent.com/Aris-t2/CustomCSSforFx/master/classic/image/search-glass.png
https://raw.githubusercontent.com/Aris-t2/CustomCSSforFx/master/classic/image/search-glass32.png

Das Weglassen der Bilder sorgt dafür, dass der Dropmarker bzw. die Aufklappmenüanzeige fehlt und der Standardpfeil anstatt der "Lupe" angezeigt wird.

Die userChrome.css muss bei der o.g. Vorgehensweise die oldsearch.css importieren. Das geschieht mit diesem Befehl:

Code

@import url(./css/generalui/oldsearch.css);

Alternativ kann der Code aus der oldsearch.css direkt in die userChrome.css kopiert werden. Alle anderen Dateien kommen dann auch in das Verzeichnis der userChrome.css.
Dann müssen nur die Pfade im Code angepasst werden:

CSS

-moz-binding: url("./../../xml/oldsearch_fx57.xml#searchbar") !important; ->
-moz-binding: url("./oldsearch_fx57.xml#searchbar") !important;


-moz-binding: url("./../../xml/oldsearch_fx57.xml#searchbar-textbox") !important; -> 
-moz-binding: url("./oldsearch_fx57.xml#searchbar-textbox") !important;


list-style-image: url("./../../image/searchbar-dropdown-arrow.png") !important; ->
list-style-image: url("./image/searchbar-dropdown-arrow.png") !important;


list-style-image: url("./../../image/search-glass32.png") !important; ->
list-style-image: url("./image/search-glass32.png") !important;

Alles anzeigen

-----------------------

Fertiges Paket: alte_suche.zip

Code

https://drive.google.com/file/d/1rsdmMQIzR4XVpl0fiVImoYDu9XrlkaNb/view

robotest

Kann man die ein bisschen breiter machen?

foto59

Zitat von ArisCTR
Fertiges Paket: alte_suche.zip
Code
https://drive.google.com/file/d/1rsdmMQIzR4XVpl0fiVImoYDu9XrlkaNb/view

Ein Dank von meiner Frau, eventuell werde ich es auch wieder verwenden :klasse:

ArisCTR

Zitat von robotest

Kann man die ein bisschen breiter machen?

CSS

/* Suchmaschinen */
#searchbar .searchbar-popup {
  min-width: 400px !important;
  max-width: 400px !important;
}


/* Suchvorschläge */
#PopupSearchAutoComplete {
  min-width: 500px !important;
  max-width: 500px !important;
}

Alles anzeigen

robotest

ArisCTR Danke schön, habe den Code in dle Chrom Datei kopiert, funktioniert leider nicht.

ArisCTR

Der Code gehört ans Ende der userChrome.css und funktioniert sowohl mit der alten Suche als auch mit der Standardsuche.

Ansonsten wird die Breite des Popups durch die Breite der Suchleiste bestimmt.

Die userChrome.css des fertigen Pakets würde dann so aussehen:

CSS

searchbar {
  -moz-binding: url("./alte_suche/oldsearch_fx57.xml#searchbar") !important;
}


searchbar .searchbar-textbox {
  -moz-binding: url("./alte_suche/oldsearch_fx57.xml#searchbar-textbox") !important;
}


.searchbar-engine-button {
  -moz-appearance: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  -moz-padding-start: 4px !important;
  -moz-padding-end: 2px !important;
  -moz-box-align: center !important;
  background: none !important;
  border: none !important;
}


.searchbar-engine-image {
  list-style-image: unset !important;
}


#navigator-toolbox #nav-bar  .searchbar-engine-button {
  min-height: unset !important;
}


.searchbar-engine-button > .button-box {
  -moz-appearance: none !important;
  padding: 0 !important;
  border: 0 !important;
}


.searchbar-dropmarker-image {
  list-style-image: url("./alte_suche/searchbar-dropdown-arrow.png") !important;
  -moz-image-region: rect(0, 13px, 11px, 0) !important;
}


.searchbar-engine-button[open="true"] > .searchbar-dropmarker-image {
  -moz-image-region: rect(0, 26px, 11px, 13px) !important;
}


.search-go-button {
  display: block !important;
  list-style-image: url("./alte_suche/search-glass.png") !important;
  -moz-image-region: rect(0px, 16px, 16px, 0) !important;
  min-width: 0 !important;
  min-height: 0 !important;
  width: 16px !important;
  height: 16px !important;
}


#main-window[uidensity=compact] .search-go-button {
  margin: 4px 0px !important;
}


#main-window:not([uidensity=compact]):not([uidensity=touch]) .search-go-button {
  margin: 6px 0px !important;
}


#main-window[uidensity=touch] .search-go-button {
  margin: 8px 0px !important;
}


.search-go-button:hover {
  -moz-image-region: rect(0px, 32px, 16px, 16px) !important;
}


.search-go-button:active {
  -moz-image-region: rect(0px, 48px, 16px, 32px) !important;
}


.search-go-button:-moz-locale-dir(rtl) {
  transform: scaleX(-1);
}


@media (min-resolution: 1.1dppx) {
	.search-go-button {
	  list-style-image: url("./alte_suche/search-glass32.png") !important;
	  -moz-image-region: rect(0px, 32px, 32px, 0) !important;
	}


	.search-go-button:hover {
	  -moz-image-region: rect(0px, 64px, 32px, 32px) !important;
	}


	.search-go-button:active {
	  -moz-image-region: rect(0px, 96px, 32px, 64px) !important;
	}
}


.searchbar-engine-menuitem[selected="true"] > .menu-iconic-text {
  font-weight: bold !important;
}


.searchbar-popup {
  -moz-margin-start: -1px !important;
}


#urlbar-search-footer{
  display: none !important;
}


#PopupSearchAutoComplete .tree-scrollbar,
#PopupSearchAutoComplete .search-one-offs,
#PopupSearchAutoComplete .search-panel-header{
  display: none !important;
}
 
#PopupSearchAutoComplete {
  min-width: unset !important;
  margin-inline-start: unset !important;
}


#PopupSearchAutoComplete .search-panel-tree > .autocomplete-treebody::-moz-tree-image(fromhistory),
#PopupSearchAutoComplete .search-panel-tree > .autocomplete-treebody::-moz-tree-image(fromhistory, selected) {
  list-style-image: unset !important;
}


#PopupSearchAutoComplete .search-panel-tree > .autocomplete-treebody::-moz-tree-image {
  padding-inline-start: unset !important;
  width: unset !important;
  height: unset !important;;
}


#PopupSearchAutoComplete .search-panel-tree > .autocomplete-treebody {
  margin-bottom: -4px !important;
}


/* Suchmaschinen */
#searchbar .searchbar-popup {
  min-width: 400px !important;
  max-width: 400px !important;
}


/* Suchvorschläge */
#PopupSearchAutoComplete {
  min-width: 500px !important;
  max-width: 500px !important;
}

Alles anzeigen

robotest

ArisCTR Alles klar! Danke!

AngelOfDarkness

Also bei mir klappt es nun auch. Allerdings nur, wenn ich den "Ordner "alte_suche" in den Ordner der eigentlichen css liegen habe.
Sprich ../chrome/css/alte_suche. Habe ich dagegen den Ordner in ../chrome liegen passiert nix. Unter ../chrome liegt bei mir nur die userChrome.css mit den Imports von ../chrome/css/..
Nutze ich dagegen, wie vorher, die Ordner ../chrome/image/ und ../chrome/xml/ klappt es nicht. Wie muss der Pfad in der css denn angepasst werden ? Ausserdem kann man ohne svg-Grafiken die Farbe der png ändern ?

ArisCTR

Das Paket "alte suche" ist nur für diejenigen, die das Gesamtpaket "CustomCSSforFx" nicht verwenden. Alle anderen sollten die aktuellste Version des Gesamtpaketes nutzen. Dann muss man auch nicht mit Pfaden experimentieren.
Ansonsten steht es in Beitrag 5 wie man die Dateien selbst zusammenstellen kann.

Die Farbe der Bilder kann man nicht anpassen, aber du kannst die Bilder durch eigene ersetzten, nachdem du sie in einem Bildbearbeitungsprogramm angepasst hast.

milupo

Der Pfad mit alte_suche ist nur für die, die nicht das komplette Paket verwenden wollen, siehe Beiträge #5 und #10. Für die gibt es den Ordner alte_suche und natürlich sind die Pfade auch mit alte_suche. Wenn du das komplette Paket verwendest, musst du in der userChrome.css bei den entsprechenden Zeilen erst die Kommentarzeichen entfernen. Nicht alle CSS-Tweaks sind von vornherein aktiviert.

AngelOfDarkness

Speravir

Zitat von Speravir

...Die Pfade innerhalb der CSS-Datei hast Du angepasst?

Deswegen habe ich ja gefragt, wie die Pfade für den beschriebenen Aufbau sind

../chrome/css/ --> alteSuche.css
../chrome/image/ --> hier die png
../chrome/xml/ --> oldsearch_fx57.xml

../chrome/userChrome.css --> als reine Import-css für .css-Dateien

ArisCTR

Okay.. dann muss ich mir irgendwie was für die Grafik-Dateien ausdenken bzw. finden. Diese kleinen Grafiken mit den unterschiedlichen Farbpixeln umzufärben wird echt haarig Vor allem weil sie ja zwei bis drei Symbole beinhalten ...

Eines was ich noch sagen muss ... Dir einen super herzlichen Dank für deine Arbeit :klasse:

Speravir

Zitat von AngelOfDarkness

Deswegen habe ich ja gefragt, wie die Pfade für den beschriebenen Aufbau sind
../chrome/css/ --> alteSuche.css
../chrome/image/ --> hier die png
../chrome/xml/ --> oldsearch_fx57.xml
../chrome/userChrome.css --> als reine Import-css für .css-Dateien

In die userChrome.css, die ja selbst in chrome liegt, kommt

Code

@import url("./css/alteSuche.css");

Das ./ steht für das aktuelle Verzeichnis plus Pfadseparator, also in diesem Falle für chrome/. Man könnte es übrigens auch weglassen, wenn man das für verwirrender mit als ohne hält.

In der alteSuche.css müssen die Pfade dann so aussehen (bearbeitete Kopie von Beitrag #5

CSS

-moz-binding: url("./../xml/oldsearch_fx57.xml#searchbar") !important;


-moz-binding: url("./../xml/oldsearch_fx57.xml#searchbar-textbox") !important;


list-style-image: url("./../image/searchbar-dropdown-arrow.png") !important;


list-style-image: url("./../image/search-glass32.png") !important;

Es fehlt noch

CSS

list-style-image: url("./../image/search-glass.png") !important;

Zitat von AngelOfDarkness

Okay.. dann muss ich mir irgendwie was für die Grafik-Dateien ausdenken bzw. finden. Diese kleinen Grafiken mit den unterschiedlichen Farbpixeln umzufärben wird echt haarig Vor allem weil sie ja zwei bis drei Symbole beinhalten ...

Wie sollen die Bilder denn aussehen, rosarot?

ArisCTR

Probleme mit der aktuellen Firefox 60 Version werden mit dem letzten Update behoben (auch wenn die Datei "oldsearch_fx57.xml" heißt ;-)).
https://github.com/Aris-t2/Custom…l/oldsearch.xml

Edit
Dateipfad angepasst.

ArisCTR

Hier ist ein neues Komplettpaket. Diesmal werden keine Bilddateien benötigt, da die Bilder der internen Standardsuche als Basis verwendet werden (und ja man kann auch die Farbe der Lupe intern im CSS Code anpassen :mrgreen:).

Code

https://drive.google.com/file/d/1oQWqjoeT-L8hTqX4AhBMk2hNPPHvuQcG/view?usp=sharing

Änderungen
- Wegfall der alten Bilder (-> bessere Darstellung in HiDPI)
- Überarbeitung der XBL-Funktionsweise (-> kleinere Datei, weniger Code)
- Unterstützung von vorhandenen sowie eigenen optionalen about:config Einstellungen
- Support für aktuelle Firefox 60 Nightly

Optionale Einstellungen
Nicht vorhandene Einstellungen können selbst angelegt werden:
about:config > Rechtsklick auf einen beliebigen Eintrag > Neu
> Integer (für Zahlenwerte wie browser.oldsearch.customwidthvalue )
> Boolean (für true/false [Ja/Nein] Werte)

about:config > browser.search.openintab: öffnet Suche in neuem oder aktuellen Tab
about:config > browser.search.suggest.enabled: Vorschläge anzeigen
about:config > browser.oldsearch.customwidth: eigenen Breitenwert aktivieren
about:config > browser.oldsearch.customwidthvalue: eigener Breitenwert
about:config > browser.oldsearch.clearinput: Suchbox nach der Suche leeren
about:config > browser.oldsearch.reverttodefault: zur ersten Suchmaschine zurückkehren
Shift + Klick auf das Suchglas: öffnet Suche in einem neuen Fenster
Strg/Cmd + Klick auf das Suchglas: öffnet Suche in einem neuen Tab

Farbe des Suchglases (Werte müssen angepasst werden)

CSS

.search-go-button {
  fill: #3683ba !important;
}
.search-go-button:hover {
  fill: #1d518c !important;
}
.search-go-button:active {
  fill: #00095d !important;
}

Speravir

Klasse! Ich hebe alle meine drei Daumen :wink: … :klasse::klasse::klasse:

Zitat von ArisCTR

Optionale Einstellungen
Nicht vorhandene Einstellungen können selbst angelegt werden:
about:config > Rechtsklick auf einen beliebigen Eintrag > Neu
> Integer (für Zahlenwerte wie browser.oldsearch.customwidthvalue )
> Boolean (für true/false [Ja/Nein] Werte)

Man kann sich diese Einstellungen auch einer Datei user.js abspeichern, die direkt in das Profilverzeichnis gehört, also dort, wo sich die prefs.js befindet (die man nicht bearbeiten sollte!).

Das würde dann so aussehen:

Code

user_pref("browser.search.openintab", true);// öffnet Suche in neuem oder aktuellen Tab
user_pref("browser.search.suggest.enabled", true);// Suchvorschläge anzeigen
user_pref("browser.oldsearch.customwidth", true);// eigenen Breitenwert aktivieren
user_pref("browser.oldsearch.customwidthvalue", 300);//eigener Breitenwert, individuell anpassen
user_pref("browser.oldsearch.clearinput", true);// Suchbox nach der Suche leeren
user_pref("browser.oldsearch.reverttodefault", true);// zur ersten Suchmaschine zurückkehren

Beim nächsten Browserneustart würden diese Einstellungen in die prefs.js übertragen werden.

ArisCTR

Alte Suche (v3)

Code

https://drive.google.com/file/d/12o7Bdk09gw5YsjquAUtgPl16VZU05iUO/view?usp=sharing

Änderungen
Diese Einstellungen werden unter about:config automatisch angelegt
- browser.oldsearch.customwidth
- browser.oldsearch.customwidthvalue
- browser.oldsearch.clearinput
- browser.oldsearch.reverttodefault
Die Einträge werden auch nur angezeigt so lange die alte Suche verwendet wird. D.h. werden die Standardwerte dieser Einträge nicht geändert, bleibt nach dem Entfernen der alten Suche browser.oldsearch.* auch nicht unter about:config gespeichert.

Diese Einstellungen waren bereits unter about:config abrufbar, da sie Teil der Standardeinstellungen des Browsers sind.
- browser.search.openintab
- browser.search.suggest.enabled