Größe Logo

Shopware 5 Installation/Einstieg
1

Hallo,

 

ich habe mein eigenes Logo eingebunden…hat soweit geklappt. Allerdings möchte ich vergrößern auf 300x105 px.

In dieser Größe habe ich das Logo auch hochgeladen.

Ich habe die 3 Less Dateien aus dem Responsive Theme in mein eigenes Theme kopiert und die in die all.less am Ende 

 @import "modules";

und in die modules.less

 @import "\_modules/header";

und in die header.less

// Desktop @media screen and (min-width: @desktopViewportWidth) { .header-main { .logo-main { .logo–link, .logo–shop { .unitize-height(105, 16); // Logohöhe = 105px } } }

Trotzdem ist das Logo winzig wie das original “DemoShop” Logo.

Kann mir jemand sagen was falsch ist?

LG

 

 

2

Nur um sicher zu gehen: Du hast das Attribut ja erst ab @desktopViewportWidth gesetzt. Ist der Browserfenster auch sicher größer als 1260px? (Achtung bei „Retina“/Hochauflösenden Monitoren, da wird oft skaliert. Teste es mal indem du die Seite mit CTRL + „-“ verkleinerst.)

Außerdem würde ich dir empfehlen bei .unitize-height den zweiten Paramter wegzulassen. Der ist im Standard sowieso auf 16 gesetzt und skaliert je nachdem wie die base-font-size gesetzt ist. Dieses „Feature“ hebelst du aus, wenn du es statisch auf 16 setzt. Sprich:

.unitize-height(105);

Sollte das nicht helfen würde ich prüfen, ob dein Less Code überhaupt eingebunden wurde.

Viele Grüße

3

Hi,

 

beim verkleinern auch keine Änderung. Habe die 16 nun weggelassen, nach deinem Hinweis. Aber das Logo bleibt unverändert.

Im Quellcode finde ich den Less Code nicht. Aber woran kann das liegen?

4

Mein Senf dazu:

Es gibt auch kostenlose Module die das erledigen.

Gib mal im plugin-manager oben links “logo größe” ein.

5

Hatte dasselbe Problem. Das Plugin, das ich gefunden habe, funzt prima, macht aber auch den Header höher. Ich habe einfach das Logo auf pos. absolute gesetzt, damit man den Weißraum oben nutzen kann. Die Breite dann über max-height steuern:

@media screen and (min-width: 768px) {
  .logo--link img{
    max-height: 5rem;
    position: absolute;
    top: -1.5rem;
  }
}