INDEX

• 1. WP-Membersで作る会員制サイト
  • 1-1. デモで使用したテーマ
  • 1-2. WP-Membersプラグインをインストールすると
  • 1-3. 個別に投稿をブロックする
  • 1-4. 新規ユーザー登録とログイン
  • 1-5. フィールド設定
  • 1-6. ダイアログ設定
  • 1-7. メール設定
  • 1-8. 管理者が承認するまで登録後ログインできないようにする
  • 1-9. ショートコードでメンバーズページを設置
  • 1-10. ショートコードで新規ユーザー登録フォームを設置
  • 1-11. ウィジェットでログインフォームを設置
  • 1-12. テーマ制作時の注意点
• 2. StaticPressによる静的サイト生成
• 3. そのほか出た話題など
• 4. 6月は初心者向け、7月はコンタクトフォーム祭り！
• 5. WordBench FukokaのTwitterアカウントが開設されました！
• 6. 当日のTweetまとめ
• 7. 過去のWordBench Fukuokaまとめ

1. WP-Membersで作る会員制サイト

• WP-Members – WordPress Plugins

WordPressで会員制サイトを作る際にWP-Membersというプラグインを使った例をデモでお見せしました。

1-1. デモで使用したテーマ

デモでは「twentytwelve」を複製した「wbfukoka」テーマを使用しました。

1-2. WP-Membersプラグインをインストールすると

検証にはWordPressバージョン 3.5.1、WP-Membersバージョン 2.8.2を使用しました。

プラグインをインストールすると管理画面メニューの 設定 の中に WP-Members という項目が表示されるようになります。

WP-Members を選択すると設定ページに遷移します。すると初期状態で 投稿記事をブロック にチェックが入っていることが分かります。

この状態で管理画面からログアウトして、投稿の詳細ページを見てみると投稿記事の本文が表示されず ログインフォーム と 新規ユーザー登録フォーム が表示されています。

登録ユーザがログインしないと記事の内容を見ることができなくなりました。

1-3. 個別に投稿をブロックする

先ほどチェックされていた 投稿記事をブロック のチェックを外して 変更を保存 ボタンを押します。
するとログインしてないユーザーでも投稿の詳細ページで投稿記事の本文が見ることができてしまいますが、個別に見せたくない投稿を選んでブロックする方法があります。

投稿の登録・編集ページで WP-Members の項目があるので Block this post にチェックを入れると、その投稿記事はログインユーザしか見ることができなくなります。

WP-Members の項目が見当たらない場合は 表示オプション を選択して WP-Members にチェックを入れます。

1-4. 新規ユーザー登録とログイン

新規ユーザー登録を行ってログインをしてみましょう。

ユーザー登録を行うと登録したメールアドレスに登録完了のメッセージとパスワードが送られる仕組みになっています。
ただ今回はメールの送信出来ないローカル環境で試していますので、管理者ユーザでパスワードを変更してログイン可能にしました。

新規登録したユーザでログインします。

ログインに成功すると投稿記事の本文を見ることが出来るようになったほか、ページ上部に AdminBar が表示され、プロフィールの編集や、ログアウトが行えるようになりました。

プロフィールを編集 を選択するとWordPressの通常のユーザー情報の編集を行えるほか、WP-Membersの登録フォームから登録した 追加情報 の編集も行えます。

ちなみに新規登録で作成されるユーザの権限は管理メニューの 設定 の 一般 から 新規ユーザーのデフォルト権限グループ の項目の権限で作成しているみたいです。

1-5. フィールド設定

WP-Membersの設定ページの フィールド タブで登録フォームの項目を編集出来ます。

1-6. ダイアログ設定

WP-Membersの設定ページの ダイアログ タブでユーザ登録時のエラーメッセージや登録完了メッセージを編集出来ます。

1-7. メール設定

WP-Membersの設定ページの メール タブでユーザ登録完了時のメールの文章を編集出来ます。

1-8. 管理者が承認するまで登録後ログインできないようにする

WP-Members設定ページで　承認登録 にチェックを入れて 変更を保存 ボタンを押します。

管理画面メニューの ユーザー の中の ユーザー一覧 を選択してユーザの上にマウスカーソルを持って行くと Activate というリンクが表示されます。このリンクをクリックしてユーザを承認しなければ、登録ユーザは勝手にログインすることはできません。

1-9. ショートコードでメンバーズページを設置

以下のショートコードを貼り付けることで、メンバーズページの設置が可能です。

[wp-members page="members-area"]

未ログイン時

メンバーズページでは、未ログイン時に ログインフォーム と 新規ユーザー登録フォーム が表示されます。

ログイン時

また、ログイン時には 登録情報の編集 と パスワード変更 が行えます。

1-10. ショートコードで新規ユーザー登録フォームを設置

以下のショートコードを貼り付けることで、新規ユーザ登録ページの設置が可能です。

[wp-members page="register"]

1-11. ウィジェットでログインフォームを設置

管理画面メニューの 外観の の中の ウィジェット を選択し、WP-Members Login をサイドバーに登録してみます。

サイトバーにログインフォームが設置出来ました。

1-12. テーマ制作時の注意点

上の画面のキャプチャのようにアイキャッチ画像をテーマで表示している場合は、ログインしてない状態でも見ることが出来てしまいます。
これはWordPressのフックという機能を使って投稿記事の本文を消してるいて、アイキャッチ画像やカスタムフィールドなど本文外のデータに関しては非表示にならないためだと思われます。

このアイキャッチ画像をログインユーザーにしか見せたくない場合、例として以下のような実装を行ってみました。

content.php

<header class="entry-header">
    <?php //the_post_thumbnail(); ?>
    <?php if ( is_single() ) : ?>
        <h1 class="entry-title"><?php the_title(); ?></h1>

content.php でアイキャッチ画像を表示している部分をコメント化します。

functions.php

// 投稿記事本文の前にアイキャッチ画像を連結させて表示させる
add_filter( 'the_content', 'hook_the_content', 0 ); 
function hook_the_content( $content ) {
    global $post;
    
    if( is_single() ) {
        $content =  get_the_post_thumbnail( $post->ID ) . $content;
    }
    
    return $content;
}

functions.php で投稿記事本文にフックして本文の前にアイキャッチ画像を連結します。

functions.php

三好さんにこんな風にも書けるんじゃないかなって教えて頂きました！wpmem_securify はプラグイン独自の関数です。

// 投稿記事本文の前にアイキャッチ画像を連結させて表示させる
add_filter( 'the_content', 'hook_the_content', 0 ); 
function hook_the_content( $content ) {
    global $post;
    
    return wpmem_securify( get_the_post_thumbnail( $post->ID ) ) . $content;
}

functions.php

加えて functions.php にお試しでこんなカスタマイズコードも入れてみましたよ。

// "購読者"にのみAdminBarを表示させない
add_action( 'init', 'hook_init' );
function hook_init() {
    if( !is_user_logged_in() ) return;
    
    $user = wp_get_current_user();
    if( in_array( 'subscriber', $user->roles ) ) {
        add_filter( 'show_admin_bar', '__return_false' );
    }
    
}

// "管理者"以外管理ページにアクセスさせない
add_action( 'admin_init', 'hook_admin_init' );
function hook_admin_init(){
    if ( !current_user_can( 'administrator' ) ) {
        wp_die( 'アクセスできません' );
    }
}

こちらの記事が参考になりました。ありがとうございます:)

• WordPressの表示をログインユーザーに限定する | Simple Colors

2. StaticPressによる静的サイト生成

• StaticPress

お次はStaticPressというプラグインを使った静的サイト生成のデモをお見せしました。

プラグインをインストールすると管理画面メニューの 設定 の中に StaticPress という項目が表示されるようになります。

StaticPress を選択すると設定ページに遷移します。静的サイト URL と 出力先ディレクトリ (ドキュメントルート) を入力して 変更を保存 ボタンを押します。

再構築 ボタンを押します。

静的ファイルの生成が開始されます。終了 が表示されたら再構築完了です。

静的ファイルが生成されました。

静的サイト URLにアクセスしてみます。

3. そのほか出た話題など

ブルートフォースアタック（総当たり攻撃）について

• Better WP Security・・・セキュリティチェックや通知をしてくれる。

外部リンクの管理どうする？

• 同じリンクが複数の固定ページに登場する。固定ページによって外部リンク一覧は変わったりする。
• PHPファイルで管理する？
• 配列に格納して独自テンプレートタグやショートコード？
• カスタムメニューだと面倒。
• 管理画面で編集できたら理想だがそこまでするか？

マルチサイトの画像アップロード時のURLについて

• フォーラム » マルチサイト » 画像アップロード時のURLについて
• WordPressマルチサイト時の画像アップパス＆URLが変わった（3.5以降）

WordPress10周年記念パーティ

• 福岡でもなにかやりますか！と話題に。

WordCamp Fukuoka

• Campという名前だと制限が多いので違う名前でも良いかも？
• 若い人たちに引っ張って行って貰いたい。

4. 6月は初心者向け、7月はコンタクトフォーム祭り！

6月は初心者向け勉強会！

スピーカーを募集中です。

7月はコンタクトフォーム祭り！

• Contact Form 7（三好さん）
• Trust Form（堀家さん）
• MW WP Form（キタジマさん）

豪華メンバーでお送りする7月の勉強会、対談あり！？

『たら竹崎温泉に行ってカニを食べよう！』なんて話題も。

5. WordBench FukokaのTwitterアカウントが開設されました！

＠wbfukuoka
とんこつラーメンをすすってるマスコットキャラクター「わぷー」が今後のWordBench Fukuoka情報を流してくれるそうですよ！

6. 当日のTweetまとめ

• 第3.6 べーた2回目くらいの WordBench Fukuoka – Togetter

7. 過去のWordBnech Fukuokaまとめ

• 第3.5.2回 WordBench Fukuokaに参加、お話させて頂きました。「テーマ制作の疑問とノンプログラマーにも優しいテーマを考える」
• 第3.5.1回 WordBench Fukuokaに参加しました！参加レポート！