いまさら聞けない WordPressの使い方

今やWebサイトを作ろうと考えたことがある人は一度は耳にしたことであろうWordPress(ワードプレス)

今回は聞いたことある見たことあるけど実際どうやって触るの?って言うWordpress初心者の方へ簡単な使い方をお教えします。

実際こう言うのは触りながら覚えるのが早い!

どこでどうやって触るの?

そうまずはWordpressが何処に行けば触れるの?って話。1番手取り早いのはレンタルサーバー会社が良いですね。後でいろんなレンタルサーバー会社さん紹介しますのでまずは1つだけ。ロリポップ!レンタルサーバー

続きを読む いまさら聞けない WordPressの使い方

AWS EC2で容量ボリュームを増やす時のエラー対処法

「もう丑満時やで!はよ寝なさい!」

カマスです。

 今回初めてAWSのEC2のインスタンスの容量がパンパンになってサイトが遅くなったりメールが送れない事態が起きたので、急遽夜中に容量ボリュームの増やす作業を行いました。

ググるとたくさんの人たちが丁寧に容量の増やし方を書いてくださっていて助かったのですが、2点ほどつまづいたところつまりエラーが発生してしまったので備忘録として書いておきます。

続きを読む AWS EC2で容量ボリュームを増やす時のエラー対処法

WordPressサイトを移行する前に絶対に確認すべき4項目

「我も人なり、彼も人なり、カマスは魚なり」

カマスです。

 たまにはWeb系のことも書かなくてはと思い書こうかと。

最近よく舞い込んでくる仕事があります。それは

 「WordPressサイトの移行

続きを読む WordPressサイトを移行する前に絶対に確認すべき4項目

wordpress自作フォームで起こったエラー404ページに移行してしまう現象

まー良く忘れるから備忘録として、

今回やらかした事

自作フォームがsubmitボタン押したらエラー404画面に移る。。

 

ひたすらググってもcontract formのことしか出てこない。。。orz

 

とりあえず先に結論を書きます

解決

$_POST[“name”] これ駄目ね!!

つまり<input type=”text” name=”name” <—これ駄目ね!!!

 

これは恐らくwordpressのデータとぶつかるだからだと思いますね。

 

こんなんで1日潰れましたよ。。。とほほorz

 

次回は忘れずに input name属性決めは気をつけましょう!!

 

 

なんだこれ!? [updated がありません]だらけの ウェブマスターツールエラーの対処法

久しぶりの投稿です。

昨日久々にGoogleのウェブマスターツール(WebmasterTool)をぼーっと眺めていたら

どっさりのエラーを発見!!Σ(゚□゚(゚□゚*)ナニーッ!!

スクリーンショット 2015-03-14 10.26.20

下の部分

スクリーンショット 2015-03-14 10.26.44

そう見て分かります様に、どっさりの

「updatedがありません」

「updatedがありません」

「updatedがありません」

 

うへーw っと言う訳で「updatedがありません」でさっそく検索

 

そしたら速攻でました。

田舎に住みたいエンジニアの日記 に書いてあったものを参考にしてみました。

対処法は

Classに「date updated」を付け足すことで解消します。single.phpの中に「entry-date」の記述を探します。

おーそんだけかー!さっそくソースをチェックです!

あ、因にこれはWordpressの対応方法です

わたしのsingle.php

スクリーンショット 2015-03-14 12.08.35

ん???? なななない!!!

そりゃエラー出まくりますわねw

田舎さん曰く、entry-dateクラスにupdatedを付け足せば良いそうです。

わたしのSingle.phpはentry-dateクラスの記述もなかったので、それも田舎さんから引用させて頂きました、有り難うございます!

では早速updatedをupdate!

あとはGoogleクロール様に見つけて貰うまで待ちます。

 

っというかまだありまして、

スクリーンショット 2015-03-14 12.24.21

 

これが気になったので「ライブデータをテスト」をクリック

そしたら別件で警告を食らっていましたw

スクリーンショット 2015-03-14 12.26.07

もーなんじゃコレー

まぁでも削除してくれって言ってるんで、削除すればそれで良いのでしょう。

でも取り敢えずGoogle先生に質問

The class="hfeed" is used to apply metadata to your markup. The “hfeed” class is actually part of the hAtom 0.1 microformat specification.http://microformats.org/wiki/hatom. hfeed indicates to machines that the enclosed content is syndicated content (such as a blog feed).

このclass=”hfeed”はマークアップをメタデータにアプライするために使われるんだ。その”hfeed”クラスは実際 hAtom 0.1 microformatの仕様の一部だ。

hfeedは機械にエンクローズされたcontentはcontentを配給するように示してるんだな(ブログfeedみたいな感じ)

うおーー言ってることがわからんーーw 訳が間違っていると思うけどすいません!

 

取り敢えず消しましょw あ、このTesting toolで消せるんだー

スクリーンショット 2015-03-14 12.42.00

それでー「検証」ボタンをポン!

え。。。

スクリーンショット 2015-03-14 13.12.33

まだ、、、ある、、、

面倒くさがり屋のわたしはここで「閉じる」ボタン

取り敢えず警告だから大丈夫かなーっていう言い訳を自分にしてクロールさんを待つのでしたー

設定も簡単! A/Bテストに最適のoptimizelyの使い方

今日はOptimizelyの使い方を簡単に紹介します。

https://www.optimizely.jp/

 

皆さんはABテストはどうやってやってますか?

そもそもわたしはABテストっていう名前と概念は分かっていたのですが

 

「どうやってやんの?」

 

正直ずっと思っていました。

そこで仲間に聞いたらこのOptimizelyを知りましたのでちょっとご紹介。

 

わたしも使い始めてまだ1週間ちょっとなんですけど、

自分の分かっている範囲ですので、初心者用として読んで下さいね!

 

アカウント作成

まずはアカウント作成です。

スクリーンショット 2015-03-04 18.06.06

「勤務先メールアドレス」にEmailアドレスを入力して「試してみる」をクリック

そしたら、個人情報を入力する画面が出てきます。

スクリーンショット 2015-03-04 18.10.42

 

サクッと入力しちゃいましょう。そして「アカウントの作成」をクリック

すると、3つの選択画面に移ります。

スクリーンショット 2015-03-04 18.13.46

ここでは、テストしたい対象のプロジェクトを選んで下さい。

今回はWebサイトのABテストをしたいので「Web Project」を選択します。

次にABテストしたいWebサイトのURLを入力します。

スクリーンショット 2015-03-04 18.21.00

 

今回はわたしのサイト「AnyAny」のABテストをしたいので http://anyany.asia/と入力します。

すると、サイトを読み込んでくれます。

 

ちょっと待っててねーー

はい!

スクリーンショット 2015-03-04 18.24.49

ほら!読み込みました!

あとはガイドツアーを見ながらやっちゃえばOK!

ってこれじゃつまらないんで、1つテストしましょう!

では、下記の部分の色を変えてABテストましょう。

スクリーンショット 2015-03-04 19.09.13

 

んーでは青系にしてみましょうか!「ABOUT ME」の所をクリック

スクリーンショット 2015-03-04 19.11.37

すると上の様なポップアップが出てきます。

今回は黒枠から青系の枠に変えたいので、「要素の編集」▶︎「スタイルの編集」をクリック

スクリーンショット 2015-03-04 19.14.47

すると下記の画面に切り替わります。

スクリーンショット 2015-03-04 19.16.12

フォントも変更出来ちゃうんですねー

今回は色を変更したいので、「色と背景」をクリック

スクリーンショット 2015-03-04 19.17.45

あれ?背景色に何も出力されていない。。。。??

まぁいいや・・・背景色を変えてみましょう!丸い円をクリックします。

するとカラーサークル?が出現

スクリーンショット 2015-03-04 19.20.12

ここで自分が変えたい色にクリックしましょう。

ちょっと紫っぽい青を選択しました。

スクリーンショット 2015-03-04 19.21.51

お!反映されているみたいですねー!

では「完了」しちゃいましょう。

はい!こんな感じ

スクリーンショット 2015-03-04 19.24.50

良いですねー

ではさっそく右上にある「保存」をクリックして「実験の開始」をクリックしてABテスト開始!

スクリーンショット 2015-03-04 19.26.55 お、リロードですか、ではブラウザ更新をば。。。

おやなんだこれ?

スクリーンショット 2015-03-04 19.29.33

あー訪問者を絞れるのねー。ま、今回は置いておきます。

あれ?開始されない。。。あ、スクリプト入れてなかったw

では、上にある「ホーム」ボタンに行きましょう。

スクリーンショット 2015-03-04 19.36.29

「設定」をクリック

スクリーンショット 2015-03-04 19.37.09

この真ん中にある <script・・・ってやつを丸っとコピーします。

そこに書いてあるように<head>タグの直後に貼付けましょう

わたしのサイトAnyAnyはWordpressで出来ていますので、

編集ファイルは「header.php」になります。

スクリーンショット 2015-03-04 19.43.35

 

はい貼付けて保存!

それでは「概要」タブに戻って該当の実験をクリック!

スクリーンショット 2015-03-04 19.46.27

そしたら右にの実験の情報が出てきます。

スクリーンショット 2015-03-04 19.47.52

ちょっと説明すると、トラフィックの割り当てという欄があります。

ここのOriginalが元のサイト、要は黒い枠のままのサイト

Variation#1はさっき作った青い紫に変えたサイトになります。

50% 50%になっているのは、感覚的にわかるかと思いますが

半々でお客さんに見せるよってことです。

もちろんこの割り当てを変更する事も出来ます。

取り敢えずこのままにして早速実験開始!

「スタート」ボタンをクリック!

スクリーンショット 2015-03-04 19.52.09

そしたらステータスが「Draft」から「Running」に変わったはずです!

スクリーンショット 2015-03-04 19.53.07

まぁ簡単!!

あとは何日か放置をしてある程度のお客さんが結果を確認して、どっちの色が沢山クリックしてくれるか分かるってことなんです。

因に、途中経過や結果などを確認したいときは、右にある「結果」をクリックしましょう。

実験を辞めたい時は「停止」ボタンをクリックして終わりです。

本当に簡単ですね!

 

初めての方でも分かりやすい様に作りましたが、どうでしたか?

本当はもっといろんな編集やオプション設定が可能なので、レイアウト変更を決める前に

実験的に前回のデザイン、新しいデザインがどっちが良いか確認するLPOには持ってこいです。

 

https://www.optimizely.jp/

 

 

WordPressのユーザ権限 current_user_can の使い方

 

対象:Wordpressでユーザ権限を自動で与えたり、会員登録などするサイト開発する方

 

WordPressをある程度使って(開発)していると、絶対ここにぶつかります。

皆さんwordpressに権限があるのはご存知でしょうが、念のためWordpressのユーザ権限の種類を記載します。


権限グループ(日本語) 権限グループ(英語) 概要
購読者 Subscriber WordPressにログインすることが可能。
寄稿者 Contributor レビュー待ちの投稿を作成することができる。レビュー待ちになった投稿の公開は、編集者以上の権限グループのユーザーが行う。
投稿者 Author 投稿を行うことはできるが、固定ページや他のユーザーが作成した投稿を扱うことはできない。
編集者 Editor 投稿や固定ページ、カテゴリーなどを、他の人が作成した投稿を含めて扱うことができる。テーマやプラグイン、ユーザー、サイト設定を扱うことはできない。
管理者 Administrator トップレベルの権限グループで、すべての権限を持つ

後は本家サイトを見てもらえればもっと詳しく載っているのでもっと知りたい方はそちらへ

wordpress本家サイト->> ユーザーの種類と権限

 

で、開発者として実際日本語のグループ名なんていらないんですよ、説明文の時は良いけど

何故ならプログラミングは英語が命!

作っている時にif文やswitch文など、権限ごとの動作やコンテンツなど変えたい時は、

  • Subscriber
  • Contributor
  • Author
  • Editor
  • Administrator

これらが必ず必要です。

また、これらにはユーザレベル User Level って言うのがあります。

それがこちら

  • Subscriber       0
  • Contributor     1
  • Author              2
  • Editor               3,4,5,6,7
  • Administrator 8,9,10

これで分岐出来るんですが、これはWordPress 3.0以降で非推奨になっています。

今は最新はWordpress 4.1が出てるのでかなりお薦めしません

では、権限で分岐するif文を使う方法は。。。。

current_user_can() を使います。

こんな感じです。

これで、権限ごとに処理する事が出来ますね!