[WordPress]リンク先の情報をカード上で表示するlink-cardプラグインの今後

※この記事は丸太式 Advent Calendarの22日目です

昨日の記事で紹介したWordPressのプラグイン「link-card」ですが、現状あまり使いやすい状態では無いと思っているので継続的に開発していきたいと考えています。

現状の問題点

昨日の記事にも書きましたが、今のlink-cardプラグインには幾つか問題があります。
* キャッシュ機構がないので、アクセスのたびリンク先から情報を取得している
* aタグの直前に挿入するので、文の途中にaタグを使うと意図しないレイアウトになるかも
* etc…

今GitHubのIssueに登録してあるバグや機能拡張は今年度中にやると思います。
また、使いやすい形に出来るように自分でも使いながら考えてみようと思っています。

今後について

あまり英語は得意ではないので、しばらくはWordPress公式のプラグインディレクトリには掲載しないと思います。
将来的にプラグインディレクトリに公開することは十分考えられると思いますし、やる気はあります。

これからlink-cardをよろしくお願いします。

リンク先の情報を表示するlink-cardプラグイン[自作WordPressプラグイン]

※この記事は丸太式 Advent Calendarの21日目です

今日はWordPressプラグインを作りましたのでご紹介します。

link-cardプラグイン

基本情報

  • 名前
    link-card
  • 概要
    aタグにcreateCardクラス属性を付加しておくと、aタグの直前にカード状の情報ボックスを表示します。
  • 動作確認バージョン
    WordPress 4.1で動作確認しています。

使い方

プラグインをインストール

今のところ、GitHubでのみ配布しています。
https://github.com/bis5/link-card
「Download Zip」からZipをダウンロードして、wp-content/plugins/link-cardとして配置してください。
※GitHubからダウンロードしたZipファイルを展開すると「link-card-master」というディレクトリになりますが、「-master」は除いてください。

記事を作るとき

リンクを作成するとき、以下のようにclass属性を追加します。

<a class="createCard" href="http://www.yahoo.co.jp">やふー!</a>

すると、記事を表示した際に、リンクのすぐ上にリンク先の情報が表示されます。
こんな感じです。
この時表示されるのは、titleタグの内容とmetaタグのdescriptionの内容です。

既知のバグ

  • リンク先のdescriptionに日本語が含まれると文字化けする
    文字化けする例
  • descriptionを設定していないサイトではタイトルしか表示されない
    代わりにog:descriptionとか使うと多分いい感じ
  • (バグと言うより仕様ですが)WordPressのサーバからリンク先に都度アクセスするので、最悪アクセス遮断されかねない
    キャッシュするべきですね。。。

久しぶりにちゃんと成果が出た週末で、自分としては満足です。
もちろんこれから先も改修を続けるつもりなので、フィードバックやプルリクお待ちしています。

ubuntu server 14.04にwp-cliを使ってコマンドだけでWordPressをインストールする

※この記事は丸太式 Advent Calendarの20日目です

手順

1. Apache, PHP, MySQLをインストール

必要な物をapt-getでインストールします。

sudo apt-get install apache2 php5 libapache2-mod-php5 mysql-server php5-mysqlnd

php5libapache2-mod-php5の依存関係でインストールされる気がするけど気にしない。

2. wp-cliをインストール

コマンドラインでWordPressを操作するためにはwp-cliが必須です。

curl -O https://raw.githubusercontent.com/wp-cli/builds/gh-pages/phar/wp-cli.phar

動作確認はphar wp-cli.phar --infoで。
毎回phar /path/to/wp-cli/wp-cli.pharと入力するのは面倒なので、実行権限を与えた上でパスが通っているディレクトリにwpという名前でコピーしておくと便利です。

3. データベースを用意

mysqlのデータベースを作っておきましょう。

mysql -u DBUSER -p
mysql> CREATE DATABASE wordpress DEFAULT CHARACTER SET utf8;

必要に応じてWordPress用のMySQLユーザを作って権限を与えておきます。

4. wp-cliでWordPressをインストール

残りは一気に行きましょう。

mkdir -p /path/to/wordpress
cd /path/to/wordpress
wp core download --locale=ja
wp core config --dbname=wordpress --dbuser=USER --dbpass=PASSWD
wp core install --url=http://example.com/wordpress --title=TITLE --admin_user=ADMIN --admin_password=PASSWD --admin_email=admin@example.com

WordPress 4.1 “Dinah”がやってきた

※この記事は丸太式 Advent Calendarの19日目です

WordPress 4.1 “Dinah”がリリースされました。
このバージョンからデフォルトテーマが”Twenty Fifteen”に変更されています。

なんていうか・・・

めっちゃシンプルですね。

WordPressユーザーにとってもう一つ大きな違いは、集中執筆モードの変更です。
これまでは集中執筆モードに切り替えるとエディタ以外のすべてが消え去ってしまい、ぶっちゃけかなり使いづらい物でした。
また、エディタのボタンも画面上部に離れてしまうので、書式設定には向いていません。

4.1の集中執筆モードは、エディタは残しつつ、エディタ以外のメニューなどは非表示となります。

非表示となった部分を使いたい場合は、カーソルを持って行くことで再び表示されます。
また、再度入力を再開すると、エディタ以外はまた非表示になります。

今までと違って状態を切り替えるのにマウスクリックが不要になったので、結構快適です。