フォーラムへの返信
-
投稿者投稿
-
ただ元々PC時には解除ボタンはファイルをアップしない状態でも表示されていて、今はファイルを一度アップしないと解除ボタンが表示されず、また表示位置もさきほどまではボタンのすぐ近くにあったのが今は右端に寄っているようで…??
それがデフォルトの仕様なので、ファイルをアップしない状態でも表示されてたりするのが不具合ですね…。ちょっとなんでそうなったかはわかりませんが、追加している(ご自身の分でなくても何らかのプラグイン由来とか)CSSか、あとはキャッシュ系プラグイン・CSS を最適化するようなプラグインを使っている場合でも発生する可能性はあるかもしれません。
こちらのトピックは、とりあえず暫定的にCSSでの対処法を教えていただきましたが正式にアップデートいただくまで閉じないほうがよろしいでしょうか?
あ、そうですね、作業後に修正版をリリースするので、それで動作確認ができたらクローズしてもらえると!
♥ 0Who liked: No user例えば
[x] 晴れ [ ] 雨 <img src="..." alt="晴れ">
というフォームがあったとして、「雨」を選択すると画像も「晴れ」から「雨」に変わる、みたいなことでしょうか?
♥ 0Who liked: No userデベロッパーツールで「解除」のところを選択すると、どのような CSS がどの CSS ファイルから当たっているかが確認できるので、
text-decoration
がどの CSS ファイルから当たっているかを確認すれば原因がどこかわかるかもです。♥ 0Who liked: No userありがとうございます!
利用する投稿タイプはイベントのみチェックしています
もう一点すみません、この「イベント」のタクソノミーアーカイブページの URL も教えてもらえますか?
一点気になったのが、「対話の庭 vol.6」を開いたときに、パンくずリストが
ホーム > イベント > 対話の庭 vol.6
つまり、
ホーム > カスタム投稿アーカイブ > 記事
となっている点です。何らかのタームに割り当てられているときは、
ホーム > カスタム投稿アーカイブ > ターム > 記事
となるようにしているんですよね。例えばこのサイトでいうと、パターンライブラリーはカスタム投稿なのですが、記事ページに行くと
ホーム > パターンライブラリー(カスタム投稿アーカイブ) > FAQ(ターム) > FAQ-123440
のように、パンくずにカスタムタクソノミーアーカイブへのリンクも含まれています。
多分ここが出ていないのと、一覧でカテゴリーラベルが出ていないのは同じ原因な気がしていて、例えばよくあるのだと
– タームが割り当てられていない
– そのカスタムタクソノミーが public ではない
– カスタム投稿タイプとカスタムタクソノミーが関連付けられていないなどです。
カスタムタクソノミーをコードで追加している場合、
register_taxonomy()
の引数でpublic
がtrue
になっていればカスタムタクソノミーアーカイブが公開されますが、false
だと 404 になります。カスタムタクソノミーをプラグインで追加している場合は、多分そのカスタムタクソノミーの設定画面に public とか 公開する みたいな設定があるのではないかと思うので、確認してみてください。
♥ 0Who liked: No user本来折り返しがきくべきところだと思うのですが、効いていないようです。
これはもともとの CSS の設計が甘かったようです。確認してアップデートで修正を入れたいと思います。お急ぎであれば
.smf-file-control
と.smf-file-control > label
をflex-wrap: wrap !important
すればとりえあえずは折り返すと思います。また直接関係はなさそうですが、「解除」ボタンもテキストリンク?のアンダーラインがアップデート情報の参考画像では付いていたと思うのですが、こちらも付いていないようで、これは何か原因がありますでしょうか?
これはこちらの環境では下線が表示されているっぽいです。もし独自に CSS を追加されているのであれば、その影響がないか確認してみてください。
♥ 0Who liked: No userまず、下記について教えてください。
– 投稿タイプは「イベント」?
– 「対話の庭 vol.6」は、何というカスタムタクソノミーの何というタームに割り当てていますか?♥ 0Who liked: No user実際にはメディアクエリというか、PHPでの条件分岐の書き方の情報だったのかなと思いました。
なるほどです。記事をみた感じだと、確かにメディアクエリではなくて UA で条件分岐させる方法みたいでした。
『Blocks Animation: CSS Animations for Gutenberg Blocks』プラグインを別で入れているので、こちらを使い別ページのブロック内で仮にアニメーションを付与したバナー画像を作り、ブロックをHTML化することでCSSへの追加記述無く簡単なアニメーションまで実装できました。
アニメーションも便利なプラグインがあるんですね…。
解決済みということで、トピックのクローズをお願いします!
ブロックに用意されているフィルターフックの一覧表などはあるのでしょうか。
ある程度はこの公式サイトのお知らせ記事に書いているとは思いますが、まとまっているものはありません…すみません。
/wp-content/plugins/snow-monkey-blocks
を VS Code 等で開いて、apply_filters
で全文検索するのが確実ではあります。Snow Monkey テーマのフックについては GitHub の wiki にまとめていますが、こちらももしかしたら漏れがあるかもしれないので、VS Code 等で全文検索するのが確実だとは思います…。
カスタムフィールドにはどのようなデータでも保存できるので、Snow Monkey Blocks のカスタムフィールドブロックでは表示したいカスタムフィールドの指定だけをして、シンプルにそれを出力する、という仕様にしています。
確かにフォーマットを選択できる UI があれば便利かなとは思いますが、あらゆるフォーマットを追加し続けないといけなくなりそうなので、どういう UI が適切か(または僕の技術力的に可能なのか)が難しいかなと感じます。
一応フィルターフックが通るようにはしているので、コードを書けば好きなフォーマットで出力することは可能です。
add_filter( 'snow_monkey_blocks_custom_field_value_カスタムフィールド名', function( $value, $post_id ) { return $value; // ここで好きなフォーマットに変換して返す } );
現状、下記のコード最上部にあるCSSが効いており、.wp-block-imageクラス配下にある、すべてのimgに対してスタイルが設定(height: auto;)されているようなので。
あ、
width
が HTML or CSS で指定してあってheight: auto
な場合だと、多分その画像のもとの比率を保った状態で表示枠が確保されて、そして画像がロードされる(はず)なので、多分それは問題ないのかなと思います。width
もheight
も両方auto
の場合だとか(すみません、これ未検証なので実際どうなるかはわかりません)、HTML 上のwidth
を上書きするように CSS でwidth
が指定してあるとかだとずれることがありそうだなと。②もしかしたらですが(根拠はないのですが)、imgにloading=”lazy”(遅延読み込み)が自動付与されていますが、decoding=”async”(画像の非同期デコード)も自動付与されていることは関係ないでしょうか?
可能性はあるかもですが、この公式サイト上ではズレないので、別な要因、あるいは別な要因との組み合わせ、という可能性のほうが高いのではないかなと思います。
前に書きましたが、やはり
んーとなると width・height 以外の別の要因ですかねー。一旦コンテンツをガバっと消して、少しずつ戻していきながら都度都度スクロールが正しく動作するか確認していき、正しく動作しないものがでてきたらその場所が原因だとわかるので、さらに具体的に原因を追求していく、という感じで絞り込んでいくのが良いのかなと思います。
が確実かなと思います。あとは一旦、独自に追加した CSS をすべて消して試してみるとか、高速化プラグインを入れているなら無効化してみる、とか。
♥ 0Who liked: No user②ちなみに、あまりよくない&実際に試してはいないのですが、下記の記述等で画像の読込遅延(Lazy loading)の機能を停止するアプローチでも、今回の症状は改善される可能性はあるのでしょうか?
どうなんでしょう? 基本的には
width
・height
があれば画像が読み込まれていなくても画像の表示範囲は確保されているとおもているのですが、試してみるのも良いかもしれませんね。③色々と検索してみたのですが、管理画面上で高さ(CSS)を設定しなくても、最初からhtml上で高さも幅も設定されているのに、画像の専有面積として認識されないのはなぜなのだろうと少し疑問に思ってしまいました。(勉強不足ですみません)
なんですかねー。CSS のほうで画像の幅も高さも auto にしている部分があれば、
width
とheight
があっても無効化されちゃうと思うので、もしそういう CSS を追加されているのであればそういう影響はあるかもしれません。■ちゃんと値が設定されている
width=”330″ height=”365″
※PXでないから?や、これはこれで問題無いはずです。
♥ 0Who liked: No user -
投稿者投稿