Impulse Theme

Deutsch Diskussion Shopify Design
1

Hallo, ich nutze das Impulse Theme und habe dazu 2 Anliegen:

  1. Ich möchte, dass die Bilder in der Slideshow oben nicht von der Seite eingeschoben werden, sondern reingezoomt werden. Ist dafür ein Code notwendig? Falls ja, kann mir jemand sagen welchen Code ich dafür wo einsetzen muss?
    Leider hilft der Theme Hersteller hier nicht wirklich weiter.

  2. Welche Bildgröße muss in die Slideshow, damit nichts abgeschnitten wird?

Vielen Dank für hilfreiche Antworten.

2

Hey @Alina12

Danke für die Fragen und tolles Theme - Impulse! Gute Wahl! :wink:

Und hast du die Impulse Theme Doku durchgekämmt bzgl. den Dingen die du oben erwähnst? Hat sie dir nicht weiterhelfen können? Und die Theme Einstellungen haben dir auch nicht weiterhelfen können?

image.png
image.png3514×1816 516 KB

Da der Theme Entwickler dir nicht helfen kann habe ich das Theme jetzt zu meinem Shop hinzugefügt, um es zu testen, und das wird eine ziemliche Operation im Code verlangen, um das zu erreichen was du möchtest. Du kannst beispielsweise eine CSS-Animation definieren, die den Zoom-Effekt erzeugt. Zum Beispiel mit 'ner JavaScript-Funktion wie diese:

@keyframes zoomIn {
    from {
        transform: scale(0.5);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

.slideshow-image {
    animation: zoomIn 0.5s ease-out forwards;
}

In diesem Beispiel wird eine @keyframes-Animation namens zoomIn definiert, die das Bild von einer kleineren Skalierung (0.5) auf die tatsächliche Größe (1) und von vollständiger Transparenz (opacity 0) zu vollständiger Sichtbarkeit (opacity 1) bringt. Einfach die .slideshow-image durch die tatsächliche Klasse ersetzen, die die Slideshow-Bilder verwendet. Falls die Slideshow durch JavaScript gesteuert wird und du den Effekt dynamisch anwenden möchtest, den Code anpassen, der für das Einblenden der Bilder verantwortlich ist, um die CSS-Animation zu nutzen oder direkt einen Zoom-Effekt zu implementieren.

Die Bildgröße damit nichts abgeschnitten wird

Die optimale Bildgröße hängt von einigen Faktoren ab, darunter das Design des Themes und die Größe der Bildschirme, auf denen der Shop hauptsächlich angesehen wird. Ein guter Ausgangspunkt für Slideshow-Bilder auf Websites ist jedoch oft eine Breite von 1920 Pixeln, da dies die Breite vieler hochauflösender Bildschirme entspricht. Die Höhe kann variieren, aber ein gängiges Seitenverhältnis ist 16:9, was bei einer Breite von 1920 Pixeln eine Höhe von etwa 1080 Pixeln bedeutet.

Es ist wichtig zu beachten, dass einige Themes Bilder automatisch zuschneiden oder skalieren, um sie an verschiedene Bildschirmgrößen anzupassen. Einfach oben verlinkte Doku überprüfen.

Hoffe das hilft dir weiter - lass wissen falls nicht! :wink:

Habt ihr auch den Shop auf Ostern eingestellt das jetzt um die Ecke liegt? Warum nicht eine Ostereierjagd :hatching_chick: in das Shop einbauen, um deinen Kunden etwas Gamification und Fun im Shop anzubieten? Gerne kann ich bei Interesse Tipps dazu geben!

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. Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.

3

Hi Gabe,

erstmal vielen vielen lieben Dank für Deine Antwort.

Bzgl. der Bilder hatte ich in einigen Foren gelesen, dass die richtige Größe 1:1 sein soll oder 800x800 Pixel. Dies hatte ich dann eingestellt, aber leider wurden die Bilder auch weiterhin abgeschnitten.
Ich werde aber nun Deinen Rat befolgen, die Bilder anpassen und schauen, ob es dann besser passt :-).

Das mit dem Code ist super, wenn es damit gelöst werden kann, prima danke.
Nun müsste ich noch wissen wo genau ich den einfügen muss und durch welchen Code ich diesen ersetzen muss. Könntest Du mir den Abschnitt in den Codes nennen? Das wäre sehr lieb.

Bzgl einer Osteraktion sehr gerne, da wir dies eh geplant haben :slightly_smiling_face: Falls du tolle Ideen hast, die passen, sind wir dafür gerne offen.

4

@Alina12

Ja, die Code Empfehlung ist sehr generell und eigentlich sollte ein Programmierer ein :eye: drauf werfen, der oder die Zugriff auf dein Theme Code (was wir ja von hier aus nicht haben leider), denn ob es so klappt ist nicht immer gesagt.

Hast du einen Programmierer denn du in Auftrag stellen kannst? Wenn du deine Frage in unserer privaten FB Gruppe hier stellst dann werden sich einige melden. Oder deine Frage in unserem spezialisten Design Forum hier auf Englisch posten. Da haben wir auch einige super Entwickler aus Indien die dir sofort damit helfen können.

  • Bzgl einer Osteraktion sehr gerne, da wir dies eh geplant haben :slightly_smiling_face: Falls du tolle Ideen hast, die passen, sind wir dafür gerne offen.

Wenn du dein Shop URL hier postest kann ich das gerne machen!

Hoffe das hilft dir weiter - lass wissen falls nicht! :wink: