FROM CACHE - de_header

Code in die Startseite einbauen

qomplizen
Shopify Partner
20 0 5

Hallo zusammen,

über die App Shoppable Fashion Galleries habe ich ein Lookbook erstellt, welches ich gerne in einer Section auf meiner Startseite einbauen möchte. Die App hat eine neue Seite für das Lookbook erstellt, scheinbar kann ich aber auch einen Code einbauen:

 

<div class="shoppable-fashion-galleries sfg-lookbook" id="096ccb8368894bd79ea2b93eea26985f"></div><div class="shoppable-fashion-galleries sfg-lookbook-loader" style="text-align: center;"><img src="https://aura-apps.com/shoppable/engine/loader.svg" class="sfg-loader"></div>

Nun wollte ich fragen, wo im Liquid ich meine Startseite finde, um unter einem bestimmten Abschnitt diesen Code einzubauen. Bis auf das theme.liquid habe ich nichts gefunden. Ich brauche aber den genauen Quellcode, wo auch alle anderen Sectionen hinterlegt sind, die derzeit auf der Startseite sind, damit ich diesen Code für das Lookbook an entsprechender Position einfügen kann.

 

Lieben Dank und liebe Grüße

12 ANTWORTEN 12
Gabe
Shopify Staff
Shopify Staff
7534 1204 1959

Hey @qomplizen 

Hast du das mit einem Benutzerdefinierten Theme Section probiert? Die App Entwickler können hier bestimmt helfen! 

Hier ist nochmal deren Anleitung. Inwiefern trifft diese Anleitung nicht für deinen Use-Case zu?

image.png

  • Wenn nicht dann diesen Code an der bestimmten Stelle innerhalb der <body> Tags des theme.liquid einpflegen. Aber probiere das doch bitte zuerst in einer Theme-kopie/Testumgebung.

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

r8r
Shopify Expert
2350 305 834

@qomplizen – ich nehme an, dass Du ein Sectioned Theme hast. Hier wird die Startseite von dem "Baukasten"-Customizer zusammengebaut. Wahrscheinlich ist es hier am Saubersten, wenn Du eine eigene Section machst und die dann über den Customizer in die Startseite drag-und-droppst.

1.) Leg eine neue .liquid-Datei unter /sections an – z.B. lookbook.liquid

2.) Ergänze folgenden Code in der Datei:

<div class="shoppable-fashion-galleries sfg-lookbook" id="096ccb8368894bd79ea2b93eea26985f"></div><div class="shoppable-fashion-galleries sfg-lookbook-loader" style="text-align: center;"><img src="https://aura-apps.com/shoppable/engine/loader.svg" class="sfg-loader"></div>
{% schema %}
{
  "name": "Lookbook",
  "class": "index-section index-section--lookbook",
  "settings": [],
  "presets": [{
    "name": "Lookbook",
    "category": "Text"
  }]
}
{% endschema %}

3.) Geh in den Customizer und ergänze die Section, wie gewohnt … Du kannst Sie auch an die Position schieben, wo Du sie benötigst:

Screenshot 2021-07-19 at 16.39.02.jpg

Screenshot 2021-07-19 at 16.38.40.jpg

Ich hoffe, dass das hilft,
Mario

 

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
Gabe
Shopify Staff
Shopify Staff
7534 1204 1959

Wenn wir nicht unsere Experten des neuen Theme Editors hätten!

😉

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

r8r
Shopify Expert
2350 305 834

… wir haben uns da über's Kreuz gepostet, @Gabe 😉

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
Gabe
Shopify Staff
Shopify Staff
7534 1204 1959

Nee deine Lösung ist sowieso viel sauberer!

image.png

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

qomplizen
Shopify Partner
20 0 5

Hallo @r8r 

 

lieben Dank für die Hilfe. Ich habe die Schritte entsprechend befolgt, nur dann steht folgendes:

 

Bildschirmfoto 2021-07-19 um 18.26.08.png

r8r
Shopify Expert
2350 305 834

@qomplizen – ja, das passt auch so – es gibt keine benutzerdefinierten Einstellungen für diese Section. Den Code, kannst Du in der Datei lookbook.liquid pflegen – also alles vor dem {%  schema %} Block kannst Du frei definieren und dort den Code reinpetern, der rausgerendert werden soll!

Liebe Grüße,
Mario

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
qomplizen
Shopify Partner
20 0 5

@r8r vielen Dank für die Info, das habe ich tatsächlich gemacht. Es kommt nur ein Punkt. Mag sein, dass der Code von irgendwas blockiert wird.

r8r
Shopify Expert
2350 305 834

@qomplizen – ja, so sah es auch bei mir aus. Gibt's zu der Einbindung eine Dokumentation?

★ Ja, man kann mich buchen; schreib mir eine Nachricht!
★ Hinterlass gerne ein Like und markiere meine Antwort gegebenenfalls als Lösung. Ich freue ich mich immer über eine Spende an die (Kinder)krebshilfe oder eine kleine Aufmerksamkeit.
Studio Mitte
qomplizen
Shopify Partner
20 0 5

@r8r leider nein. Den Code habe ich hier her:

Bildschirmfoto 2021-07-20 um 14.44.57.png

Unten links kann ich den Code kopieren, quasi dort, wo ich das ganze erstellt habe. Ggf. muss ich mal die Leute dort anschreiben.

Gabe
Shopify Staff
Shopify Staff
7534 1204 1959

@qomplizen 

Wie ist das gelaufen?

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

qomplizen
Shopify Partner
20 0 5

Ich habe den Code eingebaut, man sieht das Lookbook auch, es sieht aber nicht schön aus. Das Problem ist, dass das Lookbook auf der Linken Seite ist, sodass rechts viel zu viel Platz ist. Ich habe es leider noch nicht hinbekommen, den Textkörper auf die rechte Seite zu bekommen oder das Lookbook wenigstens in die Mitte zu positionieren. Am liebsten wäre mir aber der Text über dem Lookbook auf die rechte Seite zu bekommen:

Bildschirmfoto 2021-08-30 um 09.32.37.png

www.detailvernarrt.de