Suchen
Jeder Besucher ist ein potenzieller Kunde, der etwas sucht Eine schwache, versteckte oder hässliche Suchleiste unterbricht diese Reise Master Addons Search Element bietet Ihnen zwei leistungsstarke Möglichkeiten, die Suche zu integrieren: ein klassisches Inline-Formular oder ein Click-to-open-Icon-Popup Platzieren Sie es überall an Ihrer Kopfzeile, Seitenleiste, Hero-Abschnitt und entwerfen Sie dann jedes Pixel. Gestalten Sie das Formular, die Schaltfläche, das Symbol und sogar die Nachrichtenübermittlung des Popups.
Suchformular und Symbol-Popup
Nicht jedes Design hat Platz für eine vollständige Suchleiste Deshalb geben wir Ihnen zwei verschiedene Typen Wählen Sie “Form” für ein traditionelles, immer sichtbares Eingabefeld und eine Taste Perfekt für Seitenleisten oder unter dem Helden Oder wählen Sie “Icon” für eine schlanke, platzsparende Lupe, die beim Klicken ein elegantes Popup-Such-Overlay öffnet, das Ihr Design sauber hält, bis der Benutzer es benötigt Sie steuern den Button Text für Formulare und die exakte Icon für den Popup-Trigger.
- Formtyp: Ein standardmäßiges, immer sichtbares Suchformular mit einer anpassbaren Einsendetaste (als Text oder Symbol).
- Symbol-/Bewöhnungstyp: Eine stilvolle Symbolschaltfläche, die ein vollständiges Popup-Suchformular auslöst und so wichtigen Header-Speicherplatz spart.
- Symbolbibliothek: Wählen Sie ein beliebiges Lupensymbol aus der umfangreichen Symbolbibliothek aus, das zum Stil Ihrer Website passt.
Vollständiges Formular- und Eingabefeld-Styling
Machen Sie das Suchformular zu einem natürlichen Teil Ihres Layouts Entwerfen Sie den gesamten Formularcontainer: Legen Sie Hintergrund, Breite, Rand, Polsterung fest und geben Sie ihm Randradius und Box Shadow. Anschließend gestalten Sie das Eingabefeld selbst. Steuern Sie seine Typografie, Farbe, Hintergrund, Grenze und interne Polsterung. Sie können sogar den Fokusstatus (wenn ein Benutzer einklickt) mit einer anderen Randfarbe entwerfen. Dadurch wird sichergestellt, dass Ihre Suchleiste Premium aussieht und sich auch so anfühlt, nicht wie eine Browservorgabe.
- Behälterdesign: Gestalten Sie die Box des Formulars mit Hintergrund, Polsterung, Rändern und Schatten.
- Eingabefeldsteuerung: Passen Sie die Farbe, Typografie, Breite und den Randradius des Textfelds an.
- Erweiterte Zustände: Definieren Sie eine eindeutige Grenzfarbe für den fokussierten Zustand und heben Sie das aktive Feld hervor.
Symboldesign und Popup-Nachrichten
Für den Typ Icon/Popup ist das Icon selbst ein Button Style it to perfection Passe seine Größe, Farbe und die Auffüllung & Margin drumherum an Entwerfe dann das Popup, das erscheint Passe den Eingabetext-Platzhalter an (wie “Start tipping...”) und füge entscheidend eine hilfreiche Beschreibung hinzu (z. B. “Hit enter to search oder ESC to close”). Dieser Text führt Benutzer an, verbessert die Benutzerfreundlichkeit und schafft ein ausgefeiltes, professionelles interaktives Erlebnis.
- Symbol-Styling: Ändern Sie die Symbolfarbe und -größe und passen Sie den umgebenden Raum mit Symbolrand und Polsterung an.
- Smart Popup Text: Legen Sie benutzerfreundlichen Platzhaltertext im Suchfeld des Popups fest.
- Popup-Anweisungen: Fügen Sie eine Beschreibungszeile unter der Eingabe hinzu, um zu erklären, wie Sie das Popup verwenden (suchen/schließen).
Häufig gestellte Fragen zur Suche
Funktioniert diese Suche mit der Standard-Suchergebnisseite meines Themes?
Ja, das sollte Es stellt dieses Element das Front-End-Suchformular zur Verfügung, Wenn ein Benutzer eine Abfrage einreicht, wird es Ihre WordPress (oder WooCommerce) Standard-Suchfunktionalität verwenden und Ergebnisse auf der Such-PhP-Vorlagenseite Ihres Themes anzeigen. Es ersetzt nicht die Suchlogik, sondern lässt das Eingabeformular einfach fantastisch aussehen.
Kann ich sowohl eine Formularsuche in der Seitenleiste als auch eine Symbolsuche in der Kopfzeile haben?
Absolut. Du kannst mehrere Suchelemente auf der gleichen Seite oder Seite verwenden, jedes ist unabhängig konfiguriert und gestylt, Du kannst also ein großes Formular in deiner Blog-Seitenleiste und ein minimales Icon in deinem Header haben, jedes mit seinen eigenen Einstellungen.
Ist das Such-Popup mobilfreundlich?
Ja. Das Popup ist so konzipiert, dass es responsive ist Es wird sich normalerweise als zentriertes Overlay öffnen, das den größten Teil des mobilen Bildschirms abdeckt, wobei das Eingabefeld und die Beschreibung gut lesbar sind Der Symbolauslöser skaliert auch für Touch-Geräte entsprechend.
Kann ich das Lupensymbol in etwas anderes ändern, wie ein "Q" für Zitat?
Sie können ein beliebiges Icon aus der integrierten Icon-Bibliothek wählen (wie FontAwesome) Während eine Lupe Standard ist, könnten Sie technisch ein anderes Icon verwenden, für ein universelles Benutzerverständnis empfehlen wir jedoch dringend, bei einem anerkannten Suchsymbol (Lupe) zu bleiben.
Trendige Elementor-Widgets und -Erweiterungen
Erstellen Sie anspruchsvolle Websites in kürzerer Zeit.
Glasmorphie
Container-extras
Muster
Post-/Seitenduplikator
