フォーラムへの返信
-
投稿者投稿
-
すみません、こちらの環境だとハンバーガーメニューにはエラーがでていないっぽいのですが、「MENU」の文字列を消されたりしていますかね…?
♥ 0Who liked: No userあ、というかハンバーガーボタン自体が
button
だから、span.c-hamburger-btn__label
をlabel.c-hamburger-btn__label
にしたら良いのかな…?♥ 0Who liked: No userなるほど! ご提案ありがとうございます!
各ハンバーガーボタンに aria-label 属性を追加
ハンバーガーボタンはデフォルトで
.c-hamburger-btn__label
に「MENU」という文字列があってaria-label
をつけると二重で読まれてしまうのかなと思うので、.c-hamburger-btn__label
にaria-labeledby
をつけるか、.c-hamburger-btn__label
をaria-hidden="true"
にした上でaria-label
を追加する必要があるのかなと思いました。各アコーディオンコントロールに aria-label 属性を追加
こちらアコーディオンブロックの HTML を変更する方法で対応しようと思うのですが、ブロックの場合はそのページの編集画面を開いたときにブロックの HTML 構造のアップデートがかかるので、既存のアコーディオンブロックに
aria-label
を追加したい場合はアコーディオンブロックを設置しているページの編集画面を開いて更新していく作業が必要になります。♥ 0Who liked: No userSnow Monkey の FontAwesome は CSS 版ではなく JS 版なので、JS か PHP で入れることになります。PHP のほうが簡単だと思うので PHP のサンプルコードを。下記のコードを My Snow Monkey プラグインか子テーマの
functions.php
に貼り付けてみてください。fas fa-globe
の部分は好きなものに変えてください。add_filter( 'render_block_snow-monkey-blocks/accordion-item', function( $block_content, $block ) { $block_content = str_replace( '<div class="smb-accordion__item__title">', '<div class="smb-accordion__item__title"><i class="fas fa-globe"></i>', $block_content ); return $block_content; }, 10, 2 );
お手数おかけして申し訳ないのですが、こちらで再現できないので、下記のファイルについて変更をいれてどうなるか確認してみていただけないでしょうか。
/wp-content/themes/snow-monkey/vendor/inc2734/wp-seo/src/dist/js/editor.js
の.includes
となっている部分を全部?.includes
に変更♥ 0Who liked: No userありがとうございます。確認します!
♥ 0Who liked: No user確認しました!
Snow Monkey のテーマディレクトリの名前が
snow-monkey_20230827
となってしまっているようです。下記のように変更してください。wp-content/themes/snow-monkey_20230827
↓
wp-content/themes/snow-monkey
♥ 0Who liked: No userオンラインコミュニティの DM で送っていただければと思います!
となると My Snow Monkey がちゃんと有効化されているかが怪しいですね。確認済みとのことですが、例えば僕もたまにやらかしてしまうのだと、
– A の WordPress の環境のダッシュボードで有効化して、B の WordPress 環境のページを確認してしまっている
– My Snow Monkey プラグインを複数 plugins ディレクトリに入れていて、コードを追加しているのと別の My Snow Monkey を有効化してしまっているどちらでもない場合だとちょっとわからないので、そのときは All in One WP Migration プラグイン等でその環境をエクスポートしてまるっと共有していただけるとこちらでも検証できるのでご検討ください…!
複雑なカスタマイズを組み合わせるとメンテが難しくなるので、いっそのこと HTML の出力を完全にオリジナルにしてしまうというのも良いかもしれません。
参考:
snow_monkey_pre_template_part_render_template-parts/loop/entry-summary
で記事一覧部分の各記事部分のみのカスタマイズ、snow_monkey_pre_template_part_render_template-parts/common/entries/entries
で記事一覧部分全体のカスタマイズができます。1記事目と2記事目以降での表示の違いは画像の有無だけに見えるので、僕なら
snow_monkey_pre_template_part_render_template-parts/loop/entry-summary
で1記事目を再現する HTML を書いて2記事目以降は CSS で画像を非表示にするかなぁと思います。こだわるならsnow_monkey_pre_template_part_render_template-parts/common/entries/entries
で PHP で頑張って1記事目と2記事目の HTML を出し分けるのもできなくはないと思います。♥ 0Who liked: No userブロックのイメージとしては、段落ブロックだけでなく、複数の要素を包括したグループブロックに適用できるのが使い勝手が良い気がします。
ですね! 基本的に中にはなんでも入れられるようにしたいと思います。
名称は単純ですが、「折りたたみブロック」(Foldable Block)なんていうのはどうでしょうか?
ご提案ありがとうございます!
ぐぐってみたら「Foldable」はまさに折って畳んで小さくすることができる的な意味合いと書かれていたのですが、UI の挙動的には折りたたむというよりは引き出しを引き出すみたいな、ちょっと見えてたものが全部見えるようになる、みたいな感じなので、ちょっとニュアンスが違うのかなぁと感じました。似た単語として「Collapsible」というのもあるらしくて、こっちはもっと汎用的な意味で小さくすることができることを指すらしいのでこっちのほうが良いのかなと思ったのですが、これも日本語的には「折りたたみ」なのですよね…。
もうちょっと検討してみたいと思います!
下記のリンクから Blocks と Editor がインストールされた、初期状態の Snow Monkey 環境を立ち上げることができるのですが、現象は再現できませんでした。
何か他の設定との兼ね合いがあるのかも?
♥ 0Who liked: No user -
投稿者投稿