css - Wordpress - ユーザーがログインした後に表示されるユーザー名の色を変更するには?

Question

ユーザーがログインすると、WP-Members は次のように言います: 「ユーザー名」としてログインしています。色を変更するために CSS でこのユーザー名を参照する方法は?

Answer 1

これを行う方法は、それをフィルタリングすることです。status - wpmem_sidebar_statusにログインしたサイドバー用のフィルターフックがあります。サイドバー ステータスの HTML の文字列がフィルターに渡されます。それは次のようになります。

<p>You are logged in as username<br />
<a href="http://logoutlink">click here to log out</a>

そのため、スタイルを設定するためにユーザー名に何らかの CSS を適用する場合は、何かを定義する必要があります。ユーザー名を span タグでラップする必要があります。しかし、どうすればそれができますか？

str_replace特定の文字列または文字列の配列に対して検索と置換を行います。したがって、ユーザー名の前のテキストをそのテキストと開始スパン ラッパーで置き換えることができます。このタグを、<br />span の終了タグと タグで置き換えることができ<br />ます。

add_filter( 'wpmem_sidebar_status', 'my_sidebar_status' );

function my_sidebar_status( $string ) {

    /** The original pieces **/
    $old = array(
        'You are logged in as',
        '<br />',
    );

    /** The replacements **/
    $new = array(
        'You are logged in as <span class="my_class">',
        '</span><br />',
    );

    /** Do the search/replace **/
    $new_string = str_replace( $old, $new, $string );

    /** Return the filtered result **/
    return $new_string;
}

説明した置換を行うこのフィルターは、サイドバーのステータス出力を次のようにします。

<p>You are logged in as <span class="my_class">username</span><br />
<a href="http://logoutlink">click here to log out</a>

次に、いくつかの CSS を .my_class クラスに適用できます

.my_class {
  font-weight: bold;
  color: red;
}

Answer 2

テーマ ファイル内:

<?php

if (is_user_logged_in()) {
    ?>
    <p class="loggedin">You are logged in as "username".</p>
    <?php
} else {
    ?>
    <p class="loggedout">You are logged in as "username".</p>
    <?php
}

?>

CSS

p.loggedin {
    color: green;
}

p.loggedout {
    color: red;
}