Focal Theme individuell bearbeiten

Topic summary

Anliegen: Individuelle Anpassungen im Shopify-Theme Focal für ein Edelstein-Lexikon mit über 50 Einträgen: Filter-Sidebar links und Pfeilnavigation zwischen Einträgen.

Ausgangslage: FAQ und Lexikon haben eigene Vorlagen. Jede Edelstein-Seite ist eine Standardseite mit eigener Vorlage und CTA zur Detailansicht. Screenshots und ein Shop-Preview wurden bereitgestellt.

Vorschläge:

  • Custom-Entwicklung über Shopify Experts (Aufwand/Timing abhängig von Vorgaben und aktuellem Aufbau).
  • Apps für Filter/Navi: Search & Discovery (Filter/Sortierung; Entwickler können Filter in spezifische Vorlagen integrieren), Page Builder, Produkt-Slider/Carousel (Zipify, Enorm, Singleton).
  • Alternativ: Edelsteine als „nicht-kaufbare“ Produkte mit eigener Produktvorlage; Metafelder (benutzerdefinierte Attribute wie Farbe/Härte) zur Filterung und Produktreferenzen zu kaufbaren Produkten; Navigation innerhalb einer Kollektion erleichtert.

Technik-Hinweis: previous_product/next_product sind nicht nativ; müssen dynamisch generiert werden (Singleton unterstützt dies auf Produktseiten). Code-Beispiel wurde gezeigt.

Aktuelle Entwicklung: Singleton getestet – Pfeile erscheinen nur auf Produktseiten, nicht auf Standardseiten; fehlende Mobile-Optionen. Empfehlung weiterer Apps inkl. KI-Assistenz- und Search/Filter-Lösungen (R: AI, AI Search, Smart Search, Searchanise).

Status: Offen. Ungeklärt sind Filter auf der Lexikon-Standardseite und Pfeilnavigation auf Nicht-Produktseiten (inkl. Mobile). Maßnahmen: Apps evaluieren oder Expert:innen beauftragen.

Summarized with AI on January 25. AI used: gpt-5.

Hallo zusammen,

wir benötigen bitte Unterstützung bei der Bearbeitung unseres Theme “Focal”.

  1. Wir haben auf einer Seite eine Übersicht an Materialien unserer Produkte.

Da wir über 50 haben, fänden wir es gut auf der linken Seite einen Filter einzusetzen.

Der Abschnitt “FAQ” hat solch einen.

Wäre klasse, wenn man diesen auch auf einen anderen Seite einsetzen könnte. Über eine Anleitung würden wir uns sehr freuen!

  1. Wenn man auf eine dieser Steine klickt, landet man auf der Übersicht und sieht die entsprechenden Infos. Leider gibt es momentan keine Möglichkeit schnell und einfach zwischen den Steinen zu wechseln. Es ist immer notwendig mit den Browserpfeilen oder über das Menü zurück zur Übersicht zu gehen.

Es wäre klasse, wenn wir zwei Pfeile neben den Titel der Seite einbauen könnten, damit User schnell zum vorherigen oder folgenden Stein wechseln können.

Gäbe es die Möglichkeit?

Vielen Dank für euren Support!!!

Liebe Grüße

@LAVISA , da das eine individuelle Programmierung erfordert, die nicht in wenigen Minuten eingestellt ist, würde ich Euch empfehlen über die Shopify Experts Plattform eine Anfrage oder Ausschreibung zu erstellen.

Hallo @Finer
schon mal gut zu wissen, dass das “nicht so einfach” geht.
Hättest du eine Einschätzung zu Timing & Investition?

Lieben Dank

Hey @LAVISA

Wie Finer sagt, aber lass uns ein paar weitere Optionen und Apps anschauen die euch ggf. helfen können euer Ziel zu erreichen im Focal Theme.

Und wow, das sind tolle Edelsteine! Wenn du möchtest, teile doch einen Link zu deinem Shop hier, so dass wir einen :eyes: in euer Shop und Setup werfen können.

Aber lass uns hier mal die Fragen einzeln durchgehen bzgl. eures Focal Theme (apropos ein super Theme!). An erster Stelle ist es so, dass eine einfache und intuitive Navigation eins der wichtigsten Bestandteile eines Shops mit einem sehr grossen Katalog wie eures ist, und kann ausschlaggebend und predictive dafür sein wie letztendlich eure Conversion Rate aussehen wird. Wie einfach ist es euren grossen Katalog als “Beginner User” zu navigieren und die Edelsteine in den Warenkorb zu legen? Das wäre beispielsweise eine wichtige Frage.

Frage 1

Ihr wollt also eine Filter-Sidebar in bestimmte Seiten einbauen. Im Grossen und Ganzen kommt es darauf an was für Seiten diese sind und ob ihr Vorlagen zu den Seiten zugewiesen habt und wenn ja, welche. Hat beispielsweise die Lexikon Page dieselbe Vorlage wie die FAQ Seite?

Dann kann man mit unserer Search & Discovery App eine tolle UX in den Shop einbauen der es euren Kunden erlaubt viel mehr Sortierungs- und Filterungsmöglichkeiten auszuschöpfen, was in eurem Shop sehr einleuchtet, da ihr einen sehr großen Katalog an Edelsteine anbietet!

Frage 2

Links-rechts Pfeile und Produkte-Karussells bieten in der tat eine viel-verbesserte UX für die Besucher zu deinem Shop, so dass sie viel einfacher auf Desktop und auf Mobile von einem Produkt zu nächsten navigiere können.

Diese aber nachträglich einbauen wird etwas komplex Coding verlangen und meine Empfehlung ist immer: je mehr man das Einsteigen in den Theme Code vermeiden desto besser.

Apps gibt es die es euch erlauben ganz tolle Page Elemente in alle Seiten einzubauen, wie z. B. unsere Page Builder Apps. Diese Apps bieten dir die Möglichkeit die Page wirklich so zu designen wie du sie dir vorstellst. Wenn man die Apps in Maßen verwendet können sie eine Wow-faktor zum Shop bringen. Anosnten gibt es auch Apps die link-rechts Slider und Karussells in die Produkte Pages einbauen können wie diese Demos hier zeigen:

Hast du weitere Fragen zum Shop? Gebe einfach ein Suchbegriff oben in der Suchleiste der Community Landingpage ein, denn das Thema haben wir sehr wahrscheinlich schon besprochen. Oder lass wissen, wenn du weitere Fragen dazu hast oder zum Shop und Business und gerne können wir das hier weiter besprechen! Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.

@LAVISA das ist schwer zu sagen. Ich kann leider nicht für andere Freelancer oder Agenturen sprechen.

Es ist auch immer eine Frage, in weit Ihr eine exakte Vorgabe macht und welche zusätzlichen, zunächst nicht genannten, Anforderungen Ihr noch habt (Bsp. Alles soll über den Theme-Editor editierbar sein/die Reihenfolge soll alphabetisch oder nach einem anderen Kriterium erfolgen).

Auch ist nicht klar, wie der aktuelle Aufbau der „Edelstein-Elemente“ ist – dadurch sind die Möglichkeiten, die Funktion einzubauen, nicht bekannt.

Im Grunde ist Eure Anforderung ja folgende:

Wir möchten eine Übersicht der Edelsteine machen, die es dem Nutzer ermöglicht Edelsteinkategorien aufzurufen/ zu filtern und innerhalb dieser (Edelsteine) auch leicht navigieren zu können, ohne dass der Nutzer ständig zurück zur Übersicht muss.

Weiterhin soll der Kunde von einzelnen Edelsteinen Informationen erhalten und zu Produkten weitergeleitet werden, die diese Edelsteine enthalten.

Ein alternativer Ansatz wäre die Darstellung der Edelsteine als nicht-kaufbare Produkte. Dazu würden man den Steinen eine Vorlage zuweisen, die keinen AddToCart-Button haben.

Dadruch könnte man innerhalb der Kategorie “Edelsteine-Lexikon” in ein Produkt gehen und leichter zum nächsten (Edelstein) innerhalb der Kategorie wechseln. Auch die Filterung auf der Kategorieseite könnte man gut mit der Search & Discovery App filtern, da Ihr den Edelsteinen ja über Metafelder Attribute zuweisen könnt. Zudem könntet Ihr Produktreferenzen (als Metafeld) erstellen, damit die entsprechenden kaufbaren Produkte auf der Edelsteinseite angezeigt werden.

@Finer @LAVISA

Da schliesse ich mich an und benutzerdefinierte Produktvorlagen für verschiedene Produktkategorien zu erstellen. In diesem Fall könnte man eine Vorlage erstellen, die speziell für die Edelsteine entwickelt wurde und keinen “In den Warenkorb” Button enthält, sondern nur informativ ist, um den Kunden über den spezifischen Edelstein zu informieren.

Mit Metafelder kann man spezifische Informationen zu den Produkten zuweisen. In eurem Fall vielleicht Metafelder erstellen, um zusätzliche Attribute der Edelsteine zu speichern, wie z. B. Farbe, Härte oder andere wichtige Merkmale. Dann auch auch ein Metafeld für die Produktreferenzen erstellen, um die Produkte anzuzeigen, die diesen speziellen Edelstein enthalten. Wenn du dir den Aufwand erleichtern möchtest kannst du immer die Metafields Guru oder Metafields Custom Fields Apps ausprobieren.

Nochmal zum wichtigen Thema - Navigation - damit Kunden leicht von einem Edelstein zum nächsten navigieren können, könnte man auch Navigationslinks direkt in der Seite zu den nächsten/ vorherigen Produkten in der Edelsteinvorlage einrichten, sprich, durch Anpassung des Codes der Vorlage erreicht werden.

Dieser Code überprüft, ob es ein vorheriges oder nächstes Produkt in der Kollektion gibt und zeigt einen Link zu diesem Produkt an, wenn es existiert:

{% if product.previous_product %}
  Vorheriges Produkt
{% endif %}
{% if product.next_product %}
  Nächstes Produkt
{% endif %}

Die previous_product und next_product Attribute sind aber nicht nativ in Shopify und man muss sie dynamisch generieren. Die bereits genannte App von Singleton kann das aber einrichten.

Hallo @Gabe @Finer
zunächst einmal vielen Dank für eure ausführliche Rückmeldung. Echt große Klasse eure Unterstützung.

Wir möchten eine Übersicht der Edelsteine machen, die es dem Nutzer ermöglicht Edelsteinkategorien aufzurufen/ zu filtern und innerhalb dieser (Edelsteine) auch leicht navigieren zu können, ohne dass der Nutzer ständig zurück zur Übersicht muss.

Weiterhin soll der Kunde von einzelnen Edelsteinen Informationen erhalten und zu Produkten weitergeleitet werden, die diese Edelsteine enthalten.

→ Ganz genau, denn wir haben festgestellt, dass die Informationen zu den Edelsteinen für unsere Zielgruppe essentiell ist. Deshalb haben wir für jeden Stein eine eigene Vorlage erstellt, die folgendermaßen aussieht.

Deshalb hat jeder Stein auch einen CTA Button, um auf diese Seite navigieren zu können. Wie gesagt, ist an dieser Stelle eben das Problem, dass man nicht einfach zwischen den Steinen navigieren kann.

Ich werde mir die Apps mal näher anschauen.

Hi @Gabe
hier ist die Preview zum Shop. Wir sind noch lange nicht fertig, aber so bekommst du schon mal einen ersten Blick darauf.

Frage 1: FAQ und Edelstein Lexikon haben eigene Vorlagen. Mit Search & Discovery haben wir uns noch nicht wirklich beschäftigt, aber klingt nach einer tollen Sache!
Aber würde sich damit auch die Filter Thematik lösen, die wir gerne auf die Edelstein Lexikon Seite einbauen möchten?

Frage 2: Ganz genau so wie es Singleton hat, würden wir es auch brauchen! Wir haben es direkt getestet, aber mussten leider feststellen, dass dieser Pfeile nur auf Produktseiten eingeblendet werden. Die Seiten der Edelsteine sind aber Vorlagen von Standardseiten. Zudem gibt es keine Einstellungen für Mobile. Welche App würdest du mir stattdessen empfehlen?

Liebe Grüße

Hey @LAVISA

Pro-Tipp: Mittlerweile kann man ja KI Virtual Assistants in den Shop einbauen der deinen Kunden kompetente Antworten zu den Edelsteinen anbieten kann. Siehe ein Beispiel in Aktion - stelle da einfach eine wie Frage wie “Was ist ein Malachit Edelstein?” und zwar hier.

Schaue dir die Search & Discovery App an und ggf. auch diese Demos:

Die App Entwickler helfen euch gerne die Filter in bestimmten Seiten und Vorlagen einzubauen!

Hoffe das hilft! :wink: