Suchfeld in Handy-Ansicht verrutscht

SFrueh

Hallo Forum,

meine Webseite: https://dark-festivals.de
Neueste Wordpress-Version

Ich habe ein Problem! Urplötzlich ist das Suchfeld in der Handy-Ansicht verrutscht. Es sollte eigentlich in der Menüleiste sein, auf einmal ist es aber IM (!!) Header meiner Seite gelandet. Das sieht natürlich bescheiden aus und niemand kann mehr den Titel meiner Seite lesen.

Vom PC aus ist alles ganz normal: Das Suchfeld ist in der Menüleiste. Ja selbst wenn man das Handy querhält ist das Suchfeld da wo es sein soll.

Aber wenn man das Handy normal hochkant hält, dann sieht es aus wie es jetzt leider aussieht :eek::confused:

Hat jemand eine Idee?

Viele Grüße,

SFrueh

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

uha

Ich würde das Input-Feld bei der Handy-Ansicht ausblenden, denn du hast dann nicht wirklich Platz dafür. Damit sollte es im Custom-CSS gehen:

Code

@media (max-width: 650px) {
  #branding #searchform {
    display: none;
  }
}

SFrueh

Hallo!

Danke für die Rückmeldung.
Der Code funktioniert, aber einfach kein Suchfeld zu haben ist keine Option :(
Wir sind keine statische Webseite, sondern eine mit sehr vielen (auch älteren) Beiträgen. Die Leute suchen gezielt nach ihren Lieblingsbands.

Wir können nicht auf das Suchfeld verzichten.

Ich verstehe auch nicht, warum es auf einmal da oben hingerutscht ist. Wir benutzen Wordpress seit 2013 und die letzten 12 Jahre hat es auch vom Handy aus problemlos funktioniert.

Sieht jemand eine andere Möglichkeit? :) Kann man für die Handyansicht zwischen Header und Menüleiste noch eine Zeile einfügen? Oder der Menüleiste in der Handyansicht eine Zeile mehr geben? Einfach damit das Suchfeld irgendwo Platz hat.

Vielen Dank fürs Lesen,

SFrueh

b3317133

Wo genau war das Suchfeld denn die letzten 12 Jahre in der Handyansicht?

Ergänzung: Lt. Wayback Machine Archiv war bisher offenbar extra CSS-Code dafür hinterlegt, der wurde wohl gelöscht.

Du kannst diesen aus einer alten Version der Seite im Archiv extrahierten Code in Design > Customizer > Zusätzliches CSS wieder einfügen:

Code

@media all and (max-width:650px) {
    #branding .with-image #searchform {
        position: static;
        right: 0;
        top: 0;
        left: 0;
        bottom: 0;
        width: 100%;
        float: none;
        max-width: 100%
    }
    #branding .with-image #searchform:after {
        content: "";
        display: block;
        clear: both;
        float: none;
        height: 0;
        visibility: hidden
    }
    #branding .only-search #s,
    #branding .only-search #s:focus {
        float: none;
        width: calc(100% - 40px);
        max-width: 100%;
        position: static;
        top: initial;
        right: initial;
        left: initial;
        bottom: initial
    }
}

Alles anzeigen

SFrueh

Ich werde komplett verrückt!!! :eek:
Danke b3317133!

Im Leben wäre ich nicht darauf gekommen, dass meine zusätzlichen CSS auf einmal verschwunden sind. Die haben viele Jahre lang jedes Wordpress- und Theme-Update überlebt.

Problem gelöst, jetzt funktioniert es wieder.

Vielen vielen vielen Dank! :):):):)

b3317133

Es gab lt. Archiv früher im zusätzlichen CSS auch noch diese beiden Regeln, falls Du die noch brauchst:

CSS

.wp-caption img {
    display: block;
    max-width: 100%;
    height: auto
}
.ngg-albumoverview {
    margin-top: 10px !important;
    margin-bottom: 10px !important
}

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Suchfeld in Handy-Ansicht verrutscht

Jetzt mitmachen!