WordPressのアイキャッチ画像を自動生成するプラグイン「Featured Image Pen」を開発したneruです。2024年の夏頃から試験運用を進めてきましたが、この度、販売を開始しました。
本記事はプラグインの紹介記事となります。
WordPressのアイキャッチ画像を自動生成するプラグイン「Featured Image Pen」
テキストと背景画像を組み合わせてアイキャッチ画像を自動生成するプラグイン「Featured Image Pen」。
買い切り制：月額のWordPressのプラグインが多い中で、「Featured Image Pen」は買い切り制を採用しています。
快適なUI：デザインなども専門なので快適なUIUXを心掛けています。
「Featured Image Pen」の使い方(動画)
「Featured Image Pen」の使い方動画版となります。
テキストによる紹介は下記のとおりです。動画よりもテキストの方が早く読める上、修正内容の反映も迅速なため、テキストでの閲覧をおすすめします。お好みの方法で読み進めてください。
テキストと背景画像を組み合わせて、アイキャッチ画像を自動生成
テキストと背景画像を組み合わせて、アイキャッチ画像を自動生成します。
- 「アイキャッチ画像にタイトルを書き込む（画像生成）」にチェックを入れる。
- 「アイキャッチ画像のURL」で背景画像を選択する。
- WordPressの「保存」ボタンを押す。
タイトルの自動反映とカスタムテキストの設定
アイキャッチ画像に表示するテキストは、記事タイトルの自動反映か、カスタムテキストの手動設定のいずれかを選択できます。
カスタムテキストが未入力の場合は記事タイトルが選択され、タイトルが変更されると瞬時にアイキャッチ画像も再生成されます。カスタムテキストを入力した場合は、お好みの文章を入力でき、改行位置の調整も自由自在です。
Googleフォントなどフォント対応
フォントを変更できます。Googleフォントなどは、指定フォルダにアップロードすることで簡単に導入できます。
フォントはご自身でアップロードする必要があり、ライセンスは各フォントの利用規約をお守りください。
フォントサイズ
フォントのサイズを指定できます。推奨サイズは30～50です。
それ以上の大きなフォントサイズも指定できますが、画像内に収まらない場合がありますのでご注意ください。
その場合、文字数を減らしてください。
テキスト色はRGBの指定も可
テキストカラーも変更できます。黒っぽい背景には白っぽい文字色、白っぽい背景には黒っぽい文字色がおすすめです。
RGBでも指定できます。
整列機能
テキストは左揃えまたは中央揃えから選択できます。
文章量が多い場合は左揃え、短い文章の場合は中央揃えがデザイン的におすすめです。
左揃えの場合、座標をピクセル（px）単位で指定できます。
低容量のWebP対応
アイキャッチ画像の生成は、低容量のWebP（ウェッピー）形式に対応しています。
WebP（ウェッピー）は米Googleが開発している画像フォーマットです。圧縮率が高いため、ファイルサイズを小さくでき、ページの読み込み速度を向上できます。透過機能にも対応しています。
PNG形式でも利用可能ですが、基本的にはWebP形式の利用をおすすめします。
アイキャッチ画像のテンプレート
背景画像は当プラグインに同梱されているため、簡単に設定できます。
*画像自体の転売や再配布は禁止していますので、ご配慮してもらえますと幸いです。
*なお、ブログのタイトルや著者名を追加したい場合は、グラフィックソフトで背景に書き込んでください。Adobe Photoshop(サブスク)、CLIP STUDIO PAINT(クリスタ、買い切り・サブスク)、Affinity Photo(買い切り)、GIMP(無料)などがあります。
*デザイナーやよりこだわりたい方はオリジナルの画像を使用できます。画面中央に文字が配置される仕様ですので、フォントサイズなどを考慮し、適切な背景画像をご自身で用意してください。オリジナル画像も、メディアライブラリにアップロードするだけでOKです。
ゴミデータができない仕様
画像更新時に新たな画像データを作成せず、既存の画像データを上書きするように設計されています。記事IDごとに画像は管理されています。
透過画像の対応
角丸や透明な画像は透明部分が抜けるよう対応しました。透過PNGと透過WebPのどちらも対応しています。
画像サイズの最適化
画像サイズが大きくならないように、減色はもちろん、画像処理の最適化も行っています。
「Featured Image Pen」のデフォルト設定で作業効率を向上
アイキャッチ画像を設定する際の作業効率を向上させるため、デフォルト値を変更できます。デザインの統一感を持たせるために同じような値が使われるのではないでしょうか。
デフォルト値を指定することで、変更の手間が減ります。
デフォルト値を設定する場合は次のとおりです。
設定 > Featured Image Pen
次の項目をデフォルト値として設定できます。
- フォントの種類
- フォントサイズ
- フォントカラー
- テキストの配置（左揃え・中央揃え）
- 左揃え時の座標（px値）
- 画像生成のフォーマット（WebPまたはPNGを選択可能）
画像サイズは、PNGよりWebPの方がサイズを小さくできるため、WebP形式をおすすめします。背景画像は、PNGまたはJPEG形式で用意してください。
「Featured Image Pen」の英語対応
開発者が日本人のため日本語の対応に問題はありません。
日本語だけではなく、英語バージョンにも対応しています。
「Featured Image Pen」の販売店
個人開発したWordPressのプラグイン「Featured Image Pen」をBOOTHで販売しています。
取扱説明書は、ebookbrainが独自に開発したオンラインマニュアルです。
β版の特別価格
β版は一定期間で終わりにしますので、β版期間中にお買い求めになった方がお得です。その後、正規の価格に値上げ予定です。
それ以降も機能追加のたびに値上げの可能性はあります。
「Featured Image Pen」のFAQ
「Featured Image Pen」のFAQはこちらの記事を読んでください。
「Featured Image Pen」のライセンス条項
「Featured Image Pen」のライセンス条項はこちらの記事を読んでください。
サポート体制
β版期間中は、製品の不備の可能性を考慮し、すべてのユーザー様向けにサポートを提供しています。この期間は安価かつサポート付きのため、大変お得な機会となっています。
β版終了後のサポートについて：
- 本製品は買い切り制で安価な価格で提供しているため、本体価格の中にサポート料金は含まれていません。大変申し訳ありませんが、サポート負荷が意外と高いためこのような対応とさせてもらいます。そのかわり買い切り型とさせてもらいます。
- 基本的には、シンプルな機能のプラグインのため、マニュアルを読めば操作方法を理解できると考えています。
- サポートをご希望の方は、pixivFANBOXにご加入ください。支援者様には以下のサポートを提供します。
- プラグインの使い方に関する質問
- 技術的な質問への回答（即答可能な範囲）
- その他、プラグインに関する各種相談
- こちらがわかることなら何でも回答させてもらいます
- 継続的に支援してもらえるのはありがたいですが、質問後の退会も問題ありません
- β版終了後も次の連絡は受け付けます。
- プラグインが動作しない(まったく動作しない場合は販売停止をするので、あまりないケースだと思っています)
- バグ報告や機能改善のご提案は随時受け付けますが、実装は状況に応じて判断させてもらいます。他にも複数の開発ラインを動かしているため過度な期待はご遠慮ください。
カスタマイズについて
- 個人または第三者のプログラマによるソースコードの改変は許可します。
- ソースコードのコメントは、基本的に英語で記述し、補足として日本語も併用しています。
- 第三者のプログラマに依頼する場合は、実装するプログラマ用と自分用の2つのライセンスを所持してください。
- ただし、ソースコードの転載、転売は禁止します。個人や社内利用などの非公開の形態に限ります。
できるだけ柔軟な利用規約で提供したい思いはありますが、当方が困惑する状況は避けてくださるようお願いします.。
開発の背景とプラグインの特長
普段は他の開発をしていますが、趣味サイトや開発ブログなど、複数のWordPressサイトを長期にわたって運営しています。そのため、一度WordPressのプラグインを作ってみたかったのです。もう一つの理由は、個人開発に興味があったからです。
アプリ開発のディレクターをしていましたが、マネジメントよりも現場での開発を望むタイプです。大規模の開発だと100人以上、小規模でも20人近くの人間が関わる現場を見てきましたが、AI時代の到来により、個人開発、もしくは2、3人でそれなりの開発ができると思っています。
ブロガーとしての経験上、タイトルをよく変更することがあるため、迅速に対応できる使い勝手の良い仕組みを目指しました.。タイトルを変更するたびにグラフィックソフトを立ち上げるのは面倒ですし、かといってアイキャッチ画像に文字が入っていないのも寂しいと感じていました。
すべてのアイキャッチ画像を用意するのは手間がかかるため、ブログの世界観を表現する適切な背景画像と組み合わせることで、作業時間を短縮したかったのです。
また、画像検索からの流入やSEO効果も期待できるかもしれません。
さらに、X（Twitter）に投稿するとX（Twitter）カードとして表示されるため、シェア時に視認性が向上します。
使い勝手は、ぱっと見、わからないところにもこだわっています。
たとえば画像を再生成するたびに新たな画像データが増えるとゴミデータが増えてしまいます。初期開発段階で、ゴミデータが発生しない仕様にすることを検討し、記事ごとに1つの画像を保持するようにしました.。
また、透過画像の対応、画像の圧縮なども行なっています。
まだ改善点もありますけど、今後のアップデートで検討していきます。
コメント