WordPress | Narumium Blog

【AWS】EC2からLightsailに乗り換え

AWSのサーバはクラウドサーバのEC2とVPSサーバのLightsailがあります。

大雑把に言うと自由自在で従量課金のEC2と安定して安い月額のLightsailです。

コストダウンのためにWordPressブログの移行をしたのでそのメモ。

続きを読む【AWS】EC2からLightsailに乗り換え

【WordPress】Akismetでスパムコメントをはじく

Akismet は WordPress では基本のプラグインでスパムからブログを保護できる。

大体のWordpress解説サイトでも最初のほうにあると思う。

私は斜め読みして設定しようとした結果、クレジットカード必須かと思って有効化してなかった。

これまでは日に数件だったし手動で問題なかったけど、最近になって特定の記事に200件/日のスパムが投稿されて面倒になってきて調べなおした。

クレカ登録必須じゃなかったんだね…

バズ部

Akismetの設定方法

ちょっと古いから多少の違いはあるけどわかりやすかった。

これでスパムに悩まされる日々からさよなら。

【スパム？】WordPressブログへの英語の応援コメント

最近英語でコメントがされていることが多い。

内容を見るとブログの指摘だったり応援だったりする。

Eメールアドレスは個人のものに見えるし、よくあるような怪しいリンク先もないので一見するとスパムっぽくない。

けどやっぱりおかしい点がある。

日本語ブログに英語コメ
零細ブログに複数人名義から連投されている
ホームページは入力必須でないのにヤフー（米）のアドレスが入力されている
コメントでググると同じコメントがヒットする
ブログの内容には触れない（どんな投稿に対してもそれっぽく読めるコメント）

マルチポストだということはすぐにわかるけど、目的がわからないので混乱した。

広告もサイト誘導もなくSEOにかかわりそうな内容でもない。

ほいほい承認したら追加でスパムがきたりするのかもしれない。

Twitter上でWordPress記事の要約を表示する

WordPressの記事投稿をTwitterでつぶやいたときの表示がなんか味気ない。

そこから連携できそうな部分を設定してタイムライン上で以下のような表示になるようにしたので、その手順を忘れないうちにメモ。

ちなみにこのアイコンはうちの猫で内容にはまったく関係がない。

ステップ１：Twitterの設定

プロフィールの編集を押してホームページのところにルートURLを設定する。

コレだけでOK。

ステップ２：WordPressの設定

All in One SEOプラグインの機能管理からソーシャルメディアを有効化。

その後ソーシャルメディアからTwitter設定を見つけてTwitter情報を書き込む。

ユーザーの設定にもTwitterアカウント（@ほにゃらら）を入れる場所があるので入れておく。

Twitter上で表示される内容は投稿画面の下のほうにあるAll in One SEO Packのソーシャル設定で変えることができる。

ステップ３：確認

以上で完了！

Twitterのタイムラインだと多少ラグがあるけどCard validatorを使うとすぐに確認ができる。

どこかで失敗している場合にはその情報も出るみたい。

WordPressの記事内でリンクをカード形式にして表示する

記事に何かしらのリンクを張るときに、はてなブログでブログカードと呼ばれているようなものを使いたい。

「Pz-LinkCard」というプラグインを使うことで実現できるようなので試してみる。

使い方はエディタで次のショートコードを書くだけ。

[blogcard url="URL"]

1	[blogcard url="URL"]

普通の記事にリンク

Narumium Blog

WordPressの記事が検索結果ではHTTPS表示になる

Googleの検索結果から記事を開こうとするとURLがhttps始まりになり、SSL通信で接続しようとする。この原因はGoogleがhttpsページを優先しているからとのこと。検索結果...

アイキャッチのある記事にリンク

Narumium Blog

賃貸を探すときには月額でなく合計費用を見よう

あらまし急遽引越しを行うことになったのでSUUMOやHOMEｓのような総合サイトから不動産屋の検索ページを探していた。条件検索で要望にあった物件を探せるのは便利だけど...

外部リンク

WordPress.org

Pz-LinkCard

This plugin is intended to display a link in a blog card format. The goodbye to the text-only link.

見た目はCSSで変えられるようなのでとりあえずデフォルトの場合を画像で残しておく。

ちょっと見た目に違和感がある。

URL部分とfaviconがうまく表示されていないのも気になるけどとりあえずOK。

WordPressの記事が検索結果ではHTTPS表示になる

Googleの検索結果から記事を開こうとするとURLがhttps始まりになり、SSL通信で接続しようとする。

この原因はGoogleがhttpsページを優先しているからとのこと。

検索結果でも優遇されるらしいのでいいことかと思いきや、ちゃんとSSL証明書を買って適応してないとページが表示される前に以下のような警告が表示される。

ssl

これを見ても気にせずアクセスする人がどれくらいいるのか。

対策としては WordPress HTTPS (SSL)プラグインをインストール、有効化して

Force SSL Administration（adminページをhttpsにする）
Force SSL Exclusively（SSLが有効でないときにhttpにリダイレクトする）

をチェックして保存する。

これで検索結果のhttpsもhttpにリダイレクトされるし、そのうち検索結果もhttpに変更されるはず。とりあえずこれで少し様子見。

過負荷でもないのにサイトにつながらないのはDDoS攻撃のせいだった

また落ちた

リソースの負荷もメモリ以外高くないのでネットワーク系かなーと思ってapache2,mysql,php-fpmを１から勉強してパラメータを調整しつつ様子を見るが変化なし。

topコマンドでリソースを見てもずっと同じようにphp-fpmが動いてるだけ。

あれ？ほぼアクセス０なのになんでこいつずっと動いてるんだ？

Apacheのログを見て驚愕する

なぜサーバログを最初に見なかったのか。

EC2.microに入れたこともあってリソース問題だと決め付けてかかったのが悪かった。

反省しつつ確認すると xmlrpc.php あてに大量のPOSTが送られていた。

３つのIPからきていたのでとにかくiptablesでIP拒否。

無事アクセスできるようになった。

原因と対策

xmlrpc.phpでググると色々出てきた。

どうも踏み台にされていたらしい。

対策としては

IP拒否 : iptables -I INPUT -s xx.xx.xx.xx -j DROP
対策プラグインを入れる： Disable XML-RPC Pingback
- これはどうも最新版には対応していないみたいで仕事をしなかった
htaccess.conf　で xmlrpc.phpにアクセスできない設定を追加する
- htaccess.conf
  
  <Directory "/opt/bitnami/apps/wordpress/htdocs"> <Files "xmlrpc.php"> order deny,allow deny from all </Files> </Directory>
  
  1
  2
  3
  4
  5
  6
  
  <Directory "/opt/bitnami/apps/wordpress/htdocs">
  <Files "xmlrpc.php">
  order deny,allow
  deny from all
  </Files>
  </Directory>

感想

先入観ダメ。ゼッタイ。

「EC2 micro WordPress 遅い」みたいな調べ方では今回の原因にはたどり着けなかった。

きちんとログ見て原因の当りをつければすぐに見つかったので順序立てて調査しないといけない。

怪我の功名だけど今回の一件で色々チューニングの勉強ができたのは良かった。

WordPressでコードをいい感じに表示する

何をすればいいか

プラグインを入れることでエディタに機能が追加されるみたい。

紹介記事でよく出てくるのは以下の２つだった。

Crayon Syntax Highlighter
- エディタにボタンが追加されて、コード挿入モードを経てコードを書ける

SyntaxHighlighter Evolved
- 独自タグでコードを囲むことでコードを書ける（[css]…[/css]）
- 紹介ページを見る限り使いにくそう
  - マウスドラッグで選択すると行数まで選択される
  - マウスドラッグでコピーできない
  - アクションボタンがコードにかぶって見にくい

というわけでCrayon Syntax Highlighterをインストール＆有効化した。

実際に使ってみる

プログラム言語：default

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="wrapper">
  <p><span class="red">TEXT</span>TEST</p>
</div>
</body>
</html>

<!DOCTYPE html>

<html>

<head>

</head>

<body>

</div>

</body>

</html>

プログラム言語：XHTML

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="wrapper">
  <p><span class="red">TEXT</span>TEST</p>
</div>
</body>
</html>

<!DOCTYPE html>

<html>

<head>

</head>

<body>

</div>

</body>

</html>

エディタ上はどう見えるか

エディタだと上２つとも同じに見えるので、プレビューで確認する必要がある。

edit

EC2にインストールしたWordPressが急に重くなる

前触れもなく使えなくなった

ブログの管理をしようとすると読み込み中のままで動かない。

ブログの表示もままならない。

何にもしてないのに壊れた！と騒ぎつつログをとってとりあえずインスタンスを再起動してみる。

動かない。

Route53を疑ったり、ブラウザを疑ったりしながら原因を探す。

ググってみるとphp-fpmが暴走したという記事がちらほら目に入るがこれは関係なかった。

やってみたこと

とりあえずインスタンス再起動。

次にWordPressの再起動。

この環境はBitnamiに入っているのでsudo /opt/bitnami/ctlscript.sh restartで再起動するはず。

しばらく待ってみるが遅いまま直らない。

そういえばこの環境ではスワップファイルがないのを思い出してAWS EC2のt2.microでメモリが足りなくてエラーが出る場合の対処を試してみる。

少し待ちつつ他の原因を調べてみるが、どうも今回の現象とは関係なさそう。

ふてくされてネットサーフィンする途中でアクセスしてみたら直っていた。

スワップが効いたのか時間で直ったのか良くわからないがまあよし。

これで再発しなければどこかでメモリが足りなくなっていたのが原因なんだろうけどしっくりこない。

お手軽に扱えるかと思っていたけどもうちょっと勉強する必要がありそう。

WordPressを使い始める

テーマを決める

2カラム右メニューの中で探してみたが、気に入ったのはデフォルトの中の Twenty Fifteenだった。

無駄のないシンプルさが気に入った。

テーマを編集する

マージンをとりすぎだったので減らしたり、フォントを変えたり。

基本的に1つのスタイルシートを編集するだけでよかったけど、かなり編集しづらいので弄るときは自前のエディタを使ったほうがよい。

Analytics を入れる

とりあえず入れとけと思って追加。

サイドバー(sidebar.php)の終わり際にスクリプトを入れるだけでたぶん全ページ追えるはず。

プラグインを入れる

入れると便利なんだろうなーという認識程度でまだ入れていない。

WordPressに慣れていないのでわからないことを増やすよりはいいと思う。

ただプラグインを使えば簡単なのに使わずに自前でやってややこしくならないように気をつける。