WordPress│カスタムブロックの作成

ブロックエディタのブロックは便利ですが、もっとカスタマイズしたいことはないでしょうか?

そういった時はカスタムブロックを作成すると便利です。

たとえば、リンク機能を変更できる評価用のブロックです。

見た目は普通ですが、別画面で開いたり、nofollowにできたりとオプションをいろいろ追加しています。

表示

編集画面での入力

こういった自作のブロックを記事の好きな場所に表示できるところが、カスタムブロックのメリットです。

カスタムブロックの作り方

作り方はいろいろありますが、今回は専用のプラグイン(Lazy Blocks)を使って作成してみます。

無料ですが、とても使いやすいプラグインです。

パラメータの作成

テキストや画像、URLといった様々なタイプのパラメータの枠を定義します。

コードの作成

PHPでコードを書きます。先ほどのパラメータを参照しています。

もちろんCSSも書いて見た目も整えます。

最後に保存すれば完了です。

カスタムブロックを使用

作成したブロックを読み込み、記事編集画面のパラメーターを入力していきます。

見た目だけでなく、HTMLのコードや色も変更できるようにできます。

こちらは編集画面のブロックの状態です。

最後に記事を公開して確認します。

まとめ

以上のように様々なパラメータを作成して、カスタムブロックを作成できます。

もし、こういったカスタムブロックを作成したい!という希望があれば、是非お問い合わせくださいませ。