WordPressサイトの修正確認に。ユーザーのログイン状態でコンテンツ表示を分岐する。
検証・開発環境が無い時Wordpressサイト修正の小ワザの備忘録。
単発の小さな修正案件とかで、わざわざテスト環境を準備するほどでもないケースなどに。
ページ単位なら、パスワード制御とかURL公開しないとかである程度簡単にコントロールが可能ですが、ページの中の一部コンテンツの表示切替はちょっと複雑。
WordPressではユーザーのログイン状態で分岐が可能なので、サイト管理者には開発中のコンテンツを表示して、一般ユーザーには従来のコンテンツを表示といったことが可能。
目次
phpでコントロールする
WordPressログインユーザーのみ表示する
<?php if( is_user_logged_in() ) : ?>
ログインユーザーのみに表示する内容
<?php endif; ?>
WordPressログインユーザーとそれ以外で表示を切り替える
<?php if( is_user_logged_in() ) : ?>
ログインユーザーに表示する内容
<?php else : ?>
ログインユーザー以外に表示する内容
<?php endif; ?>
ショートコード化して投稿/固定ページで条件分岐させる
function if_login( $atts, $content = null ) {
if(is_user_logged_in()) {
return '' . $content . '';
} else {
return '';
}
}
add_shortcode('if-login', 'if_login');
[if-login]ここに記述した内容は、ログインユーザーにのみ表示されます。[/if-login]
CSSクラスでコントロールする
CSSクラスlogged-inを使用して切替
テーマによりますが、Wordpressのログイン時には、一般的にbodyにlogged-inクラスが付与されます。
これを利用して、ログインしていないユーザーには、当該部分を非表示にすることが可能です。
(あくまで非表示なので、ソースコード上は記述される事に注意)
例:ログインしていないユーザーに、CSSクラス「temporary」を非表示
body:not(.logged-in) .temporary {
display: none;
}