対馬 俊彦
フォーラムへの返信
-
投稿
-
横から失礼します。
スクロールしたときのボタンのスタイルの書き方は以下のようになります。
.header_scrolled .vk-mobile-nav-menu-btn.position-right { }スクロールしているかどうか以外にも以下のことを考慮して
ボタンのスタイルを CSS で記述する必要があります。[1] ログインしている状態かどうか（ツールバーの有無）
[2] タブレットなどのモバイル端末（body.device-mobile）への対応
[3] 画面幅を変えても見やすい位置になるように調整する下に行くほど難易度が上がります。特に [3] は苦労します。
いまのヘッダーのナビは項目が8個もあって文字数も多めですが、
これによりさらに [3] の難易度が上がっています。どうしてもやってみたい（やらなければならない）ということでなければ、
下記の代替案ではいかがでしょうか？(1) メニューを並べた固定ページを作る。
(2) 画面右側の [資料請求]・[モデルハウス予約] の上にボタンを追加して、(1) にリンクする。横から失礼します。
このエラーって、サーバーの負荷が高いことが原因で起きるようです。
昨日の夕方にエックスサーバーの一部のサーバーで「負荷上昇による著しい速度低下」が起きているので、これと関係あるのかもしれません。
カスタマイズ画面で設定した背景色の方が優先度が高いことが原因です。
以下のように!importantを追加してみてください。.page { background-color: #e8dcc5 !important; }【追記：ご質問者へ】
石川さんと私がほぼ同時に回答して、まったく違う考え方の回答なので
混乱してしまうかもしれませんが、両方試してみてご自分のサイトに
合いそうなやり方でどうぞ。> ハンバーガーメニューの横に電話ボタンを置きたかったので…
モバイル用ヘッダーのナビゲーションを削除して、代わりに電話のアイコンを置き、
（ハンバーガーメニューに被らないように）電話のアイコンの右マージンを設定すれば、
ハンバーガーメニューの左に置くことができますよ。> 今年前半に何等かの機能実装はしたいと考えています。
石川さん、ありがとうございます。楽しみにしてます🥰
> これは仕様なのでしょうか。
そういう仕様になってますね。
ナビゲーションは WordPress 標準のブロックで、
ちょっと試してみたところ、ご希望通りに動作させるのはかなり難しそうです。解決策ですが、Lightning 標準のモバイルナビはご希望の動作をします。
Lightning ヘッダー設定で
モバイル端末では Lightning 標準のモバイルナビゲーションを有効にする
にチェックをつけると、Lightning 標準のモバイルナビを使うことができます。下記ページの最後の方に説明があります。
【ひとりごと】
これ、X-T9 じゃできない、ってことか…サイトを拝見したところ、投稿の先頭に最終更新日だけが表示されていますので、
たぶん、検索エンジンはこの日付を認識してくれるんじゃないかと思います。実際、Bing 検索では現在そうなっていますし…。
このようにしたのが比較的最近なのだとしたら、
そのうちに Google 検索も期待通りの結果になるかもしれませんので、
しばらく様子を見てはいかがでしょうか。また、以下の CSS を追加すると日付の前に「最終更新日時」と表示されます。
.entry-meta-item-updated .screen-reader-text { clip-path: unset; position: static !important; }ご質問者のサイトで効果があるかどうかはわかりませんが、経験的には、
この文字を表示してある方が検索結果に最終更新日が表示されやすい傾向がある
と感じています。この表示が邪魔に感じなければ、試してみたらどうでしょうか？
ベクトル様、
このテキストは「最終更新日時」ではなく「最終更新日」の方が相応しいと思います。
いかがでしょうか？> 新規投稿は問題なく動きます（既存固定ページは遅いまま）
以前にこの現象に遭ったことがあり、その時の原因は
その固定ページに大量のリビジョンが溜まっていたことが原因でした。最初の質問の「新規ページでも既存ページでも同様に遅い」からすると、
リビジョンが原因じゃないと思ったのですが、とりあえずご参考まで。CSS を書かなくても、固定表示ブロックの設定で
メニュー開閉時に非表示にする
のチェックを外せばナビゲーションメニューが表示されるようになります。これは VK Blocks Pro 1.114.0 で追加されたオプションで、
デフォルトでチェックがついています。ほとんどのケースでは、ナビゲーションメニューが開いたときに
固定表示ブロックが隠れてほしいので、デフォルトがこうなっているのですが、
固定表示ブロックにナビゲーションブロックが含まれていると
ナビゲーションメニューが固定表示ブロックごと表示されなくなってしまう、
ということなんです。横から失礼します。
WP-Members というプラグインを使うと、
会員専用コンテンツに指定したカスタム投稿タイプも検索対象になります。会員以外が検索してもヒットして、
投稿を表示しようとするとログイン画面が表示されます。ご参考まで。
＞モバイルデバイスのブラウザには無効でした。
うわぁ、それはまずいですね。
HPは、もはやスマホから見られることのほうが普通な時代ですから。たわしそふとさんは↑このようにお考えなので、
トピックをクローズした後ですみませんが、重要なことなのでお伝えしておきます。プラグイン Background Music Manager は私が提示した JavaScript と同じ処理を行っています。
つまり、このプラグインの音量指定はスマホには無効です。
たわしそふとさんの要望の対象箇所は、
編集作業を行っている端末のブラウザで表示したときに
どのように見えるかをプレビューする領域ですので、テーマやプラグインでここに手を加えるのはちょっと違うかなと思います。
もし変えてしまうと、実際には音量調整ができるのに、編集画面ではできないように見える、
ということになってしまいます。音量調整しても毎回最大音量に戻るのがブラウザの仕様、
ということを受け入れるしかないように思います。
（もしかしたら、そうじゃないブラウザがあるかもしれません）ちなみに、タブレット端末で編集画面を開くと、
音量調整ができないように見えます（ブラウザの動作と同じ）。先ほどの回答に補足、というか訂正です。
私が提示した JavaScript のコードは PC のブラウザには有効ですが、
モバイルデバイスのブラウザには無効でした。ということで、音源のボリュームを下げるのが確実です。
X’MASイブ、楽しませてもらった🤣ので、お礼に回答を…😊
> これはパターンの仕様なのでしょうか？
最大音量に戻るのはブラウザの仕様ですね、たぶん。
BGM として使っているので音源のボリュームを下げておくべきですが、
カスタム HTML ブロックを追加して以下のコードを貼り付ければ、音量設定をコントロールできます。<script> window.addEventListener('DOMContentLoaded', function(){ const audioElement = document.querySelector('audio'); audioElement.volume = 0.2; }); </script>0.2 のところに 0（消音）～1（最大音量）を指定します。
同じバージョンの私のサイトでは現象が再現しません。
本来の動作から大きくかけ離れた症状が起きているので、
ご質問の文面だけだといい回答が得られないかもしれません。設定画面のスクリーンショットなどを使って状況を伝えていただくか、
可能であれば、症状が起きている URL を提示していただけば、
回答が得られやすいと思います。> この挙動はテーマ側の仕様でしょうか？
違います。
余白に関しては、該当URLのサイトで行ったカスタマイズが原因です。
具体的には、子テーマに記述してある以下のコードが原因です。@media (min-width: 768px) { .map-padding { padding-top: 20px; padding-bottom: 20px; /* 左右の見た目差を補正 */ padding-left: 18px; padding-right: 20px; box-sizing: border-box; } }> フッターウィジェット内で左右の高さを揃える正しい実装方法があれば
左のカバーブロックに
height: 100%;を指定すればよさそうです。
