CSS - Gestaltung/ Design von Beiträgen

  • Hallo zusammen,

    ich als völliger WP-Newbie hätte mal eine wahrscheinlich simple Frage:

    auf http://stepbystep-yourbestversion.de/ seht ihr die Beiträge schön in weiß umrandet und auch im Hintergrund ist alles schön weiß. Somit hat jeder Beitrag ein schönes eigenes Gebilde, was sich von der Homepage abgrenzt.

    Genau das würde ich gerne auf dieser Seite auch gestalten. Wie setze ich das um? Einen Rahmen habe ich schon hinbekommen, aber das sah aus wie ******...
    http://monyes.de/

    Ich denke ihr habt meine Sorgen verstanden, wenn ihr auf beiden Seiten wart :)
    Über Hilfe würde ich mich sehr freuen.


    Liebe Grüße

    Jan

    • 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

  • Hier mit URL Shortener...oben kann gelöscht werden. Sorry, Regeln eben erst gesehen!

  • Wenn ich Dich richtig verstanden habe und es Dein Ziel ist, die einzelnen Beiträge optisch abzugrenzen, dann wäre dieses hier:
    .blog-item-wrap {background-color: #fff; padding: 0% 3%; margin: 1% 0%;}
    mein erster Ansatz - das ist noch nicht "hübsch", aber es sollte Dir eine Vorlage liefern mit der Du arbeiten kannst.

    Man kann die Realität ignorieren - aber nicht die Folgen der ignorierten Realität.

  • Wenn ich Dich richtig verstanden habe und es Dein Ziel ist, die einzelnen Beiträge optisch abzugrenzen, dann wäre dieses hier:
    .blog-item-wrap {background-color: #fff; padding: 0% 3%; margin: 1% 0%;}
    mein erster Ansatz - das ist noch nicht "hübsch", aber es sollte Dir eine Vorlage liefern mit der Du arbeiten kannst.

    das hast du wo eingefügt? Wenn ich es bei style.css unterbringe verändert sich leider nichts.

  • Am Ende der style.css - so sieht es dann bei mir aus:

    Hast Du ggf. ein Cache-Addon aktiviert? Ansonsten mal das neuladen mit Strg + F5 probieren.

    Man kann die Realität ignorieren - aber nicht die Folgen der ignorierten Realität.

  • Am Ende der style.css - so sieht es dann bei mir aus:
    [ATTACH=CONFIG]15720[/ATTACH]

    Hast Du ggf. ein Cache-Addon aktiviert? Ansonsten mal das neuladen mit Strg + F5 probieren.

    das gibts doch nicht...ich habe es original so drin und es sind immernoch nur die Umrandungen drin, obwohl ich das komplette style.css neu reingeladen habe.

    so habe ich es gemacht:

    /* Layout */


    .has-sidebar-left #secondary {
    padding-right: 40px;
    }
    .no-sidebar {
    float: none;
    margin: 0 auto;
    }
    .full-width {
    width: 100%;
    }
    .blog-item-wrap {background-color: #fff; padding: 0% 3%; margin: 1% 0%;}

  • Am Ende der style.css - so sieht es dann bei mir aus:
    [ATTACH=CONFIG]15720[/ATTACH]

    Hast Du ggf. ein Cache-Addon aktiviert? Ansonsten mal das neuladen mit Strg + F5 probieren.


    [COLOR=#222222][FONT=Times]Ich habs! Vielen Dank! Krank. ich habe es eben mal am Ipad ausprobiert. Der alte IMAC hat da wohl nicht mehr mitgespielt :/

    DANKE DIR ! Das einzige was ich jetzt noch ändern würde, wäre, dass wenn ich auf einen Beitrag geklickt habe, die Überschrift nicht direkt oben am weißen Rand klebt...aber puhhhhh

    Help again? :confused:[/FONT][/COLOR]

  • [COLOR=#222222][FONT=Times]die Überschrift nicht direkt oben am weißen Rand klebt[/FONT][/COLOR]


    Das:
    .entry-header > .entry-title {padding-top: 20px;}
    schafft einen dezenten Abstand nach oben - Pixelzahl individuell an Deine Wünsche anpassen.

    Man kann die Realität ignorieren - aber nicht die Folgen der ignorierten Realität.

  • Das:
    .entry-header > .entry-title {padding-top: 20px;}
    schafft einen dezenten Abstand nach oben - Pixelzahl individuell an Deine Wünsche anpassen.

    Hervorragend! Vielen Vielen Dank! :-)

    ich habe noch einige Dinge, die ich gerne verändern würde. Alles mal nach und nach angehen, würde es gerne auch besser lernen wollen. :-)

  • Hallo zusammen, ich mal wieder :-)

    seit dem neusten Update bei Wordpress funktioniert meine oben programmierte Sache nicht mehr. Also entry-header usw...

    http://bit.ly/2bJNVZS

    kann mir jemand sagen, was ich ändern muss? Am Ipad z.b. wird alles noch wie gewohnt dargestellt. Am Imac bzw. Iphone leider nicht mehr...da ist jeder einzelne Post nicht mehr weiß hinterlegt, sondern wieder in der Hintergrundfarbe...

    HILFE! :lol:

  • Hallo zusammen, ich mal wieder :-)

    seit dem neusten Update bei Wordpress funktioniert meine oben programmierte Sache nicht mehr. Also entry-header usw...

    http://bit.ly/2bJNVZS

    kann mir jemand sagen, was ich ändern muss? Am Ipad z.b. wird alles noch wie gewohnt dargestellt. Am Imac bzw. Iphone leider nicht mehr...da ist jeder einzelne Post nicht mehr weiß hinterlegt, sondern wieder in der Hintergrundfarbe...

    HILFE! :lol:

    okay kann es sein, dass nach jedem Update generell die nachträglich hinzugefügten Codes gelöscht werden aus dem Theme? Die waren einfach weg. Problem so halbwegs wieder gelöst...mal abwarten.

    Und eine Frage zu dem Plugin Jetpack: Dieses funktioniert seit dem Update auch nicht mehr so richtig...habt ihr da ein gutes Plugin welches mir sämtliche Statistiken aufweist?

    liebe grüße

  • klar, wenn das Theme ein Update bekommt, dann sind deine Änderungen weg. Also entweder ein Child-Theme anlegen oder mit einem Custom Css Plugin arbeiten.

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

Jetzt mitmachen!

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