つぶ 
この記事は「Snow Monkey Advent Calendar 2021」16日目の記事です。
Snow Monkey Advent Calendar 2020から1年がたちました。
3年連続16日目を担当させていただきます( ･`ω･´)
2020年のアドベントカレンダーではSnow Monkeyの情報収集について書きました。
ワタクシゴトですが今年2021年はWeb制作を全然できておらず、このSnow Monkeyをテーマにしているこのつぶ式の更新も2記事だけしか更新できていないという体たらくぶりです。
2年連続で書いたし今年も書くかーって気軽に参加登録していました。半月前の自分に声をかけたい、ちょっと待ってと。
なんでもキタジマさんが「ﾀｽｹﾃ…」って
12月に入ってアドベントカレンダーの自分の番に近づいてきているのにもかかわらず全くネタが浮かんできません。
Snow Monkeyについて書けるネタがない／(^o^)＼
見てください。
アドベントカレンダー参加者を見てみると猛者、猛者、猛者&猛者。
百戦錬磨のモンキーズって感じです。
こんなつよつよばっかの中に自分が入ったら場違いや／(^o^)＼
これを書いているのは16日当日です。
今日までの記事のタイトルを見てみるとレベルが高いすごいものばかり／(^o^)＼
他の方の記事はめちゃくちゃ楽しみすぎるのですが、中身読むと多分心が折れてしまいます。
これを書き終わるまでは見ないという契り自分と交わしました。自己防衛。
どんどんハードルがあがっています。
何を書こう。
WordPressとのうぶな関係
とても長くなった前置きに書いた通り今回は「これを書こう！」というネタがありません。
いろいろ考えていると
『WordPressに出会った頃ってどんな気持ちやったっけ』
って思い出してみました。
WordPressに出会った時「すげー！これが無料？これならなんでも作れそう！」って可能性を感じてキラキラしていたことありませんでしたか？
僕はありました。
それが今となっては
個人情報扱うの怖いから～とか
それは大規模開発向きだから～とか
WordPressじゃ難しいから～とか
WordPressじゃなくてよくね～とか
頭でっかちになりすぎて適当な言い訳をつけて面倒な実装を考えることをやめていませんか？
Webに、WordPressに、CMSに感じていた無限の可能性を忘れていませんか？
あの頃のうぶな気持ちを忘れていませんか？
僕は完全に忘れていました。
あの頃の気持ちを取り戻したい。
そうだ、WordPressでなにか作ろう。
SNSとかいいんじゃね？
神様がそう言うので仕方ありません。
Snow Monkeyを使ってWordPressでSNS作ってみます。
できなかったらごめんなさいｗ
WordPressに出会った頃「すごいもの」を作ろうとしてプラグイン突っ込みまくっていろいろ実装してぶっ壊したのはいい思い出です。
みんなそうやって成長していると思っています。
え？違う？
'``・ 。 `。 ,｡∩ もうどうにでもな～れ + (´･ω･`) ｡+ﾟ `｡ ヽ、 つ ﾟ `・+｡・' ﾟ⊃ +ﾟ ☆ ∪~ ｡ﾟ `・+｡・ ﾟ
ルール
- 基本自分でコードは書かない
- 検索して見つかったコードのコピペ実装はOK
- プラグインガン積み奨励
- 管理画面からできること優先
- 相性？なにそれ
- 見た目は後回し
ルールというか縛りというか……コードをたくさん書けばできるはずですが(そんなスキルは無い)
今回したいことは【昔の自分が今の環境で実装するとしたら】を再現していきたいと思っています。
実装がわからなくて調べた時は、検索キーワードと参考にしたリンクを記載します。
去年の記事に書いたように検索キーワードの参考にしてみてください。
環境
サブドメインで新規作成(サイトURLは最後に出します)
データベースやPHPのバージョン、WordPress・プラグインのバージョンも違う場合がありますが今回の内容には影響する可能性はかなり低いので書きません。
WordPressインストール
サブドメインを設定します。
エックスサーバーの管理画面からドメイン→サブドメインを開いて設定したいドメインを選択してください。
ドメインを選択したらサブドメイン設定追加のタブを選択肢し、サブドメイン情報を入力してください。
サブドメインの設定が完了したら設定待ちとなるので反映されるまで待ちます。
結構待つこともある(30分～1時間くらいかかる)こともあるので、余裕があるときにサブドメインを設定しておくのがいいです。
データベースを手動で作成したい場合はこの時にやっておくと時短できます。
WordPress簡単インストールを使って自動でデータベースを作成するときは必要ありません。
設定したサブドメインを開いた時に無効なURLです。 プログラム設定の反映待ちである可能性があります。 しばらく時間をおいて再度アクセスをお試しください。となっていたのがこのウェブスペースへは、まだホームページがアップロードされていません。となればサブドメインの設定が完了しました。
エックスサーバーの管理画面からWordPress→WordPress簡単インストールでドメインを選択してWordPressインストールのタブを選択し、新しいWordPressをインストールします。
WordPressのインストールめちゃくちゃ簡単になったなぁ(*´-`)
WordPress管理画面
初期設定
WordPressをインストールしたらまずこれらを対応されることが多いと思います。
- SSL(https://)化
- パーマリンク設定
- テーマインストール
- プラグインインストール
SNS構築経験が無いのでとりあえず普通？に使える状態にします。
SSL化・パーマリンク設定
ログイン直後のダッシュボードにあるサイトヘルスステータスのボックスからサイトヘルス画面へのリンクからサイトヘルス画面へ移動します。
サイトヘルス画面に改善が出ているのでサイトでHTTPSを使用していませんという項目の
サイトを更新して、HTTPSを使用するボタンからHTTPS化します。
今回エックスサーバーを利用しているので標準設定で無料独自SSLが有効になっています。
エックスサーバー以外の環境を利用される場合はSSL証明書が設定されているか確認してください。
一度ログアウトされてしまうのでもう一度ログインするとサイトURLはHTTPSに切り替わりました。と表示されます。
テーマ・プラグインインストール
外観→テーマ→テーマを追加→テーマのアップロードからSnow Monkey公式サイトからダウンロードしたテーマファイルを.zipのままアップロードして有効化します。
必要になりそうなプラグインもインストールしていきます。
プラグインのインストールは都度検索してひとつづずすると手間がかかるのでWordPress.orgのお気に入り機能を使います。
WordPress.orgのお気に入り機能はとても便利なので、是非自分のお気に入りプラグイン一覧を作ってみてください。
自分以外のアカウントのお気に入りも使えます。
僕のIDはtbshikiなのでもしよかったら見てみてください！
そして、オススメのプラグインがあったら教えてください！！
わかりやすい解説が載っている記事がありました。
WordPress.orgの公式ディレクトリに掲載されていないプラグインはお気に入りにできないので手動でアップデートが必要です。
現時点でインストールしたプラグインはこれだけです。
これでやっと普通に使えそうなSnow MonkeyをインストールしたWordPressが出来上がりました！
いやー、ここまで長かったですねｗ
お読みいただきありがとうございました✨
・
・・
・・・
・・・・
・・・・・
（ ＾ω＾）・・・
嘘です。
前置きをかなり丁寧に書いてしまったのでこの後疲れて手抜きになってしまうんじゃないかと心配ですが続きます_(┐「ε:)_
検索キーワード
WordPress SNS化
WordPress SNS化SNSにしていく
🤔
全然情報無いやんｗｗｗ
信頼無さそうなソースとか古い記事が多いな。
これが初見の感想でした。情報が無いのはやばい。前途多難かよ。
とはいえ、まぁ前項のインストールしたプラグイン一覧を見てもらったのでもうお気付きの方もいると思います。
いろいろサイトを巡ってみた結果 BuddyPress というプラグインがサクッとWordPressをSNS化できそう。
名前聞いたことあるしコントリビューターも多いみたいやから信頼できそうでよかった。ほっ。
BuddyPress 設定
設定→BuddyPress 設定がBuddyPressの設定の要っぽいな。
コンポーネントのタブはとりあえず一旦全部オンにしてみるか。
オプションのタブはテンプレートとかグループとか意味わからないところもあるがとりあえずこのままでよさそう。
固定ページ（ ＾ω＾）・・・
現在、登録は無効になっています。 ページの関連付けを許可する前に、このページ の「誰でも登録可能」チェックボックスをクリックして登録を有効化してください。
Oh…そりゃそうですよね…誰も登録できないSNSなんて意味ないですよねｗｗｗ
設定の一般にあるメンバーシップのだれでもユーザー登録ができるようにするにチェックを入れて保存。
普段自社サイト作ってたりすると「だれでも」にユーザー登録されたら困るのでここのチェックを入れること無いから新鮮！
クレジットのタブにはBuddyPressに貢献されているコントリビューター様たちの紹介一覧になっています。
固定ページ一覧を見るとBuddyPressが自動生成してくれたページがたくさんできていました(/･ω･)/
これで誰でも登録できるWebサイトができたぞ！
もうこれだけでSNS感でてきたんちゃうｗ
と思ってトップページ見たけどなにも変わってないｗｗｗｗ(当たり前)
ユーザーを作成してみよう
登録ユーザーが管理者の自分だけだと実装できているか確認できないので適当なユーザーを作って登録してみた。
ログインしていない状態で登録ページを開いてみるとこんな感じ、SNSっぽい！ｗ
登録すると認証メールがとんできて、リンクからユーザーを有効化することができた。
これでユーザーも2人になったしもうこれでSNSちゃう？ｗｗ
と思ってトップページにいってみるとこれ／(^o^)＼
道のり遠くない？ｗｗ
アクティビティはツイートみたい
設定をいろいろいじってみたりして楽しんでみた。
ホームページを固定ページに変更してみたり、ウィジェット変更してみたり、新規で作ったユーザーのアイコン・ヘッダー画像を設定してみたり。
ユーザーそれぞれでプロフィールページを変更できるのはめっちゃSNSっぽい！やっとSNSっぽい！ｗｗ
アクティビティにあるどうしていますか？のところから近況を投稿するとTwitterみたいに表示できる！さらにSNSっぽい！ｗｗ
Twitterみたいに気軽に投稿できるSNSはいいなと思ったからホームページを固定ページアクティビティにしてみた。
それっぽい！ｗｗ
友達申請してみたりメンションつけて投稿してみたり
プロフィールページから友達申請をすることができます。
友達申請を受けるとサイト上での通知とメールが来ました。
メンションをつけて投稿すしても通知とメールが来ました。
デフォルトで通知機能がしっかりしてるのはめっちゃいいですね！！めちゃくちゃS(ry
管理者の管理画面→アクティビティからは恐らく全員のアクティビティはひと目でわかるようになっていた。
管理者側からは全体を把握する為に必要やろうけど、ユーザー側としては監視されてる気がするかもって思ってしまった(； ･`ω･´)
カスタマイザーから色味を修正
Snow Monkeyのスタイルが適応されているのでアクセントカラーがちゃんと反映されてとてもいい感じです。
メールもカスタマイザーでカラーの変更ができるのですが、管理画面のメール→カスタマイズからでしかアクセスできなそさそう。
サイトから通知として自動送信されるメールもかなり細かく設定できそうでいい感じ。
サーバーによってはWordPressから送信されるメールが多すぎるとスパム認定されてしまう可能性もあるので注意。
通知が多すぎると感じる場合はメールを編集で開いて「シチュエーション」というところのチェックを外すことで配信を止めることができそう。
Are these emails not written in your site’s language? Go to BuddyPress Tools and try the “reinstall emails” tool.
メールの管理画面にメールの言語がおかしいかも？修復してみてよってアラートが出てたからクリックして修復してみたけど、なにも変わった様子がなかった(； ･`ω･´)
プロフィールを充実させたい
検索キーワード
BuddyPress プロフィール追加かなり詳しく紹介されている記事を見つけてしまいました。
同列のメニューに「メンバーのタイプ」や「サイト通知」という確認できていない項目が見つかったのは気のせいにしておきます。
プロフィール欄→Base(メイン)のタブで新規フィールドを追加しました。
今回テキストエリアの自己紹介とWebサイトのリンクを設定しました。
ほんとにTwitterみたいになってきたてうれしいｗ
テキスト以外を投稿したい！
検索キーワード
BuddyPress 画像 投稿先程のプロフィールの追加と同じサイトに載っていました、ネ申ｗ
BuddyPress Activity Plusというプラグインで画像や動画を投稿できるようになるとのこと。
BuddyPress Activity Plusをインストールしてみたところ、アイコンがダサい個性的なので修正したくなりました。
あと投稿部分のpaddingなぜbottomには余白が無いのｗｗ
これは耐えれなさすぎたのでちょっと書きました。
デベロッパーツールからほぼコピペしたのでセーフ。
#bp-nouveau-activity-form {
padding: 10px;
}無事画像を投稿できたので最高ですｗ
プロフィール全公開はちょっと……
ユーザーのプロフィールページの内容はログインしていなくても見れるのでちょっとオープンすぎません？？ｗ
プロフィールの内容はネットの海にたれ流し状態やんｗｗ
プロフィールの設定から「プロフィール公開状態」を適切に設定すればいいのかもしれないけれど、ユーザーにそれを押し付けるのはなんか違うなと思った。
指定ページ以外はログインしていないと見れないようにできんものかな……
めちゃくちゃいい情報じゃないっすかｗｗ
Force Loginというプラグインを有効化するだけで～ホームページ以外にアクセスするとログインページにリダイレクトする～
めっちゃいい！！と思って実装してみましたが登録ページまでログインページにいってしまう、これはあかんｗｗ
と思ったらWordPress.org プラグインページのFAQに除外ページ設定が載っているじゃないっすかｗ
/**
* Bypass Force Login to allow for exceptions.
*
* @param bool $bypass Whether to disable Force Login. Default false.
* @param string $visited_url The visited URL.
* @return bool
*/
function my_forcelogin_bypass( $bypass, $visited_url ) {
// Allow all single posts
// if ( is_single() ) {
// $bypass = false;
// }
// Allow these absolute URLs
$allowed = array(
home_url( '/' ),
home_url( '/404/' ),
home_url( '/activate/' ),
home_url( '/register/' ),
);
if ( ! $bypass ) {
$bypass = in_array( $visited_url, $allowed );
}
return $bypass;
}
add_filter( 'v_forcelogin_bypass', 'my_forcelogin_bypass', 10, 2 );これをfunctions.phpなりmy-snow-monkey.phpに書くとホームページ・404ページ・有効化ページ(activate)・登録ページ(register)はリダイレクトされなくなります、やったね！
まだまだやりたいことはあるけど
時間がなくなってきました／(^o^)＼
アドベントカレンダー16日が終わるまであと2時間。
まだアイキャッチもサムネイルも作ってないよ、やばい／(^o^)＼
- ログインページがWordPress丸出しなのでどうにかしたい
- 見た目整えたい
- ユーザー行動のデザインもしっかり考えたい
- サイトロゴとアイコン作りたい
できあがったのはこれ
ユーザー登録して自由に投稿してみて遊んでみてもらえたらうれしいですｗ
中身はだいぶとお粗末ではあるもののWordPressでも1日かけずにTwitterライクなSNSを作ることができて満足です。
なんでもできるやん、WordPress！
あと作っててずっと思ってたこと
レイアウト崩れも発生せず見た目に影響出さない
Snow Monkeyの包容力！！すごい！！
Snow MonkeyでSNS作れましたよー！
最後に
Snow MonkeyでBuddyPressを使われているフォーラムの投稿はほぼ見かけたことがなかったからひやひやしながら付け焼き刃で実装してみました。
セキュリティ大丈夫か？とか情報垂れ流しか？とか見た目どうにかしろよｗｗとかいろいろ意見はあると思いますが暖かい視線で優しくみていただけるとうれしいです🤣
この記事を書き始めたのが正午前後、いまが22時。
途中で他の仕事もしているので実際の実装時間はもっと短いです。
WordPressでサービス作りたいってなったらとりあえずSnow Monkey使っていれば実装できる気がします。
それくらい包容力のあるテーマだなと改めて感じました。
今年も言います！
Snow Monkey 本当にオススメなので騙されたと思って使ってみてください！
キタジマさんの包容力を体感してみてください。
ここまで読んでいただいてありがとうございました！
この記事は「Snow Monkey Advent Calendar 2021」16日目の記事です。
あなたにも素敵な情報収集生活が訪れますように
Follow @tbshikiXでいろいろつぶやいています。
フォローお待ちしております。