ブロックエディタを使いたい

WooCommerceの商品用管理画面には、WYSIWYGエディターが2つ(商品説明&簡単な説明)備わっている(WordPressのクラシックエディタのそれとほぼ同じもの)。
WordPressは5.0からブロックエディタ対応になり、比較的簡単にレイアウトや装飾ができるようになったけど、WooCommerceのエディタはまだに使えない。
※wordpress.orgのフォーラムかなにかで、中の人がそう回答してるの見かけたけど、見つからない。
いずれブロックエディタに変わるのを首を長くして待っていよう。

ただ、やっぱり運営するクライアントにとっては、投稿や固定ページは使いやすくなったのに、なんで〜という気持ちだと思う。
ブロックエディタを使えたほうが、商品情報がリッチになって、何かと都合がいい。

どうにかブロックエディタで商品の詳細情報をつくれないかなぁーということで、日本語以外の情報も調べつつ、思いついたのが

再利用ブロックを使っちゃえ。

ということだった。(浅い)

構造的?に無理やりな感じはするけど、試しにやってみた。

再利用ブロックを使いやすくするプラグイン

再利用ブロックは、あらかじめ組み合わせたブロックやグループを使い回せる便利な機能。
あとから編集できるし、ブロックエディタだし。
ただ、クライアントが簡単に商品説明のWYSIWYGエディターに入れるには工夫が必要。
そこで以下の条件でプラグインを探した。

  • 左サイドに【再利用ブロック】メニューが表示され、再利用ブロックの新規作成・編集・一覧性などへのアクセスを容易にする
  • 【再利用ブロック】のショートコードを自動生成

この条件を満たすプラグインはとりあえず2つ見つけた。

このプラグインは、Snow Monkeyエキスパートに認定されている「オレイン」さんこと久野晃司(HAPPY SNOW MONKEYというSnow Monkeyのフックを可視化している便利なサイトの管理人さん)さんが開発したプラグインで、Snow Monkeyの開発者、キタジマタカシさんも関わっているので、Snow Monkeyとの親和性も高そう。

再利用ブロック
左メニューに「再利用ブロック」が登場!
再利用ブロックが「見える化」され、ショートコードも発行されている

ショートコードにしてしまえば、ウィジェットなどでも使えるので、何かと便利になる。
ただ、残念なことに「Easy Access Reusable Blocks」で生成されたショートコードだと、YouTubeなどの一部のブロックが適用されなかった。デベロッパーツールで見たら、ブロックエディタを示すコメントアウトを含むHTMLが出力されていたので、それが原因のようだ。
ウィジェットに入れても同じ結果だったので、こういう使い方は想定されていなかったんだろうと思う。ま、そりゃそうだ。
自己都合な使い方をしてるので、教えてあげるにも悩む。。。

もう1つはコレ。

こちらも「Easy Access Reusable Blocks」とほぼ同じ機能を持ったプラグイン。
こちらは、ブロックパターンに変換できる機能を持っているので、今回のような使い方をしない場合でも、ブロックエディタをガンガン使う場合には、重宝するプラグインだと思う。
「Easy Access Reusable Blocks」のショートではYouTubeが再生されなかったけど、こちらは問題なく再生されたので、吐き出されるコードに違いがあるってことだと思う。

商品ページがリッチになる

ちょっと強引な方法なんだけど、再利用ブロック機能を使うことで、WooCommerceの商品説明欄にブロックエディタを使うことができました。

商品説明って重要でリッチなほうがいいよね?
売る商品のストーリーって大事だし、写真も動画もふんだんに使いたいし、いろいろ工夫したい。
すべてのお客さんがHTMLを理解してWYSIWYGエディターを使いこなすのは、きっと難しいと思うし、投稿や固定ページがブロックエディタでそこそこ思い通りのことができるのに、買ってもらうために一番大事な商品ページがテキストだけ?ってやっぱり良くないので、ブロックエディタ使いたいよー!という場合に参考にしてみてください。

ただ、「再利用ブロック」というのがちょっと納得いっていないので、また別の方法が思いついたら記事にしようと思います。
ちなみにこんな情報もあったので、こちらもあとで試してみるつもり。

なにやらWooCommerceで動くらしいけど?

ということで、今日はこのへんで。

この記事を書いた人

GONSY

印刷会社のグラフィックデザイナーだった1998年に「会社案内」のHTML化をきっかけにWebの世界へ。
WordPressはMEから使っているけどプログラムスキルは一向に上がらない。WooCommerceは2018年から。忘れっぽくなってきたので、試したこと、実装方法を記録するためにブログをスタート。
最近、WordPress、WooCommerce、Snow Monkeyがおもしろいと感じるおじさん。