WordPressのプラグインに専用アイコンを登録する方法

WordPress4.0から、プラグインに専用のアイコンを表示させられるようになった。

WordPress管理パネルのプラグイン新規追加の画面

WordPress管理パネルのプラグイン新規追加画面

WordPress.orgのプラグイン検索結果一覧の画面

WordPress.orgのプラグイン検索結果一覧画面

オレも自分のプラグインに専用のアイコンを追加してみたくなったのだが、その辺のTIPSが見つからなかったので、WordPress.orgのプラグインバナー画像の設定を真似てやってみたところ、上手く行ったので、ここにやり方を紹介しておこうかと思う。

まずはアイコンを作る必要がある。
アイコンとして有効になる画像は、128px×128pxサイズのPNG画像(ファイル名はicon-128x128.png)かSVG形式のベクター画像(ファイル名はicon.svg)のようだ。両方アップロードした場合はSVG形式の画像ファイルが優先して使われるっぽい。
SVG形式のベクター画像を作成するにはIllustratorとかのベクターグラフィックスが描けるツールが必要になる。ベクター画像の方が表示される解像度に依存せずに綺麗に見えるので、もしSVG形式画像が準備できるならこちらでアイコンを作成するのをおススメする。
オレも早速、自分のプラグインのアイコンを作ってみた。

enter image description here

この例ではPNG形式のアイコンになっているが、SVG形式のアイコンも同時に作っている。
SVG形式の画像を作る時は、アイコンのベクターパスの周りにあまり余白を作らず、キャンバスサイズ一杯に収まるようにしておかないと、表示されたときにアイコンが小さ過ぎて見えなくなったりするのでご注意あれ。

次に、WordPress.orgの自分が管理しているSVNリポジトリにアイコンをアップロードするのだが、このやり方は使っているツールなどによって変わってくるので、その辺はツールに合わせて欲しい。
オレの場合は、まずサーバ上のローカルリポジトリにアップしてから、コミットしている。

今回は、プラグイン用のバナー画像も一緒にアップしたので、アイコンに関係のないJPEG画像も含まれているが、そこは気にしないでOK。

これで、自分のプラグインが表示された時に専用アイコンが見えるようになった。

WordPress.orgでのプラグイン検索結果から

なんか、様になって見える(笑)

Leave a Reply

Your email address will not be published.