MENU

キャッチアップ

スタッフブログ

baserCMSのプラグイン作成にチャレンジしました【てがきエディタ】

こんにちは。キャッチアップの瀬戸です。

今回のお題は「チャレンジ」ということで、baserCMSのプラグイン作りにチャレンジしてみたいと思います。

今まで他の人が作ったプラグインのコードを触ったり、チュートリアルに掲載されているプラグインの作成を行なったりしたことはあるのですが、自分で一から作るのは初めての試みです。

作成するプラグインについて色々と考えたのですが、【ブログの記事を作成する際にマウスで手書きした文字がそのまま表示されるようなプラグイン】を作ってみます。

ブログを書かないといけない!でもキーボードを叩く気力がない! という時にとても便利なプラグインですね。

さて、始めてみましょう。

新しいエディターがあるよーということをbaserに伝えてー

表示用の画面パーツを作ってー

と、もうできてしまいました。

記事の編集画面で書いた文字がちゃんと公開ページに表示されています。

しかし、たったの3ファイル作成しただけで完成というのはあまりにもあっけなさすぎるので色々と機能を付け足しました。

  • ブログの記事ごとに通常のエディタと、てがきエディタを切替可能
  • ペンの色変更機能
  • ペンの太さ変更機能
  • ペンの透明度変更機能

なかなか便利になったのではないでしょうか。

プラグインを作った感想として、ちょっとしたプラグインならとても簡単に作れる印象を受けました。

こだわりだすとあっという間に時間が経っちゃうんですけどね。

特に今回はペンの透明度の変更機能を追加したところ、なかなか綺麗な線を引くことができずに3日くらい試行錯誤を繰り返した結果、納得行くものができました。

そこら辺のコードも含め、今回作ったプラグインはGitHubにて公開していますので、興味がある方は是非ご覧ください。

https://github.com/seto1/TegakiEditor

お読み頂きありがとうございました。

2017/11/10

瀬戸 優一

アシスタントエンジニア

瀬戸 優一

太陽と海とPHPが好きです。

書いた記事一覧

新着情報一覧

ページの先頭へ