WordPress Tipps: Kommentare des Artikelautors hervorheben

Die Kommentare der Artikelautors beson­ders hervor zuheben, ist eine beliebte Technik in WordPress-Blogs. So erkennen die Leser die Antworten des Autors schnell, und es sieht auch gleich viel über­sicht­li­cher aus. Und wie macht man das? Es ist eigent­lich ganz ein­fach, du musst nur den comments.php Code deiner WordPress-Version anpassen.

WordPress Tipps: Kommentar des Artikelautors hervorheben

Das Kommentar des Artikelautors hat eine dunk­lere Hintergrundfarbe

1. comments.php anpassen

Öffne die Datei comments.php (du fin­dest die Datei in wp-content/themes/DeinThemeName/comments.php).
Suche nach fol­gendem Code-Schnipsel:

<ol class="commentlist"> <?php wp_list_comments();?> </ol>

Ersetze in mit diesem Code:

<ol class="commentlist">
  <?php foreach ($comments as $comment) : ?>
  <li class="<?php echo $oddcomment; ?> <?php if ($comment->comment_author_email == get_the_author_email()) { echo 'author_comment'; } ?>" id="comment-<?php comment_ID() ?>"> <?php echo get_avatar( $comment, 80 ); ?>
    <?php comment_text() ?>
    <p><cite>
      <?php comment_type(_x('Comment', 'noun'), __('Trackback'), __('Pingback')); ?>
      <?php _e('by'); ?>
      <?php comment_author_link() ?>
      &#8212;
      <?php comment_date() ?>
      @ <a href="#comment-<?php comment_ID() ?>">
      <?php comment_time() ?>
      </a></cite>
      <?php edit_comment_link(__("Edit This"), ' |'); ?>
    </p>
  </li>
  <?php /* Changes every other comment to a different class */ $oddcomment = ( empty( $oddcomment ) ) ? 'alt' : ''; ?>
  <?php endforeach; /* end for each comment */ ?>
</ol>

In der 4. Zeile habe ich eine if-Bedingung ein­ge­fügt, die sagt:
Wenn die Email-Adresse im Kommentar, der des Artikelautors ent­spricht, füge den Text »author_comment« ein.

2. CSS Code einfügen

Jetzt musst du nur noch in der Datei style.css (in wp-content/themes/DeinThemeName/style.css) den CSS Code für das Kommentar des Autors definieren.

Füge dazu in style.css fol­genden Code ein:

ol.commentlist .author_comment {
background: #D8CEBA;
border-top: #AA968D solid 1px;
border-bottom: #AA968D solid 1px;
}

Mein CSS Code ändert die Hintergrund-Farbe des Kommentars, und fügt oben und unten eine 1Pixel breiten Rand hinzu.
Du kannst deinen Code natür­lich anpassen, wie du es magst.

Ich hoffe mein WordPress Tipp hat dir geholfen, wenn du Fragen oder Feedback, schreibe doch unten einen Kommentar.

2 Kommentare

  1. Andreas

    Danke für den Tipp! In den meisten Blogs funk­tio­niert auch ein­fach ».bypost­author { background-color:#B2CCFF !important; }« an das Ende der .CSS Datei zu hängen, wobei #B2CCFF je nach gewünschter Farbe geän­dert werden muss.

    Viele Grüße,
    Andreas

Hinterlasse eine Antwort

Pflichtfelder sind mit * markiert.

*


Top