Support » Allgemeine Fragen » Passwortgeschützter Bereich

  • bqrtek17

    (@bqrtek17)


    Guten Abend,

    ich habe heute einen passwortgeschützten Bereich erstellt und soweit hat alles geklappt. Geht man nun aber im frontend auf die Seite erstreckt sich der Bereich in welchen man das Passwort eingibt sowie der Text über die ganze Seite, von einem Bildschirmrand zum anderen. Ich würde gerne das ganze reduzieren, sodass es weiter in der Mitte ist. Meine Widgets im Elementor habe ich alle auf Boxed umgestellt.

    Die Seite, für die ich Hilfe brauche: [Anmelden, um den Link zu sehen]

Ansicht von 7 Antworten - 1 bis 7 (von insgesamt 7)
  • namenlos

    (@namenlos)

    Dein Passwort Form hast du mit einem Plugin erstellt? Bei Elementor sollte das mit einem Shortcode in den Abschnitt eingefügt werden.

    bqrtek17

    (@bqrtek17)

    Nein, ich habe über WordPress auf Seiten –> Erstellen –> Sichtbarkeit –> Passwortgeschützt die Seite erstellt.

    namenlos

    (@namenlos)

    Dann muss es mit CSS gemacht werden. Bei den Customizer kannst du deine eigene CSS Angaben machen.

    .post-password-form {
        text-align: center;
        margin: 40px 80px 50px 60px;
    }

    text-align stellt alles in die Mitte und ich hab den Abstand Margin mit hinzugefügt.

    40px steht für den Abstand oben
    80px steht für den Abstand rechts
    50px steht für den Abstand unten
    60px steht für den Abstand links

    Diese musst du denn nach belieben anpassen. Aber diese gilt jetzt für alle Endgeräte, egal ob Desktop oder Smartphone.

    namenlos

    (@namenlos)

    Hier noch ein Text für bessere Optik

    #pwbox-141 {
        width: 50%;
    }
    namenlos

    (@namenlos)

    Hier ein Beispiel

    • Diese Antwort wurde geändert vor 1 Jahr von namenlos.
    • Diese Antwort wurde geändert vor 1 Jahr von namenlos.
    • Diese Antwort wurde geändert vor 1 Jahr von namenlos.
    bqrtek17

    (@bqrtek17)

    Vielen Dank dir sieht jetzt viel besser aus!

    namenlos

    (@namenlos)

    Kein Problem. Soll dir das Eingabefeld noch zu groß sein kannst das noch kleiner machen und statt 50% dann

    #pwbox-141 {
        width: 30%;
    }

    ändern.

    Probier dich aus und ändere die 30 in weniger oder mehr um, wie du es magst.

    P.S. Die PX bei Margin habe ich bewußt unsymetrisch gewählt, damit du die Positionen leichter unterscheiden kannst. Links und Rechts würde ich aber den gleichen Abstand angeben, das fällt sonst gerade bei schmalen Display wie den Smartphone sehr auf.

    • Diese Antwort wurde geändert vor 1 Jahr von namenlos.
    • Diese Antwort wurde geändert vor 1 Jahr von namenlos.
Ansicht von 7 Antworten - 1 bis 7 (von insgesamt 7)
  • Das Thema „Passwortgeschützter Bereich“ ist für neue Antworten geschlossen.