コーヒーアンドキーボード

コーヒーとキーボードにまみれて生活してます。一応専門はデジタルマーケ。

Wordpressの開発でマルチデバイスでLivereloadしたくて苦労した話

普段の開発はChromeエクステンション「LivePage」を使っていたのですが、iPhoneAndroidでもライブリロードしながら開発したかったので、色々調べたものの、うまく動くものが、なかなか見つからず苦労しました。

スクランナー系では「Grunt」と「glup」を試しましたがどちらも、設定がややこしくて、挫折しました。ちなみに参考にしたのはこちらの2記事。

ということでタスクランナー系は諦めて、別を探していたら、LIve.jsというスクリプトを発見しました。

テスト環境のHTMLファイルで問題なく動いたので、Wordpressでも行けると思ったのですが、なんとPHPでは動かないらしい。

ということで、この記事を参考にPHPファイルでもHTTP Request HeaderにContent-lengthとLast-Modifiedを入れたのですが、Wordpress側の問題か、動きません。

それなら、誰かがきっとWordpressプラグインを作っているだろうと、さまよっていたら発見しました。無事動いているので、ここにリンクを置いておきますね。

長い道のりでした。これでマルチデバイスで同時にプレビューが可能になります。

Google Analyticsをユニバーサルアナリティクスへ移行するまでの期限

公式情報が全然見つからないのですが、どうやら正式リリースから2年のようです。

Google アナリティクス利用者は例外なくユニバーサル アナリティクスへのアップデートが必要になります。しかも移行には期限があり、正式リリースから2年経過すると、古い技術を使って収集したデータは処理されなくなってしまいます。

Source : 「ユニバーサル アナリティクス」移行準備のススメ | コラム | ミツエーリンクス

Google Analyticsで自宅のIPアドレスを除外フィルタする

ある程度トラフィックの多いサイトであれば、自分のアクセスを除外する必要性を感じないかもしれません。

しかしですよ、Google Analyticsで多角的にデータを見たいときはクリックイベントとかを計測し始めるので、それがブレてしまうのはいかがなものかと。やっぱりInternal IPは除外した方がよいので、設定してみました。

手順は、

  1. アナリティクス設定 > 全てのフィルタ> 新しいフィルタ > カスタムフィルタ
  2. 「フィルタフィールド」をIPアドレスにして、フィルタしたいアドレスをエスケープして入力(※ここで注意したいのは、ピリオドの前にバックスラッシュを入れること)

という感じ。みんなちゃんと設定しておきましょう。

f:id:skrt2y:20140414232516p:plain

WPのDBが重すぎるとき引っ越しでトラブるのでコマンドでやろう

いつもWordpressのDBを引っ越しするときにDBが重すぎると

  • エクスポート:DBがデカすぎてphpMyAdminが落ちる
  • インポート:DBがデカすぎてphpMyAdminが「そんなサイズ読めません」

って言われてなんだかんだ、設定が必要だったりトラブルが多い。なので、dogmap.jpさんのやり方を見て、エクスポートはコマンドでバイナリダンプ、インポートもmysqlへコマンドで直接ブチ込むようにしたら、なんのエラーも出ずに綺麗に引っ越しができることがわかったので、今後はこれでやろうと思っています。

エクスポートはこれ

mysqldump --default-character-set=binary \
 -h localhost -u mysqluser -p wordpress_db > wpdump.sql

インポートはこれ

mysql -u mysqluser -p wordpress_db < mysqldump.sql

via WordPress の引っ越し方法色々 | dogmap.jp

Wordpressで利用するEC2のインスタンス選び

インスタンス選びで悩んでいました。価格を取るか快適を取るか。

まず、インスタンス選びで価格を見るのですが、あんまり小刻みな料金体系ではないです。東京リージョンの場合でざっくり

  1. 約2,000円/月 (t1.micro)
  2. 約6,000円/月 (m1.smallなど)
  3. 約13,000円/月 (m1.midium , c3.largeなど)

こんな感じなので、6,000円の次が倍以上の価格なのが痛いです。

で、ウチ(www.danshihack.com)の場合のCPU負荷をm1.smallとc3.largeで比較してみたので見てみましょう。

m1.smallの場合 (CPU負荷が100%まで上がります)

f:id:skrt2y:20140316113917p:plain

c3.smallの場合 (CPU負荷が10%平均で余裕があります)

f:id:skrt2y:20140316113920p:plain

やっぱりコンピューティング最適なc3は至極快適で、WPの設計が悪いのか、m1.smallはもっさりしてしまいました。これじゃ仕事にならんということで、c3で行く予定なのですが、少しお高いですよね。

そもそもWPの設計が悪い可能性がありますが、そのへんは勉強中なので、今は棚に上げておきましょう。

あとAWSレンタルサーバーに比べて、自分で負荷状況をモニタできたり、試しにサーバー立ててみたり、スケールのアップダウンをいつでもできたりと、クラウドって素敵だなと思うプロダクトに仕上がっています。おもしろいよ。

JSの中にPHPって書けるのね

すごい当たり前のことだけど、気づくのに時間がかかったという話。

PHPってそもそもHTMLに埋め込めるんだから、もちろんscriptタグの中、つまりJavascriptの中にPHP関数書いてても、そりゃ展開されまし、その展開後のファイルをブラウザが読むので、Javascriptの挙動には影響がないです。

当たり前だorz

<script>
$(function(){
   get_social_count_facebook("<?php the_permalink(); ?>", "socialarea_facebook");
   get_social_count_hatebu("<?php the_permalink(); ?>", "socialarea_hatebu");
   get_social_count_twitter("<?php the_permalink(); ?>", "socialarea_twitter");
})
</script>

参考 : jQueryでツイート数、はてブ数、いいね数を取得して自由にデザインする方法 | アンギス