Snow Monkey Blocks v19.0.0 RC2

Snow Monkey Blocks のメジャーアップデートである v19 のリリース候補版を配布します。メジャーアップデートは後方互換性に影響がでる可能性が高いアップデートになりますので、もしテスト環境で動作確認いただける方は、正しく動作できた、ここにこういう不具合があった、などなどオンラインコミュニティにご報告いただけるととても助かります!また、リリース候補版はあくまで動作確認用であるため、本番環境での利用は推奨されません。

※今回は v18 のときのようなレイアウトに関する大きな変更はありませんが、WordPress 6.2 から追加された API を使っているので WordPress 6.2 以上が必須になります。

Snow Monkey Blocks v19.0.0 の概要

機能追加

  • 項目:スタンダード 「画像を表示する」「ボタンを表示する」の設定を追加
  • 項目:ブロックリンク 「画像を表示する」「ボタンを表示する」の設定を追加
  • 情報 「枠線の設定」「背景色の設定」を追加
  • 吹き出し 「枠線の設定」「アバターの表示・非表示の設定」を追加
  • メディアとテキスト 「カラム全体を塗りつぶすように画像を切り抜く設定」「色の設定」「カラム分割するタイミングの設定」「ブロックスタイル:枠線」を追加
  • セクション セクション(背景画像/動画) セクション(サイド見出し) セクション(ブロークングリッド) 各セクションブロック間でブロックの変換機能を追加

変更

  • インスペクターの設定パネルに ToolsPanel を使用するように変更
  • 枠線の設定は BorderBoxControl を使用するように変更
  • アラート コンテンツの追加に InnerBlocks を使用するように変更
  • 吹き出し コンテンツの追加に InnerBlocks を使用するように変更
  • アイコンリスト コンテンツの追加に InnerBlocks を使用するように変更
  • 価格表:プラン コンテンツの追加に InnerBlocks を使用するように変更
  • WordPress 6.2 対応:anchorRef prop を anchor prop に変更
  • WordPress 6.2 対応:wp.date.__experimentalGetSettingswp.date.getSettings に変更
  • WordPress 6.2 対応:is{Variant}variant="{variant} に変更
  • WordPress 6.2 対応:ImageSizeSelectControlImageSizeControl に変更
  • CheckboxControlToggleControl に変更

不具合の修正

  • Snow Monkey 以外のテーマを使用しているとき、iframe プレビューでブロックのデザインが崩れることがある不具合を修正
  • WordPress 6.2 対応:DateTimePicker のレイアウト崩れを修正
  • WordPress 6.2 対応:RSS URL 入力欄のレイアウト崩れを修正
  • 目次 タイトルが未入力だとタイトルが表示されない不具合を修正
  • 情報 ラベルの入力欄が1行下にずれて表示される不具合を修正
  • 価格表 カラムサイズの設定が効かない不具合を修正

Snow Monkey Blocks v19.0.0 RC1 からの変更点

RC 版と言いながら、要望や気になったところがでてきて結構変更を入れてしまいました…すみません…。

機能追加

  • パネル:水力レイアウト パネル:水平レイアウト 「画像を表示する」「リンクを表示する」の設定を追加
  • 価格表:プラン 「画像を表示する」「ボタンを表示する」の設定を追加
  • セクション(背景画像/動画) 区切り機能を追加
  • セクション区切りに「三角(大)」を追加
  • セクション区切りの設定に「コンテンツに区切りを重ねる」(デフォルト:有効)を追加

変更

  • 価格表:プラン リストを入れ子にしたときの表示を調整
  • リンク設定のポップオーバーは、設定済みの場合に自動表示するのではなく、ボタンクリックで開くように変更
  • いくつかのブロックの設定をインスペクタースタイルタブに入れるように変更

不具合の修正

  • 項目:バナー 「各項目をくっつける」を選ぶと、各バナー間に隙間が生じることがある不具合を修正
  • メディアとテキスト 「画像カラムのサイズ」で指定したサイズが正確ではない不具合を修正

項目:スタンダード 項目:ブロックリンク パネル:水力レイアウト パネル:水平レイアウト 価格表:プラン 「画像を表示する」の設定を追加

これまでは画像を設定していない場合でもブロックを選択すると画像の入力枠が表示されるようになっていたのですが、画像を設定する必要がないときでも毎回毎回選択する度に画像の入力枠が表示されるのが邪魔くさかったので、「画像を表示する・しない」を選べる設定を追加しました。デフォルトは「表示しない」になっています。

配置済みのブロックで既に画像を設定済みの場合は「表示する」の状態に変換されます。

項目:スタンダード 項目:ブロックリンク 「ボタンを表示する」の設定を追加

これまでは画像を設定していない場合でもブロックを選択するとボタンの入力枠が表示されるようになっていたのですが、ボタンを設定する必要がないときでも毎回毎回選択する度に画像の入力枠が表示されるのが邪魔くさかったので、「ボタンを表示する・しない」を選べる設定を追加しました。デフォルトは「表示しない」になっています。

配置済みのブロックで既にボタンの URL を設定済みの場合は「表示する」の状態に変換されます。

情報 「枠線の設定」「背景色の設定」を追加

吹き出し 「枠線の設定」「アバターの表示・非表示の設定」を追加

メディアとテキスト 「カラム全体を塗りつぶすように画像を切り抜く設定」「色の設定」「カラム分割するタイミングの設定」「ブロックスタイル:枠線」を追加

セクション区切りに「三角(大)」を追加

セクション区切りの設定に「コンテンツに区切りを重ねる」(デフォルト:有効)を追加

セクションの区切りは position: absolute でコンテンツに重なった状態で表示されるのですが、重ねずに表示したいことがあるなぁということで設定を追加しました。本当の意味で「重ねない」ようにするのは互換性的に難しかったので、「重ねないようにみえる」ように区切りと同じ大きさの padding を追加する実装にしました。

アラート 吹き出し アイコンリスト 価格表:プラン コンテンツの追加に InnerBlocks を使用するように変更

これまではこれらのブロックのコンテンツは RichText でテキスト入力をする形になっていたのですが、WordPress 6.3 からこの機能が廃止されるということで、RichTextInnerBlocks に置き換えました。この変更により、アラートブロック→段落のように、ブロックを入れ子にしてコンテンツを追加するようになります。

アイコンリスト、価格表については、WordPress 6.1 で追加されたリスト項目ブロックを使うようになる影響で項目の入れ替えができるようになったり、入れ子にできるようになります。

枠線の設定は BorderBoxControl を使用するように変更

独自の設定項目を使用していたのを、コアのものを使用するように変更しました。この影響で、保存される border-radius の設定値が number から string に変更になります。一応編集画面を開いたときに自動変換されるようにはしているのですが、うまくいかない場合があるかもしれないので、もしパターン等で border-radius を指定している場合は数値(例:0)から文字列(例:"0px")に書き換えてください。

リンク設定のポップオーバーは、設定済みの場合に自動表示するのではなく、ボタンクリックで開くように変更

例えばボタンボックスブロックのようにリンクを設定することができるブロックでリンクを設定すると、

  • ツールバーに「リンク解除」ボタンが表示され、クリックすると解除される
  • リンクが設定済みの場合はブロックを選択したときに自動的にリンク設定のポップオーバーが表示される

という仕様になっていました。ただ、ブロックやコンテンツの内容によっては自動的にポップオーバーが表示されると編集しにくい場合があるという問題がありました。そこで、リンクが設定済みの場合でも自動的にポップオーバーを表示することをせず、ツールバーのリンクボタンをクリックしてポップオーバーを表示する形に変更しました。その影響でツールバーにリンク解除ボタンは表示されないようになるのですが、ポップオーバー内のリンク解除ボタンから解除できます。

Snow Monkey v19.0.0 RC2 のダウンロード

ここから先は Snow Monkey サブスクリプションユーザー特典です。継続課金されている方はログインして閲覧できます。ご購入がまだの方はこちらから購入できます。

この記事を書いた人

キタジマ タカシ

長崎県長崎市在住。地元のWeb制作会社でWebデザイナー/エンジニアとして従事した後、2015年にフリーランス [ モンキーレンチ ] として独立。WordPress のテーマやプラグイン、ライブラリ、CSS フレームワーク等、多数のプロダクトをオープンソースで開発・公開しています。

Snow Monkey オンラインコミュニティ

Snow Monkey をより良いテーマにするために、今後の機能開発等について情報共有したりディスカッションをしたりする場所です。より多くのユーザーの交流があったほうがより良いプロダクトに育っていくと思いますので、ぜひご参加ください!