2. Anliegen: Ankündigungsleiste rutscht in der Mobilen Version immer über den Header + Titel Vidbann

Topic summary

Hauptproblem: In der mobilen Ansicht eines Shopify-Shops rutscht die Ankündigungsleiste in den Header, und der Videobanner-Titel wird nicht in einer Zeile, sondern mit Absätzen angezeigt.

Ursache identifiziert: Die Ankündigungsleiste nimmt die Höhe des größten Inhalts an. Eine Slide enthält zu viel Text (französischer Rabatt-Text), was das Layout stört.

Lösungsansätze:

  • Textkürzung: Den problematischen französischen Text in der Ankündigungsleiste kürzen
  • CSS-Anpassung für Videobanner-Titel: Code zur Verkleinerung der Schriftgröße in der mobilen Ansicht wurde vorgeschlagen
  • Alternative CSS-Lösung: BSS-TekLabs bot eine Lösung durch Hinzufügen von CSS-Code in die theme.liquid-Datei vor dem </head>-Tag

Status: Problem wurde erfolgreich gelöst, vermutlich durch Kombination der vorgeschlagenen Lösungen oder mit Hilfe eines anderen Partners. Der Shopschutz wurde während der Fehlersuche aufgehoben, um den Link zu teilen.

Summarized with AI on November 6. AI used: claude-sonnet-4-5-20250929.

Hallo liebe Community,

ich kämpfe seit Stunden mit mit der Ankündigungsleiste in der Mobilen Version meines Shops. Es rutscht immer in den Header. Ich habe bestimmt 15 Css Codes probiert, die es entweder nur verschlimmern, oder gar nichts bewirken. Ich weiß nicht mehr weiter und ich möchte dieses Problem schnell lösen damit ich endlich Ad´s schalten kann. Die meisten Konsumenten bestellen halt über das Smartphone und da muss halt alles zumindest ordentlich aussehen.

Ich hoffe jemand kann mir helfen.

Anbei ein Screenshot:

  1. Anliegen: Auch wieder in der Mobilen Version.

Der Titel meines Videobanners in der Mobilen-Version ist nicht in einer Zeile sondern mit Absatz. Ich hätte das Wort gerne zusammen in einer Leiste wie bei der Desktop-Version.

Anbei ein Screenshot der Mobilen- fehlerhaften Version:

Ich hoffe Ihr könnt mir helfen und bedanke mir voraus!

1 Like

@AMidani hierfür benötigen wir definitiv einen Link zum Shop.

Aus dem Stegreif kann man dazu leider keine direkte Antwort geben, da das Verhalten Theme-Abhängig ist.

1 Like

Hello @AMidani
Our team is ready to help you.
Please share your website address and access password (if necessary) so that we can check and assist you.

Hallo Finer,

danke für deine Antwort!

Reicht hierbei der Link also die Domain meines Shops aus ? Des Weiteren habe ich den Shop zur Zeit mit einem PW geschützt weshalb dieser einfach so nicht geöffnet werden kann. Soll ich den Schutz aufheben ?

Und vor allem Kostet dies etwas haha ? :'D Hab noch keine Erfahrung mit Shopify-Partnern

Hello,

Thanks for the Answer!

do you need my acces PW for the Shop because I closed it with a pw or my acc pw (this one I doubt) ?

Sorry I don#t have much experience so far.

1 Like

I just need the link to your website to check and give you a solution.

@AMidani in diesem Fall kannst du mir auch einen Vorschaulink mit PW.

Das Passwort findest du unter Vertriebskanäle → Online-Shop → Konfiguration → Passwort (ganz unten)
Ansonsten sehe ich ja nicht die Ankündigungsleiste.

In der Community braucht es nicht mehr als ein Danke :wink:

du kannst aber jederzeit über das Partner-Directory Shopify Partner suchen (falls nötig).

Okay Finer danke dir für die Info!

Habe den Schutz nun aufgehoben.

Anbei der Link meines Shops: https://jenecessite.fr/

@AMidani , perfekt. Das Problem ist, dass einer der Inhalte (eine Slide) zuviel Text enthält. Der Slider nimmt in diesem Fall die Höhe des “größten” Inhaltes. Wenn du den Text “!Achetez deux articles et bénéficiez de 50 % de réduction sur un troisième produit de votre choix!” abkürzt, passt es wieder.

Den zweiten Punkt schaue ich mir noch an

1 Like

@AMidani du müsstest für die mobile Ansicht die Textgröße anpassen. Folgenden CSS Code kannst du dafür verwenden:

.videoBackground .videoBoxInfoTitle{
font-size:35; 
}

/* nur ein Beispiel für eine kleinere Schrift */

Das kannst du in den benutzerdefinierten CSS des Abschnitts eintragen.

Super Nett danke dir! Füge ich sofort ein und gebe Bescheid!

Interessant, sowas ähnliches kam mir tatsächlich auch in den Sinn! Danke dir probiere es aus!

  • Here is the solution for you @AMidani
  • Please follow these steps:

  • Then find the theme.liqid file.
  • Then add the following code at the before tag and press ‘Save’ to save it.

  • Here is the result you will achieve:

  • Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful. Thank you.

Den habe ich genau so eingefügt, es hat sich aber leider nichts geändert. Das Problem hat sich aber nun durch die Hilfe von einem anderen Partner gelöst. Dennoch vielen lieben dank!

Great It actually worked! Thank you.

1 Like

Glad to help you. Have a good day.

1 Like