Hallo,
bei mir beträgt die content-main-inner 1260px. Die Shop Ansicht der Startseite (Einkaufswelten) beträgt jedoch 1160px, so dass um die Elemente ein breiter Rand von je 50px je Seite entsteht.
Kann man diesen Abstand irgendwie verkleinern, so dass der Shop anstelle der 1260px vielleicht 1220px hat?
Vielen Dank
CSS Klasse .content-main–inner hat den Abstand 50px links und rechts (padding: 0px 50px 50px 50px;)
Wenn man den zweiten und vierten Wert auf 20 setzt, ist die Breite 1220px. Verschiedene Viewpoints (Geräte) beachten.
CSS Klasse .content-main–inner hat den Abstand 50px links und rechts (padding: 0px 50px 50px 50px;)
Wenn man den zweiten und vierten Wert auf 20 setzt, ist die Breite 1220px. Verschiedene Viewpoints (Geräte) beachten.
Hallo,
in welcher Less-Datei sind die Änderungen notwendig?
Danke schon mal im voraus.
HMS
Am besten deine eigene Anlegen und vorher ein Template, welches vom responsive Template ableitet.
Anbei noch ein Link zu dem Thema
https://developers.shopware.com/designers-guide/getting-started/
Liebe Grüße
Kevin
Am besten deine eigene Anlegen und vorher ein Template, welches vom responsive Template ableitet.
Anbei noch ein Link zu dem Thema
https://developers.shopware.com/designers-guide/getting-started/
Liebe Grüße
Kevin
Danke Kevin für Deine Antwort.
Ich habe schon mehrere Änderungen an „meinem Template“ (Child-Template) durchgeführt, jedoch bekomme ich es einfach nicht hin das auf „der Startseite“ der breite weiße Rand verschwindet. In den Unterseiten (Einkaufswelten) wurden meine Änderungen alle übernommen und umgesetzt, es geht bei mir daher nur um die eigentliche STARTSEITE.
Gruß
HMS
Hey HMS,
ok, verstehe… Hast du Lust einmal deine URL zum Shop (gerne auch per PM) kurz zukommen zu lassen? Würde die Sache vermutlich erheblich vereinfachen 
Liebe Grüße
Kevin
Hey HMS,
ok, verstehe… Hast du Lust einmal deine URL zum Shop (gerne auch per PM) kurz zukommen zu lassen? Würde die Sache vermutlich erheblich vereinfachen
Liebe Grüße
Kevin
Hallo Kevin,
ist auf dem Weg!
Danke 
HMS
Hallo HMS,
ich habe das Selbe Problem.
Kannst du mir die Lösung vielleicht verraten, wenn es eine gibt?
Vielen Dank
Hi Zusammen,
also wenn ich das richtig sehe, kommt hier die max-width der Einkaufswelt in die Quere.
Wie du schon sagst, sehen die Kategorien soweit gut aus. Hier hast du nur noch einen kleinen Außenabstand.
Innerhalb der Einkaufswelt ist allerdings ein max-width gesetzt:
Zu finden unter:
Responsive\frontend_public\src\less_components\emotions.less
// Emotion wrapper
.emotion--wrapper {
display: block;
margin: 0 auto;
max-width: 1160px;
overflow: hidden;
&.is--fullscreen {
max-width: none;
}
}
Wie wäre es den Parameter max-width in dem Template z.B. auf 1240px zu setzen? Dann solltest du nur noch einen kleinen Abstand zum Rahmen haben…
Liebe Grüße
Kevin
Ich habe das gerade mal probiert, leider klappt das bei mir nicht 
Also ich habe mal in einer all.less folgende Einstellungen kurz bei mir getestet:
@media screen and (min-width: @desktopViewportWidth) {
.content-main--inner {
.unitize-padding(0, 10, 50, 10);
}
}
.emotion--wrapper {
max-width: 1240px;
}
Hier hat sich der Abstand in jedem Fall verringert bei mir…
Vielleicht gibt uns hms auch noch ein Feedback dazu
Liebe Grüße
Kevin
Also ich habe mal in einer all.less folgende Einstellungen kurz bei mir getestet:
@media screen and (min-width: @desktopViewportWidth) {
.content-main–inner {
.unitize-padding(0, 10, 50, 10);
}
}.emotion–wrapper {
max-width: 1240px;
}Hier hat sich der Abstand in jedem Fall verringert bei mir…
Vielleicht gibt uns hms auch noch ein Feedback dazu
Liebe Grüße
Kevin
Sorry war kurz aus dem Hause.
Ich teste es gleich einmal und melde mich wieder!
Gruß
HMS
Also ich habe mal in einer all.less folgende Einstellungen kurz bei mir getestet:
@media screen and (min-width: @desktopViewportWidth) {
.content-main–inner {
.unitize-padding(0, 10, 50, 10);
}
}.emotion–wrapper {
max-width: 1240px;
}Hier hat sich der Abstand in jedem Fall verringert bei mir…
Vielleicht gibt uns hms auch noch ein Feedback dazu
Liebe Grüße
Kevin
Hallo Kevin,
Daumen hoch und vielen Dank, mein Template übernimmt die Änderungen und stellt diese nun so dar wie ich es gerne hätte!
Vielen Dank.
Kann ich auch eine Frage zum Background des Headers an Dich stellen oder wäre das zu viel des Guten???
Gruß
HMS
Hallo Kevin,
ich habe das jetzt auch mal so probiert. Würdest du vielleicht auf meinen Shop auch mal schauen?
Unten auf der Startseite scheint es zu passen, nur die Bildchen und der Slider der Einkaufswelten will nicht.
Ich danke dir
Hey Hms,
kannst gerne fragen :)
@livaro2014:
Der Slider bekommt ein Styling inline hinzugefügt und überschreibt deine Änderungen in der less-Datei.
Versuche einmal mit
max-width: 1240px !important
zu arbeiten.
Dann sollte deine Breite greifen. Spannend wird dann nur sein, ob sich die restlichen Boxen dann auch korrekt in der Breite verhalten…
lg
Kevin
Hey Kevin,
dass war ja ein super Tipp! Funktioniert
Musst nur noch diesen Zusatz machen:
.content–home {
margin-top: 10px;
}
sonst belässt er oben 50px weissen Rand.
Dankeeeeeeeeeeee
Hier nochmal der ganze Code, falls es noch jemand benötigt:
(einfach eine zum Beispiel background-custom.less im eigenen Template anlegen, in der all.less den Pfad angeben und diesen Code:
@media screen and (min-width: @desktopViewportWidth) {
.content-main–inner {
.unitize-padding(0, 10, 50, 10);
}
}
.emotion–wrapper {
max-width: 1240px !important
}
.content–home {
margin-top: 10px;
}
super, wenn es geklappt hat :)
Schönes Wochenende euch.
Liebe Grüße
Kevin