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

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

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

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

 

普通の記事にリンク

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

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

賃貸を探すときには月額でなく合計費用を見よう
あらまし急遽引越しを行うことになったのでSUUMOやHOMEsのような総合サイトから不動産屋の検索ページを探していた。条件検索で要望にあった物件を探せるのは便利だけど...

外部リンク

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

 

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

Pz-LinkCard1

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

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

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

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

また落ちた

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

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

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

Apacheのログを見て驚愕する

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

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

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

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

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

原因と対策

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

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

対策としては

  • IP拒否  :  iptables -I INPUT -s xx.xx.xx.xx -j DROP
  • 対策プラグインを入れる  :  Disable XML-RPC Pingback
    • これはどうも最新版には対応していないみたいで仕事をしなかった
  • htaccess.conf で xmlrpc.phpにアクセスできない設定を追加する

感想

先入観ダメ。ゼッタイ。

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

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

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

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

何をすればいいか

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

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

 

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

 

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

 

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

実際に使ってみる

プログラム言語:default

プログラム言語:XHTML

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

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

edit

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

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

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

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

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

動かない。

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

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

やってみたこと

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

次にWordPressの再起動。

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

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

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

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

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

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

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

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

文字を画像に変換するアプリのアップデート

宣伝

アプリをアップデートしました : 文字画像

アプリの紹介

入力した文字を色、フォント、大きさ、斜字太字を設定して保存することができます。保存した画像は別アプリからも使用することができます。

変更箇所

・デフォルトのフォントサイズを30から100に変更

・背景色を透明のみから選択肢を増やした(白、赤、青、緑、透明から選択)

test

アップデートの理由

以下の問題を解決するため

・他アプリで使おうとすると文字が小さい

・アプリによっては透過画像をうまく表示できず真っ黒なものになることがある

 

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

あらまし

急遽引越しを行うことになったのでSUUMOやHOMEsのような総合サイトから不動産屋の検索ページを探していた。

条件検索で要望にあった物件を探せるのは便利だけど、単純に賃料だけで条件をつけると本当は条件にあっている良い物件を見逃すことがある。

その原因として敷金と礼金がある。

これらはそれぞれ基本的に1ヶ月ほどで設定されていて、一覧で見ているとあまり重視されないが合計で見るとかなりのインパクトがある。

どれくらいのインパクトか

1年住む場合、敷金礼金が1ヶ月分で5000円上の賃料と、2ヶ月分であれば1万円上の賃料とほぼ同じになる。

2年住む場合、敷金礼金が2ヶ月分で5000円上の賃料と合計がほぼ同じになる。

10年20年と住むつもりであれば影響はないが、数年のつもりなら更新費等も含めて合計で考えると意外と掘り出し物件があるかもしれない。

1年住む場合

家賃+共益+管理 敷+礼=0ヶ月 敷+礼=1ヶ月 敷+礼=2ヶ月
6 72 78 84
6.5 78 84.5 91
7 84 91 98
7.5 90 97.5 105
8 96 104 112

2年住む場合

家賃+共益+管理 敷+礼=0ヶ月 敷+礼=1ヶ月 敷+礼=2ヶ月
6 144 150 156
6.5 156 162.5 169
7 168 175 182
7.5 180 187.5 195
8 192 200 208

 

WordPressを使い始める

テーマを決める

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

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

テーマを編集する

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

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

Analytics を入れる

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

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

プラグインを入れる

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

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

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

WordPressをはじめる

新しくWordPRESSに手を出してみる

http://narumium.net/ や http://narumium.net/docs でサイトを作ってみつWordPressにも手を出してみた。

編集が微妙にtumblrに似ていてラッキーかと思ったが断然こっちが複雑な気がする。

続きを読む WordPressをはじめる

ブログを新規投稿する

ブログを新規投稿するついでにエディタの機能を確かめる

太文字hutomoji

イタリック

取り消し

  • リスト
    1. リスト2
    2. リスト3
  • リスト4

引用分

複数行


横ラインで強調する


左寄せ

中央

右寄せ

リンク http://narumium.net/

アンダーバー

両ぞろえ

特殊文字♠

続きを読む ブログを新規投稿する