WordPress Post Meta ausblenden: Wie Sie Autor und Datum eines Beitrags entfernen

WordPress Post Meta Angaben im Twenty Sixteen Theme
Das Theme Twenty Sixteen ordnet die Post Meta Angaben neben dem Beitragstext an

Es gibt gute Gründe, warum WordPress standardgemäß zu jedem Beitrag den Autor, das Veröffentlichungsdatum, die Kategorie und die Schlagwörter ausgibt: Immerhin handelt es sich bei WordPress von Haus aus um eine Blog-Software. Mehrere Autoren können am regelmäßigen Veröffentlichen von Beiträgen beteiligt sein, sie schreiben zu unterschiedlichen Themen – das alles sollte dann auch entsprechend ausgezeichnet sein.

Wer aber auf Basis von WordPress eine Unternehmenswebsite erstellen und zwecks interessanterer Nutzererfahrung statt nur Seiten auch die Möglichkeiten von Kategorien und Beiträgen nutzen will, möchte vielleicht nicht zwangsläufig anzeigen, wann welcher Autor diese Beiträge erstellt hat. WordPress Post Meta ausblenden, das heißt, entweder alle oder einzelne dieser Angaben einfach nicht anzuzeigen. Das geht recht einfach per CSS. Die Modifikation der entsprechenden php-Dateien wäre natürlich auch ein Weg. Doch warum sich mit PHP herumschlagen, wenn es sich auch rein mit CSS machen lässt?

Für benutzerdefiniertes CSS stellt Twenty Sixteen keine Optionen zur Verfügung. Bei Themes, die das nicht bieten, macht es viel Sinn, mit dem WordPress Plugin Simple Custom CSS (oder einem Child-Theme) zu arbeiten, damit Ihre Anpassungen das nächste Theme-Update überstehen.
Update: Inzwischen bietet auch Twenty Sixteen die Option des zusätzlichen CSS.

Grundlegende Situation: Beiträge statt Seiten

Gehen wir zum Beispiel von einer Unternehmenswebsite aus, die gar nicht bloggen möchte und neben den Standardseiten Start, Kontakt und Impressum weitere Inhalte anbietet, die die eigentlichen Angebote darstellen. Das könnten Obst und Gemüse sein. Oder Fahrräder und Fahrradzubehör. Oder Haustiere und Zootiere.

Unabhängig vom konkreten Inhalt bietet es sich an, diese Angebote nicht als Seiten zu gestalten, sondern als Beiträge. Das Menü ruft dann die passende Kategorie ab (sagen wir: Zootiere) und stellt die dazu gehörenden Beiträge auf einer Kategorie-Seite in chronologischer Reihenfolge dar, den aktuellsten zuoberst. Diese Kategorie-Seite bietet also schon einmal eine gute Übersicht. Wer dann einen der dort angeteaserten Beiträge anklickt, kann in der Folge von Beitrag zu Beitrag navigieren.

Die Sache hat nur einen Haken: Standardgemäß liefert WordPress für alle Beiträge immer auch die zugehörigen Post Meta Angaben aus. Dabei bieten wahrlich nicht alle Themes die Möglichkeit, dies mit einem einzigen Klick in den Einstellungen abzuschalten. Sie aber möchten nicht, dass Ihre Angebote auf diese Weise datiert sind. Den Autoren wollen Sie wahrscheinlich auch nicht angeben. Einzig die Verlinkung zu weiteren Beiträgen dieser Kategorie oder zu passend verschlagworteten Beiträgen macht auch hier durchaus Sinn. Was also tun?

Post Meta Angaben ausblenden – am Beispiel vom Twenty Sixteen Theme

Das aktuelle Twenty-Theme, mit dem WordPress ausgeliefert wird, heißt Sixteen und ist, was seine Anpassungsoptionen betrifft, nicht allzu opulent ausgestattet. Entsprechend bietet es auch nicht die Möglichkeit, ungewünschte Post Meta Angaben einfach abzuschalten. Dafür hält es sich, was seinen strukturellen Aufbau betrifft, an Standards. Es benutzt also CSS-Klassen wie .entry-content (Beitragsinhalt), .byline (Autor) oder .posted-on (Veröffentlichungsdatum). Dennoch erfordert es ein wenig Analyse des konkreten Aufbaus, um herauszufinden, wie die einzelnen Elemente angesprochen werden können.

Die drastische Variante: Alle Post Meta Angaben ausblenden

Das Twenty Sixteen Theme zeigt die Post Meta Angaben links neben dem eigentlichen Beitragsinhalt. Über beiden Spalten thront das Beitragsbild. Verantwortlich für diese grundsätzliche Aufteilung unterhalb des Beitragsbildes sind zwei Container mit den Klassen .entry-footer und .entry-content und ihren CSS-Definitionen.

Der Container mit der Klasse .entry-footer beinhaltet dabei alle WordPress Post Meta Angaben. Wenn Sie diese komplett ausblenden wollen, reicht es, dieser Klasse die entsprechende Definition zu geben – und die lautet:

.entry-footer {
display:none;
}

Dieses Vorgehen ist in jeder Hinsicht drastisch. Nicht nur blendet es wirklich alle Post Meta Angaben aus – also auch solche wie die Kategorie oder die Schlagwörter, die auch bei nicht als Blog-Post verstanden Beiträgen sinnvoll sind. Es sorgt auch dafür, dass sie auf keiner Seite mehr erscheinen. Das ist keine unerhebliche Erkenntnis, denn das Theme arbeitet mit einer Unterscheidung von Beitrags- und Archivseiten vor allem im Gegensatz zu Suchergebnisseiten. Mehr dazu später.

Breite des Beitrags

Durch dieses drastische Vorgehen entsteht ganz nebenbei auch ein unschöner Effekt: An der Stelle, wo die Post Meta Angaben bislang standen, erscheint nun nichts mehr. Auch nicht der Beitragstext. Man könnte meinen, dass der sich den nun zur Verfügung stehenden Platz einfach nimmt. Das kann er aber nicht, denn das Theme gibt vor, dass der entsprechende Container nur gut 71% des gesamt zur Verfügung stehenden Raumes einnehmen kann (width). Wir aber gönnen .entry-content nun die volle Breite. Wie bei der Angabe zum Ausblenden des .entry-footer überschreibt auch die Änderung der Breite des .entry-content die im Theme direkt hinterlegte Definition.

Die Definition für .entry-content ist im Twenty Sixteen Theme allerdings ein wenig komplexer: Sie bezieht Unterschiede zur Darstellung des Beitrags als Suchergebnis (.search-result) sowie Unterschiede in der Darstellung unterschiedlicher Inhaltsarten (Beitrag, Seite, Anhang, Revision und Menüeintrag; .type-page) mit ein und lautet deshalb:

body:not(.search-results) article:not(.type-page) .entry-content {
width: 100%;
}

Herausfinden lassen sich solche Angaben wie immer mittels der Funktion Element untersuchen (oder Prüfen…) Ihres Browsers.

Das Ergebnis dieser beider CSS-Angaben sieht nun entsprechend aus:

Ergebnis, wenn alle WordPress Post Meta Angaben ausgeblendet sind
Alle Post Meta Angaben sind verschwunden, der Beitragstext nutzt die volle Breite

Die bessere Variante: Kategorie und Schlagwörter nicht ausblenden

Selbst wenn Sie gar nicht bloggen wollen und Beiträge nur zur Darstellung Ihrer Unternehmensinhalte nutzen, macht es sehr viel Sinn, die Kategorien und Schlagwörter nicht auszublenden. So bieten Sie Ihren Nutzern eine weitere Möglichkeit der Navigation. In diesem Fall müssen wir uns also die einzelnen Posten, die Twenty Sixteen im .entry-footer zusammenfasst, im Detail anschauen:

  • .byline – Beitragsautor
  • .posted-on – Veröffentlichungsdatum
  • .cat-links – Kategorie(n)
  • .tags-links – Schlagwörter
  • .entry-format – Formatvorlage
  • .edit-link – die Möglichkeit des direkten Zugriffs auf die Bearbeitung
  • .comments-link – Link zu den Beitragskommentaren

Um herauszufinden, wie diese Post Meta Angaben vom Theme genau angesprochen werden, kommen wir nicht darum herum, einen Blick in die style.css zu werfen – siehe hierzu: Design -> Editor. Wie bei jedem Theme ist auch die style.css von Twenty Sixteen recht umfangreich. Es macht also viel Sinn, hier die Suchfunktion des Browsers zu nutzen und dort zum Beispiel nach .byline zu suchen. So finden Sie schnell die vorhandene Definition für diverse Elemente, die im Fall von Twenty Sixteen wie folgt lautet:

CSS-Definition Original

.single .byline,
.full-size-link,
body:not(.search-results).group-blog .byline,
body:not(.search-results) .entry-format,
body:not(.search-results) .cat-links,
body:not(.search-results) .tags-links,
body:not(.search-results) article:not(.sticky) .posted-on,
body:not(.search-results) article:not(.type-page) .comments-link,
body:not(.search-results) article:not(.type-page) .entry-footer .edit-link {
display: block;
margin-bottom: 0.5384615385em;
}

Kopieren Sie sich Ihr Suchergebnis zu Ihren benutzerdefinierte CSS-Definitionen und schreiben Sie es wie folgt um:

CSS Definition Änderung

.single .byline,
.full-size-link,
body:not(.search-results).group-blog .byline,
body:not(.search-results) .entry-format,
/* body:not(.search-results) .cat-links,
   body:not(.search-results) .tags-links, */
body:not(.search-results) article:not(.sticky) .posted-on,
body:not(.search-results) article:not(.type-page) .comments-link,
body:not(.search-results) article:not(.type-page) .entry-footer .edit-link {
display:none;
}

display:none; sorgt wieder für das Ausblenden, diesmal allerdings für ausgewählte Post Meta-Angaben. Denn durch Nutzung des Auskommentierens von CSS /*   */ sorgen Sie dafür, dass bestimmte Elemente und Klassen von dem Ausblenden unberührt bleiben. Im Beispiel sind die Kategorien und die Schlagwörter entsprechend auskommentiert.

Ihre Website gibt nun in der entsprechenden Spalte links vom Beitragstext die Kategorie(n) und die Schlagwörter aus, alles andere wird ausgeblendet. Dies tut sie allerdings nur – und das ist eine Besonderheit des Twenty Sixteen Themes – auf allen Seiten, die nicht Suchergebnis sind.

Um nun auch die Post Meta Angaben auf der Suchergebnisseite auszublenden, braucht es zudem eine extra Definition:

.search-results .byline,
.search-results .entry-format,
.search-results .posted-on,
.search-results .comments-link,
.search-results .edit-link {
display:none;
}

Das Ergebnis sieht dann wie folgt aus:

Beitrag mit Kategorien und Schlagwörtern
Dieser Beitrag zeigt seine Kategorien und Schlagwörter und blendet alles weitere aus

Weiteres CSS im Beispiel

Nachgeschoben noch für alle, die sich wundern und denken: »So sieht mein Twenty Sixteen aber gar nicht aus…«, hier noch kurz die CSS-Definitionen, die die weißen Hintergründe einzelner Container halbtransparent machen (und deshalb das unter Design -> Anpassen hinterlegte Hintergrundbild durchscheinen lassen), den Innenabstand vom Text zum Containerrand bestimmen und den Seitentitel ausblenden (also auch den Hinweis, auf welcher Kategorie-Seite Sie sich gerade befinden – auf Unternehmenswebsite, die nicht bloggen, eher unerwünscht):

.site, .site-header-main {
background-color: rgb(255, 255, 255);
background-color: rgba(255, 255, 255, 0.8);
  padding: 10px;
}

.site-main > article, .page-header, .widget {
padding: 20px;
background-color: rgba(255, 255, 255, 0.8);
}

.page-header {
display:none;
}

Beitragsbild: Britta Kretschmer

13 Anmerkungen zu “WordPress Post Meta ausblenden: Wie Sie Autor und Datum eines Beitrags entfernen

  • 30. Juni 2016 um 10:58
    Permalink

    Hallo!

    Das vorgeschlagene CSS für twenty sixteen
    body:not(.search-results) article:not(.type-page) .entry-content {
    width: 100%;
    }
    funktioniert am Desktop einwandfrei,
    aber sobald sich das Design an Tablet oder Smartphone anpasst,
    überlappt der Contentbereich auf der rechten Seite das Display.

    Hättest du eventuell ein CSS um das zu beheben, so dass die Beiträge auch mobil gut aussehen? :-)

  • 30. Juni 2016 um 12:35
    Permalink

    Hallo Julius,
    du hast recht, ich bin hier nicht auf das darstellende Gerät eingegangen. Damit es auf Phone und Tablet auch gut aussieht:
    @media screen and (min-width: 44.375em) {
    body:not(.search-results) article:not(.type-page) .entry-content {
    width: 100%;
    }}
    Sollte funktionieren!
    LG, bk

  • 28. August 2016 um 18:24
    Permalink

    Hallo Britta,

    zuerst einmal ganz lieben Dank für diesen Beitrag! Habe länger daran herumgemacht bis ich von dir den entscheidenden Tip erhalten habe, Avatar etc, sich nicht anzeigen zu lassen, nochmals vielen Dank!
    Blöderweise funktioniert bei mir der css Code zu Dartsellung auf IPAd etc nicht. Sprich die Darstellung verändert sich nicht durch Einfügen des Codes in die style.css. Hast du da noch eine Idee? Wäre super.

    LG

    Konrad

  • 29. August 2016 um 11:19
    Permalink

    Hallo Konrad,
    freut mich, dass ich zumindest schon mal ein bisschen weiterhelfen konnte!
    Zu deiner Frage: Vielleicht hilft schon der Blick auf meinen letzten Kommentar zu diesem Beitrag?
    LG, bk

  • 8. Januar 2017 um 13:29
    Permalink

    Guter Artikel um das ganze noch ein bisschen abzurunden würde ich noch ein Fazit machen.

  • 11. Januar 2017 um 21:57
    Permalink

    Hallo,
    bin gerade auf diesen Artikel aufmerksam geworden, tolle Info!
    Nur stehe ich auf dem Schlauch, was das Theme “Twentyseventeen” angeht. :-)
    Wie kann ich denn da die Post-Metas bearbeiten? ich stelle z. B. fest, dass Datum und Autor dasteht, ich hätte aber gerne noch eine Uhrzeit.
    Wo ist eigentlich die Kategorie und die Anzahl der Kommentare festgehalten? Die stehen im Theme nämlich unter dem Beitragstext – das würde schöner obendrüber aussehen.
    Herzlichen Dank!

  • 12. Januar 2017 um 16:44
    Permalink

    Hallo Stefan,

    Twenty Seventeen ist ja mal noch ganz frisch, da gibt es noch viel zu erkunden… So viel Erkenntnis jetzt schon mal: Die Autoren haben die einzelnen Bauteile in Unterverzeichnissen organisiert. Die content.php befindet sich zum Beispiel in einem Verzeichnis namens /template parts/post, die für die Ausgabe der Meta-Angaben verantwortliche template-tags.php hingegen (wie üblich) im Verzeichnis /inc.

    Die gewünschten Manipulationen wären also dort jeweils vorzunehmen, das aber auch nur im Rahmen eines Child Themes. Wie und was genau? Gut möglich, dass ich die Fragen mal aufnehme in einem meiner Beiträge 2017. Also bitte ein bisschen Geduld – oder mal im Forum von wordpress.org nachfragen.

    LG, bk

  • 17. Februar 2017 um 12:49
    Permalink

    Ich habe den Code von hier einfach kopiert und auf mein Theme angewendet (Twentyten), um zu sehen, ob es bei einem anderen Theme funktioniert. Hat leider nichts gebracht.
    D.h. ich muss mich wohl doch auf die Suche machen. Aber dieser Beitrag ist auf jeden Fall eine gute Orientierungshilfe. Danke schon mal dafür :-)

  • 17. Februar 2017 um 17:05
    Permalink

    Hallo E.B.,

    Autor und Datum sollten sich bei Twenty Ten mit einem display:none für die Klasse .entry-meta ausblenden lassen. Die Zeile mit Kategorie, Schlagwort und Permalink lässt sich über die Klasse .entry-utility ansprechen.

    LG, bk

  • 23. April 2017 um 22:15
    Permalink

    Schöner Beitrag, eine kleine Frage hätte ich noch.. Ich bekomme es einfach nicht hin Datum, Autor, Avatar und Kategorie neben einander zu haben. Den Beitragstext haben ich schon auf voller Breite und die Post Meta ist schon darunter, nur steht sie übereinander. Das sieht natürlich unschön aus deshalb hätte ich es gern nebeneinander, auf dem Handy ist es automatisch nebeneinander. Würde mich sehr über eine Tip freuen..

  • 25. April 2017 um 14:33
    Permalink

    Hallo Timo,

    ich verstehe die Frage so, dass es aussehen soll wie in den Suchergebnissen: oben Text, darunter in voller Breite die Meta-Angaben. Ist natürlich machbar, braucht aber schon ein paar Definitionen, bis es gut aussieht. Ich denke, dem Thema gönne ich in Bälde mal einen Beitrag…

    LG, bk

  • 22. Mai 2017 um 11:43
    Permalink

    Hallo,
    habe Seo Yoast installiert und die Tags deaktiviert, jetzt erhalte ich dafür von Search Console 404 Fehler angezeigt -Seite wurde nicht gefunden.
    Warum ist das so und wie kann ich das korrigieren?

  • 22. Mai 2017 um 13:42
    Permalink

    Hallo Scharlotte,

    der Statuscode 404 besagt, dass eine angeforderte Ressource nicht gefunden werden kann. Das passiert immer dann, wenn eine Seite oder ein Beitrag gelöscht wurde. Nun löscht Yoast SEO aber nichts, und auch das Ausblenden der Meta Angaben hat nichts mit Löschen zu tun. Für mich ist da kein Zusammenhang ersichtlich.
    Korrigieren lässt sich so ein 404-Fehler durch eine 301-Weiterleitung. Siehe hierzu: https://www.internetkurse-koeln.de/wordpress-301-weiterleitung-einrichten/

    LG, bk

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.