Sidebar Rahmen nur um Textfeld und nicht um Titel?

  • Kann ich im CSS irgendwie den Rahmen der Widgets nur um das eigendliche Widget und nicht um den Titel legen? Also wenn ich z.B. ein Text Widget in meine Sidebar lege dass dann der Rahmen nur um das Textfeld geht und nicht um Textfeld und Titelfeld?

    • Anzeige

    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

  • Guten Morgen,

    Ja das geht. Bei einem Text-Widget, wird der Text in einem Container mit der CSS-Klasse textwidget gelegt. Diese müsste den Rahmen erhalten.

    CSS
    .textwidget {
        border: 1px solid #000 !important;
    }

    Bei Listen könnte man folgendes machen:

    CSS
    .widget-container ul {
        border: 1px solid #000 !important;
    }

    Damit würden alle Listen innerhalb aller Widgets einen Rahmen bekommen.

    Oder explizit nur für ein einzelnes Widget. Hier am Beispiel der Kategorien-Übersicht:

    CSS
    .widget_categories ul {
        border: 1px solid #000 !important;
    }
  • super, vielen vielen Dank, genau das habe ich gesucht. Hätte ich mich bloß schon früher hier gemeldet, dann wäre mir eine Menge erspart geblieben.

    Wenn du sagst ich kann auch nur einzelne Widgets formatieren, woher weiß ich dann wie das Widget heißt welches ich umrahmen möchte wenn ich z.B. 3 Textfelder habe und möchte nur das 2. mit einem Rahmen versehen?

    Und kann ich auch allgemein um alle widgets einen Rahmen machen?

    Einmal editiert, zuletzt von Staigi (18. Juni 2010 um 12:27)


  • Wenn du sagst ich kann auch nur einzelne Widgets formatieren, woher weiß ich dann wie das Widget heißt welches ich umrahmen möchte wenn ich z.B. 3 Textfelder habe und möchte nur das 2. mit einem Rahmen versehen?

    Schaue dir am besten den Code des Widget im Quelltext an. Dort findet sich zu jedem Widget eine eindeutige ID. Hier am Beispiel eines Textfeldes:

    HTML
    <li id="text-3" class="widget-container widget_text">
       <h3 class="widget-title">Titel</h3>
       <div class="textwidget">Text</div>
    </li>


    Die ID wäre hier text-3 und kann über

    Code
    #text-3 .textwidget {
       border: ...
    }


    direkt angesprochen werden.


    Zitat

    Und kann ich auch allgemein um alle widgets einen Rahmen machen?

    du hättest hier zwei Möglichkeiten:

    1.) Über die allgemeine Widget-CSS-Klasse:

    Code
    .widget-container {
       border: ...
    }


    Hiermit würden das gesamte Widget einen Rahmen bekommen (samt Titel und Inhalt).

    2.) Wenn nur der Inhalt ohne Titel einen Rahmen haben soll, muss für jedem Widget-Typ dies extra festgelegt werden:

    Code
    .widget-container ul ,
    .widget_tag_cloud div,
    .textwidget {
       border: ....
    }
  • Ich danke dir Marcel, echt super. Noch eine letzte Frage, wie heißen denn die ganzen Widget-Typen?

    Einmal editiert, zuletzt von Staigi (18. Juni 2010 um 22:50)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!