対馬 俊彦
フォーラムへの返信
-
投稿者投稿
-
石川 様、
翻訳を更新して「MENU」に戻ったことを確認しました。ありがとうございます。
フィルターフックの情報もありがとうございます。
以前にこの部分を「メニュー」と表示したことがあって、
そのときはフックの存在に気づかなかったので、JavaScript で書き換えました😅次にカスタマイズする機会があればフィルターフックを使わせていただきます。
2024年11月4日 10:11 AM 返信先: 「Lightning G3」で、最初に表示されたヘッダーメニューをx-t9のように画面をスクロールしてもそのまま固定して表示しておくことは出来ないのでしょうか? #103389横から失礼します。
> スマホは現在のままでいいです。
から推察すると、パソコンでもフローティングバナーを表示したいということでしょうか?
もしそうだとすると、スマホのフローティングバナーと同じ考え方でできると思います。
以下の CSS を試してみてください。
@media (min-width: 769px) { .floating-banner-container { display: flex; bottom: unset; top: 0; left: unset; right: 0; width: 50%; } }
こんなことをしたいのかな、と思いました。違ってたらすいません…
私もロリポップのハイスピードプランを使っています。
私の作業用サイトにデモサイトデータをインポートして試したら、たしかにブレを感じます。
ロリポップ!アクセラレータ を有効にしたらブレが気にならなくなりました。
ご参考まで。
たぶん、Google Fonts の読み込みがフッターの後ろなので、これが影響しているのではないかと思います。
そうだとすると、デザインスキンを Origin III から プレーン に切り替えるとブレる現象が解消されるはずです。
Origin III が Google Fonts をフッターの後ろで読み込んでいるのは理由があると思いますので(表示速度とか…)、上記の通りだとすると、以下のどちらかで対応するのではいかがでしょうか。
【案1】デザインスキンを プレーン にする
スタイルをカスタマイズするのであれば、プレーンの方が都合がいいです。【案2】ヘッダー部分で Google Fonts を使わない
以下の CSS を書けば、ヘッダー部分に Google Fonts が使われなくなります。body header { font-family: "ヒラギノ角ゴ ProN","Hiragino Kaku Gothic ProN","メイリオ",Meiryo,"MS Pゴシック","MS PGothic",sans-serif; }
モバイル下部には「スクロールすると横からでてくるCTA」で電話番号を固定表示させているため、上部に全ての科目のボタンを固定で設置するのも画面が狭くなるので難しく…。
モバイルナビ上部ウィジェットは固定表示ではなく、ハンバーガーボタンをタップするとハンバーガーメニューの上に表示されますので、画面が狭くなるという心配はありません。
それでも11個のボタンは多いので、モバイルナビ上部ウィジェットにアコーディオンブロックを置くやり方がいいかもしれません。
Attachments:
You must be logged in to view attached files.「診療案内」(余白部分と「V」も含め)の行のどこをタップしても、
アコーディオンが下りてくるようにしたいです。診療案内ページを経由せずに、閲覧者がすばやく個々の診療科目の案内ページに辿り着けるようにしたい、ということが目的なのだと理解しました。
モバイルナビ上部 または モバイルナビ下部 のウィジェットにボタンを置く、ってのはいかがでしょうか?
Attachments:
You must be logged in to view attached files.検索フォームにマウスオーバーすると「検索フォームを編集」と表示されるボタン
このボタンは私のサイト(テーマは Lightning)では表示されていません。
検索結果に設置した検索フォーム下に表示される「編集」
こちらのボタンは私のサイトではフォームの直後に配置されていますので、
以下の CSS を書いて消すことができています。body.logged-in form.vk-filter-search + a.btn { display: none; }
横から失礼します。
VKパターンライブラリではないのですが、
私のサイトでも Lightning をアップデートしたら、
レイアウトが変わってしまったページがありました。調べたところ、/lightning/_g3/assets/css/style-theme-json.css
に以下の margin-block-end が追加されたことが原因でした。.wp-block-column[class*=wp-container-]>:is(p,ul,ol,dl), .wp-block-group[class*=wp-container-]>:is(p,ul,ol,dl) { margin-block-start: unset; margin-block-end: var(--vk-margin-element-bottom); }
このトピックの症状も同じ原因のようです。
以上、とりあえず報告させていただきます。
グリッドカラムカードアイテムを少なくしたものを固定ページで複数作って、
その複数の固定ページを VK 固定ページ本文 ブロックで読み込むようにしたら
この問題が解決するかもしれません。横から失礼します。
以下のように理解しました。
違ってたらご指摘ください。>質問者様[1] ページ先頭を表示しているときはグローバルナビを表示しない。
[2] スクロールするとグローバルナビが現れる。
[3] トップページだけ [1] [2] のようにしたい。[1] [2] だけでよいなら(すべてのページに適用するなら)、
.global-nav { display:none; }
[1] [2] [3] をやりたいなら、
body.home .global-nav { display:none; }
という CSS でいけそうです。
該当URL をシェアデバッガーで試したところ、
閲覧禁止を意味するレスポンスコード 403 が返ってきますね。この現象について Facebook の開発者コミュニティフォーラムでも話題になってますが、
[ 未解決 ] のままです。https://developers.facebook.com/community/threads/825654679324994/?locale=ja_JP
なんとなく、解決が難しいような…
なんとなく、放っておけば、そのうちに 403 が解消するような…
そんな気がします。← 根拠はないです。なんとなく経験的に…
-
投稿者投稿