Wie erhalte ich den Shopify-Suchcode in 5 Minuten?

Rate this article

Share this article

Hier ist der Shopify-Suchcode zum Hinzufügen einer Suchleiste zu Ihrem Shopify-Shop. Geben Sie Ihren API-Schlüssel ein, indem Sie sich mit Ihrem Google-Konto beim Expertrec-Dashboard anmelden. (Es ist alles KOSTENLOS)

<Skript>
(Funktion() {
var id = ‘Your_API_Key’;
var ci_search = document.createElement(‘script’);
ci_search.type = ‘text/javascript’;
ci_search.async = true;
ci_search.src = ‘https://cse.expertrec.com/api/js/ci_common.js?id=’ + id;
var s = document.getElementsByTagName(‘script’)[0];
s.parentNode.insertBefore(ci_search, s);
})();
</script>

So erhalten Sie den Shopify-Suchcode kostenlos: 3 Möglichkeiten erklärt

Der Shopify-Suchcode folgt dem Finden des Codes. Dazu können Sie den Suchbefehl ganz einfach ausführen, indem Sie auf „Befehl + F“ auf dem Mac oder „STRG + F“ auf Windows klicken. Wenn Sie oben eine Suchleiste anzeigen, können Sie genau die gesuchte Suchanfrage finden. Aber Tatsache ist: Wir alle sind keine Programmierer. Lassen Sie uns also mit dem Hinzufügen eines Shopify-Suchcodes beginnen, indem wir drei Methoden verwenden:

  • Verwenden der Expertrec Smart Search App
  • Kopieren von Code aus dem Expertrec-Dashboard
  • Verwenden der benutzerdefinierten Suche von Google

1. Verwenden der intelligenten Suchleiste von Expertrec

Die Expertrec Smart Search App ist im Shopify App Store gelistet. Sie müssen lediglich die Expertrec Shopify Smart Search App installieren, indem Sie der folgenden Methode folgen.

ich. Klicken Sie auf https://apps.shopify.com/expertrec-smart-search-bar, um die Suchleiste zu installieren. Oder Sie gehen zum Shopify App Store und geben Expertrec Smart Search Bar ein.

ii. Sobald die Installation abgeschlossen ist, müssen Sie die Erweiterung aktivieren. Klicken Sie dazu wie unten gezeigt auf die App „Installieren“.

iii. Expertrec Smart Search Bar bietet Ihnen eine 14-tägige kostenlose Testversion. Das Beste daran ist, dass Sie keine Kreditkarte benötigen, um auf die kostenlose Testversion zuzugreifen. Klicken Sie einfach auf „Kostenlose Testversion starten“ und Sie gelangen zum Expertrec-Dashboard.

iv. Stellen Sie sicher, dass der Expertrec Shopify-Suchcode aktiviert ist. Es wird angezeigt, dass Expertrec Search auf Ihrer Website aktiv ist.

v. Herzlichen Glückwunsch! Sie haben den Shopify-Suchcode installiert, ohne überhaupt etwas zu programmieren. Dies ist der einfachste und beste Weg, eine Shopify-Suchleiste zu installieren.

PS: Die Expertrec-Suchleiste verfügt über eine fantastische Anpassbarkeit der Suche und die Integration mit Google Analytics, um jeden Aspekt Ihrer Website zu verfolgen. Es verspricht keine Werbung und ist die beste Option, wenn Sie Code zum Hinzufügen einer Suchleiste lernen möchten.

2. Code aus dem Expertrec-Dashboard kopieren

Wenn Sie mit dem Code herumspielen möchten, versuchen Sie, Code aus dem Expertrec-Dashboard zu kopieren. Nun, Expertrec hat die App bereits im Shopify App Store gelistet. Wenn Sie jedoch den anderen Weg wollen, dann ist es hier:

ich. Klicken Sie auf https://cse.expertrec.com und melden Sie sich mit Ihrem Google-Konto an.

ii. Geben Sie nun die URL Ihrer Website ein und gehen Sie anschließend zum Dashboard.

iii. Kopieren Sie den Code aus dem Expertrec-Dashboard und vergessen Sie nicht, das HTML-Tag wie unten gezeigt zu kopieren:

iv. Hier ist eine Erinnerung. Sie haben drei Optionen zum Hinzufügen zur Suchleiste.

  • HTML Quelltext
  • Vorhandenes Suchfeld verwenden
  • CSS-Selektor

Wenn Sie Ihr vorhandenes Suchfeld verwenden möchten, klicken Sie darauf und stellen Sie sicher, dass es aktiviert ist.

v. Melden Sie sich jetzt bei Ihrem Shopify-Shop an und öffnen Sie das Admin-Panel.

vi. Klicken Sie hier auf die Option „Online-Shop“ und Sie erhalten ganz oben die Option „Theme“.

vii. Ganz rechts befindet sich die Schaltfläche „Aktionen“.

viii. Sobald Sie darauf klicken, erscheint, wie Sie sehen, ein Drag-Down-Menü. Klicken Sie hier auf die Option Code bearbeiten, die sich oben zweit von unten befindet.

ix. Im Abschnitt „Layout“ müssen Sie auf „theme.liquid“ klicken, um den Expertrec-Code hinzuzufügen.

X. Wie Sie auf der rechten Seite sehen können, gibt es da draußen jede Menge Code. Fügen Sie den Code wie unten gezeigt in den Abschnitt <head> ein:

xi. Wenn Sie keine vorhandene Suchleiste verwenden, hätten Sie das HTML-Tag kopiert. Fügen Sie nun dieses Tag wie unten gezeigt in den Textabschnitt ein:

xii. Speichern Sie den Code.

xiii. Klicken Sie auf das Augensymbol, um eine Vorschau Ihres Shopify-Shops anzuzeigen. Hier sehen Sie das Expertrec-Suchfeld.

Probieren Sie die Demo aus

Klicken Sie auf die Suchleiste und geben Sie eine Suchanfrage wie unten gezeigt ein: Die Expertrec-Suchleiste wird mit integrierter Sprachsuche angezeigt. Und ich weiß, dass Sie das plötzliche Wachstum der Sprachtechnologie bereits kennen. Schließlich stellt die Installation der Expertrec-Suchleiste sicher, dass die Website-Besucher ihre Finger nicht anstrengen müssen, um das Produkt einzugeben, wenn sie buchstabieren und den Eintrag abrufen können.

3. Verwenden der benutzerdefinierten Suche von Google

Es ist ein kostenloses Tool zum Hinzufügen einer Shopify-Suchleiste. Sie müssen lediglich die benutzerdefinierte Suche von Google installieren, und das ist alles. Aber wie Sie wissen, hat alles seinen Preis. Das Gleiche passiert bei der Installation der benutzerdefinierten Google-Suche.

Im Gegensatz zur benutzerdefinierten Suche von Expertrec werden in der benutzerdefinierten Suche von Google Anzeigen geschaltet. Viele Anzeigen. Und es ist nie eine gute Idee, Ihre wertvollen Kunden durch einen Klick auf diese Anzeigen zu verlieren. Darüber hinaus können diese Anzeigen die Website-Besucher sogar auf eine andere Website weiterleiten, die Ihr potenzieller Konkurrent sein könnte.

Abgesehen von diesen Verlusten handelt es sich um ein kostenloses Tool, das Sie zu Beginn verwenden können. Aber nicht für langfristiges Wachstum geeignet. So installieren Sie GSS:

ich. Klicken Sie auf https://cse.google.com und dann auf „Erste Schritte“, um fortzufahren.

Geben Sie anschließend die URL Ihrer Website ein.

ii. Sie können Ihrem CSE auch einen Namen geben. Klicken Sie auf Erstellen.

iii. Sie können auf eine neue Suchmaschine für Ihre Website zugreifen. Klicken Sie auf Code abrufen.

iv. Kopieren Sie den Code.

v. Gehen Sie zum Shopify-Administrationsbereich. Klicken Sie auf Aktionen -> Code bearbeiten.

vi. Kopieren Sie in Layout -> theme.liquid -> <body> den Code zwischen den beiden <div>, wie unten gezeigt:

vii. Sie haben das Google CSE sofort hinzugefügt.

Öffnen Sie Ihre Website und sie würde etwa Folgendes anzeigen (unterstützt von Google):

Fügen Sie Ihrem Shopify-Shop eine tolle Suche hinzu

Unglaublicher Bonus, der von der Expertrec-Suchleiste angezeigt wird

Die Expertrec-Suchleiste bietet Ihnen eine umfassende Kontrolle über Ihre Suchleiste. Sie können alles und jedes tun, ohne Code lernen zu müssen. Hier ist die Liste der unglaublichen Bonuspunkte, die Sie durch die Installation der Expertrec-Suchleiste erhalten.

Such-API

Ich hoffe, Sie haben sich an den ursprünglichen Code erinnert, den wir hinzugefügt haben. Es besteht die Möglichkeit, Your_API_key einzugeben. Sobald Sie sich beim Expertrec-Dashboard angemeldet haben, können Sie auf Ihre API zugreifen und sie wie unten gezeigt kopieren:

Es ist für jeden Shop einzigartig und dient somit als Kennung für jeden Shopify-Shop.

Sucheinstellungen werden praktisch.

Wenn Sie nach der App-Installation zum Expertrec-Dashboard gehen, gibt es mehrere Einstellungen zum Aktualisieren Ihrer Shopify-Suchleiste. Dies alles geschieht ohne die Anforderung des Shopify-Suchcodes.

Befassen wir uns mit den drei Abschnitten der Sucheinstellungen:

  • Gewichte
  • Boost-Felder
  • Synonyme

Gewichte

Bei jeder Suchanfrage wird ein bestimmter Algorithmus verwendet, um die Ergebnisse anzuzeigen. Dinge, die ganz oben im Ergebnis angezeigt werden sollen, können mit dieser Option angepasst werden. Immer wenn ein Benutzer die Abfrage eingibt, werden alle Felder, die entsprechend ihrer Gewichtung bevorzugt werden, vom Expertrec-Algorithmus verarbeitet. Auf diese Weise können Sie damit die besten Ergebnisse in Bezug auf Relevanz erzielen. Die Ergebnisse, die mit den ersten ausgewählten Feldern übereinstimmen, erhalten einen höheren Rang.

Boost-Felder

Boost-Felder geben der ausgewählten Suchanfrage einen zusätzlichen Fokus, sodass ein bestimmtes Feld ganz oben im Suchergebnis angezeigt wird. Wenn Ihr Shopify-Shop beispielsweise T-Shirts mehrerer Marken enthält. Hier können Sie diesen Filter auf „Nike“ anwenden, um das Ergebnis oben anzuzeigen. Auf diese Weise können Sie durch die Definition Ihrer Boost-Felder bestimmten Produkten Vorrang vor anderen ähnlichen Produkten einräumen.

Synonyme

Seien wir ehrlich. Benutzer müssen nicht nach der genauen Suchanfrage suchen, die Ihrem Schlüsselwort ähnelt. Das bedeutet, dass ein Benutzer, wenn er nach „Jahresplaner“ sucht, möglicherweise nach „Jahresbuch“, „Planungsexemplar“, „Jahresbroschüre“ usw. sucht. Auch hier würde Ihnen die Verwendung dieser Synonymfunktion beim Ranking für diese Produkte helfen. Sie können den Trend anhand von Suchanalysen leicht erkennen und die Synonyme entsprechend Ihren Website-Besuchern festlegen. Höchstwahrscheinlich wird ihre Suchanfrage ganz anders sein als Ihre.

Passen Sie die Benutzeroberfläche Ihrer Suchleiste an

Beim Anpassen der Benutzeroberfläche der Shopify-Suchleiste geht es darum, Änderungen an der Suchleiste selbst vorzunehmen. Es hebt die Benutzerfreundlichkeit und Ergebnisse hervor, Filter mit mehreren Zusatzfunktionen.

Suchlayout

Standardmäßig wird das Suchlayout überlagert. Das bedeutet, dass die Suchergebnisse auf derselben Seite angezeigt werden, indem sie die vorherige Seite überlagern.

Wenn Sie hingegen Ergebnisse auf einer anderen Seite suchen möchten, können Sie diese aufrufen, indem Sie auf diese Drag-Down-Option klicken. Geben Sie den Pfad ein, in dem Sie die Suchergebnisse und auch die Abfrageparameter anzeigen möchten. Stellen Sie sicher, dass Sie die Richtlinien zum Hinzufügen eines ci-search-results-Tags befolgen, um das Ergebnis wie unten gezeigt im Pfad /different.html anzuzeigen:

Benutzerdefinierter CSS-Editor

Wie immer können Sie, ohne Programmierkenntnisse zu erlernen, die Benutzeroberfläche Ihrer automatischen Vervollständigung ändern, indem Sie mit diesem Code herumspielen.

Feld 1: Um die Farbe der Autovervollständigung zu ändern,

Ändern Sie die Farbe in Zeile 9 als

Farbe Rot;

Feld 2: Um die Farbe der Beschreibung zu ändern,

Ändern Sie die Farbe in Zeile 14 wie folgt

Farbe grün;

Feld 3: Am Ende ändern Sie die Farbe des fetten Textes in

Farbe braun;

Sie sind bereit. Klicken Sie einfach auf „Aktualisieren“, um die Einstellungen zu speichern und Ihren Online-Shop zu öffnen, um die Änderungen zu sehen.

Seitennummerierung

Die Paginierung ähnelt dem unendlichen Scrollen. Navigation bedeutet beispielsweise die Navigation durch das Menü, Paginierung die Navigation durch die Seiten. Möglicherweise haben Sie Hunderte von Produkten in Ihrem Online-Shop. Nach einigen Ergebnissen oben können Sie zur nächsten Seite gehen, um durch andere Produkte zu scrollen. Hier kommt die Rolle der Paginierung ins Spiel. Auch beim Googeln besteht die Möglichkeit, durch die Seiten zu navigieren, wie unten gezeigt:

Im Expertrec-Dashboard können Sie die Benutzeroberfläche der Paginierung anpassen, indem Sie mit diesem CSS-Code herumspielen.

Filter

Sobald Sie Facetten aktivieren, können Sie Filter in den Suchergebnissen anzeigen. Es hilft den Besuchern, die Ergebnisseite einzugrenzen und schnell zum gewünschten Produkt zu gelangen. Sie können beispielsweise mehrere Felder auswählen, wie unten gezeigt:

Sie können einen beliebigen Filter auswählen und Ihren eigenen erstellen.

Stellen Sie sicher, dass Sie die Einstellungen aktualisieren, damit sie in der Suchleiste angezeigt werden.

Verschiedene Funktionen

Es gibt einige andere Funktionen, die genauso wichtig sind wie die zuvor.

Sie können die Sprachsuche aktivieren/deaktivieren, indem Sie die Leiste umschalten. (Standardmäßig ist es aktiviert)
Sie können die automatische Vervollständigung zulassen, indem Sie die Leiste „Während der Eingabe suchen“ umschalten. (Standardmäßig EIN)
Versuchen Sie, den Autofokus in der Suchleiste zu aktivieren.
Suchvorschläge sind wichtig. (Standardmäßig EIN)
Sie können die Expertrec-Fontawesome auch deaktivieren, um die Fontawesome Ihrer Website zu sehen.
Sie können einige Suchbedingungen festlegen.
Sie können den alternativen Designvorschlag auch anzeigen, indem Sie den Schalter aktivieren.

Zusammenfassend: Shopify-Suchcode

Expertrec bietet die beste Shopify-Suchleiste. Sie müssen nicht einmal den Code lernen oder danach suchen. Am besten installieren Sie Expertrec Smart Search Bar für 9 $/Monat und konzentrieren sich auf den Aufbau Ihrer Website-Präsenz. Danach wird alles rund um die Suche von Expertrec übernommen.

Obwohl Sie immer die Wahl haben, können Sie Expertrec Smart Search Bar kostenlos installieren und eine 14-tägige kostenlose Testversion erhalten. Das Expertrec-Team ist immer für Sie da, um Ihnen bei allen Fragen zu benutzerdefinierten Suchmaschinen zu helfen. Sie können sie erreichen, indem Sie ein Support-Ticket erstellen.

Fügen Sie Ihrem Shopify-Shop eine tolle Suche hinzu

Are you showing the right products, to the right shoppers, at the right time? Contact us to know more.
You may also like