ログインまたは、会員登録

ログイン後は、見ているページへ戻す。

get_extendedで続きを読むにはログインまたは会員登録ボックスを作る

記事の途中で、「続きを読むには…」というコンテンツを見かけます。
個人的には一手間が面倒なので、丸ごと会員制にしちゃって展開した方がいいのかなぁと思ったりするんですが、会員を増やしたいという運営サイドの意図があると、そういう構成になりますよね?って思います。

面倒とか言っておきながら、「おっ!!」っと思う記事に出会うと、会員登録してますw

WordPressでやるには?

ビジュアルエディタの“「続きを読む」タグを挿入”を使うとあっさりできちゃいました。

<!-- more -->タグ入れるやつ。
<!–more–>が入るやつです。

参考 : 「続きを読む」のカスタマイズ – WordPress Codex 日本語版

WordPress サイトのトップページに投稿の抜粋を表示して訪問者の興味を引き、タイトルやリンクのクリックで、続けて投稿や記事の全文へガイドするテクニックがあります。WordPress では簡単にこのテクニックをカスタマイズ可能な方法で実現できます。

ビジュアルエディタで実際に使うと、↓↓のように区切りが入ります。

「続きを読む」タグが挿入されたところ
「続きを読む」タグが挿入されたところ。

知ってる用途としては、アーカイブページだけだと思ってたんですが、大変便利な関数がありました 😀

get_extended

参考 : 関数リファレンス/get extended – WordPress Codex 日本語版

読みますと、

投稿本文を <!–more–> で区切った内容を各々取得します。戻り値は main と extend のキーからなる連想配列です。main キーの配列には <!–more–> より前の本文、extend キーの配列には <!–more–> より後の本文が入っています。

2つ目のダッシュ(-)と ‘more’ の間にはスペースは入れないでください。’more’ の後のスペースは無視されます。

とありました。
ってことは、<!–more–>の前(mainキーの中身)を読ませて、後(extendedキー)はログインしないと出ないようにしてしまえばいいわけですよね 😀💡✨

ソースを見てみる

参考 : get_extended() | Function | WordPress Developer Resources

[php]
<?php
function get_extended( $post ) {
//Match the new style more links.
if ( preg_match(‘/&lt;img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-wp-more="more" data-wp-more-text="(.*?)?" class="wp-more-tag mce-wp-more" alt="" title="続きを読む…" data-mce-resize="false" data-mce-placeholder="1" /&gt;/’, $post, $matches) ) {
list($main, $extended) = explode($matches[0], $post, 2);
$more_text = $matches[1];
} else {
$main = $post;
$extended = ”;
$more_text = ”;
}

// leading and trailing whitespace.
$main = preg_replace(‘/^[\s]*(.*)[\s]*$/’, ‘\\1’, $main);
$extended = preg_replace(‘/^[\s]*(.*)[\s]*$/’, ‘\\1’, $extended);
$more_text = preg_replace(‘/^[\s]*(.*)[\s]*$/’, ‘\\1’, $more_text);

return array( ‘main’ =&gt; $main, ‘extended’ =&gt; $extended, ‘more_text’ =&gt; $more_text );
}
[/php]

投稿の中身を<!–more–>で分けてます。

あとは、特定のカテゴリだけや、カスタムフィールドを追加して投稿個別に

  • <!–more–>以降はログインが必要な記事
  • 誰でも読める記事

っと、<!–more–>ボタンで区切ればOK。
今回は、カスタムフィールドで作ったんですが、extendedが空の場合は、全文とか、分岐の部分で何度かミスをしちゃいました… 😅

コードはこんな感じ。

<?php
// カスタムフィールドの値 : for_all, need_loginで分岐
// set single.php
while ( have_posts() ) : the_post();
$raw_content = get_extended( $post->post_content );
$everyone_can_read_content = ! empty( $raw_content )
? $raw_content['main']
: get_the_content();
$logged_in_can_read_content = $raw_content['extended'];
if (
$require_login === 'for_all'
|| is_user_logged_in()
|| ( $require_login === 'need_login' && empty( trim( $logged_in_can_read_content ) ) )
) {
the_content();
} elseif (
$require_login === 'need_login'
&& ! is_user_logged_in()
&& ! empty( trim( $logged_in_can_read_content ) )
) {
echo apply_filters( 'the_content', $everyone_can_read_content );
echo get_login_register_box();
}
endwhile; // End of the loop.
// Box.
// set functions.php
function get_login_register_box() {
$redirect = wp_get_referer() ? wp_get_referer() : home_url();
$register_html = wp_register( '', '', false );
$register_html = str_replace( '登録', '会員登録する', $register_html );
$login_register_html = '';
$login_register_html .= '<div class="login-register">';
$login_register_html .= '<p class="login-register__title">会員登録が必要です</p>';
$login_register_html .= '<p>これより先は会員限定コンテンツです。ログインまたは、会員登録が必要です。</p>';
$login_register_html .= '<ul class="login-register__button-list">';
$login_register_html .= '<li class="login-register__button-list_login">';
$login_register_html .= '<a class="loginout_link" href="' . wp_login_url( esc_url( get_permalink( get_the_ID() ) ) ) . '">ログインする</a>';
$login_register_html .= '</li>';
$login_register_html .= '<li class="login-register__button-list_register login-register__button-list_button">';
$login_register_html .= $register_html;
$login_register_html .= '</li>';
$login_register_html .= '</ul>';
$login_register_html .= '</div><!-- /.login-register -->';
return $login_register_html;
}

できあがりはこんな感じ。

ログインまたは、会員登録
ログイン後は、見ているページへ戻す。

フワッと白くぼけている部分は、box-shadowを上にずらせばいい感じに。

[css]
.login-register {
box-shadow: 0px -75px 50px 34px rgba(255, 255, 255, 0.9);
}
[/css]

分岐で最初勘違いしてて、どの記事にもログインボックスを出してしまったりしましたが、一先ずこれで、続きを読むにはログインが必要なコンテンツはできました。

get_extended大変便利な関数でした〜。WordPressが1.0.0の時からあるんですね〜 😀