ich möchte gerne das Verhalten des Suchfeldes im XS-Status (Phone) auf den S Status (PhoneLandscape) ausweiten, also dass nur ein Such-Icon angezeigt wird, auf das man klicken kann, damit darunter das Sucheingabefeld geöffnet wird.
Das müsste doch eigentlich recht einfach gehen…
Meine erster Versuch, die entsprechenden Mediaqueries für den PhoneLandscapeViewport in meiner LESS-Datei header.tpl zu deaktivieren, brachte mich nicht zum Ziel: Der Search-Toggle-Button ist zwar da, aber ein Klick auf ihn führt zu nichts. Da muss also noch Javascript im Spiel sein:
Zweiter Versuch: Ich habe mir die jquery.search.js angeschaut, finde da aber keine Zeile oder Einstellung, die ausschließlich auf den XS-Status reagiert.
Dritter Versuch: Ich habe in der jquery.shopware-responsive.js gesucht, ob das Plugin eventuell nur in bestimmten Status geladen wird, aber nein - es wird unabhängig vom Viewport immer geladen.
Nun bin ich am Ende mit meinen Ideen… Kann mir jemand von euch einen Tipp geben? Habe ich etwas entscheidendes übersehen?
Vielen Dank mbus, für den Hinweis, jetzt komme ich weiter.
Ich dachte, dass die Status Einstellungen oben in den Parametern stehen und nicht direkt hard codiert sind. Deshalb habe ich soweit unten gar nicht mehr geschaut.
In Zukunft nutze ich dann mal die Suchfunktion im Editor … soll ja helfen.
Dein Vorgehen ist grundsätzlich richtig, deshalb kann ich nicht genau sehen, woran es liegt. Check mal folgendes:
Cache gelöscht, neu kompiliert?
Hast Du die Status an allen drei Stellen verändert? Sie müssen in der registerListener-Funktion hinzugefügt werden, in der showresult-Funktion sowie der onClickSearchEntry-Funktion rausgenommen werden.
Gib Deiner modifizierten Datei mal einen anderen Namen und binde diese in Deine Theme.php ein.
Habe alles wie in deinen Punkten geschrieben gemacht. 1. 3. 4. Alles versucht. Leider ohne Erfolg.
Was meinst du mit 2. " müssen rausgenommen werden?"
StateManager.registerListener({
state: 'l',
enter: function () {
if (opts.activeOnStart) {
me.openMobileSearch();
}
},
exit: function () {
me.closeMobileSearch();
}
});
if (!StateManager.isCurrentState('l') ) {
$body.on(me.getEventName('click touchstart'), $.proxy(me.onClickBody, me));
}
$.publish('plugin/swSearch/onClickSearchEntry', [me, event]);
if (!StateManager.isCurrentState('l') ) {
return;
}
Selbst wenn ich alle ‘xs’ in der .js in ‘l’ umbenenne (3 an der Zahl) ändert sich nichts am verhalten. Mobile Suche kommt immernoch erst bei ‘xs’. Sieht irgendwie so aus als würde es die .js gar nicht annehmen und immer aus dem original-template nehmen. Muss ich die alte jquery.search.js irgendwie überschreiben oder ähnliches?
In der Theme.php passt eigentlich alles… Hast du noch einen Rat?
dann noch einmal im Detail: In der Javascript Datei gibt es drei Funktionen:
Die erste registriert für die kleinen Viewports die Mobilen Funktionen: Da musst Du auch die großen Vieports ergänzen
// Hier wurde S bis XL ergänzt
StateManager.registerListener([
{
state: ['xs', 's', 'm', 'l', 'xl'],
enter: function () {
if (opts.activeOnStart) {
me.openMobileSearch();
}
},
exit: function () {
me.closeMobileSearch();
}
}
]);
Die zweite Funktion löscht die Suchergebnisse und sendet die AJAX Antwort. Den Ausschluss der kleinen Viewports durch die if-Abfrage musst Du entfernen:
Da muss also noch Javascript im Spiel sein: