うなこ
フォーラムへの返信
-
投稿
-
Aki_Tさま
お世話になっております。ご利用ありがとうございます。
アンドロイドのスマートフォンで昨日まで開いていた右上メニューが開かなくなった。
アンドロイドのスマホで右上のハンバーガーメニューが開かなくなったとのことで、確認したいことがございます。
こちらのデモサイトの右上のハンバーガーメニューは、アンドロイドのスマートフォンで開きますでしょうか
一度ご確認お願いいたします。どうぞよろしくおねがいいたします。
添付動画を確認しました。ありがとうございます。
実際にわたしのiOS17.5.1のiphoneで操作してみたところ、たしかにキーボードで段落ブロックが隠れることはありますが、スワイプすることで、段落を編集することができました。スワイプができなくなるとのことですので、もしかするとフリーズしているのかとも思いました。iPhoneを再起動しても同じでしょうか？
ーーーー
また、コミュニティの皆様でこの件についての解決方法をお持ちの方がいらっしゃいましたら、ぜひご投稿をお願いいたします。
ベストアンサーをいただいた方には、VWSで利用可能な500ポイントが付与されます。nakazawa2106さま
お世話になっております。Lightningのご利用ありがとうございます。新規投稿時は問題ないのですが、画像ブロックなどを追加して画面が半分以上埋まってくると、段落ブロックを追加してテキストを入力しようとするとキーボードが入力結果が確認できない状態になります。上部にスワイプしようとしてもできません。
MP4ファイルをアップしていただいたようですが、ファイルサイズが大きいようでエラーになっており確認できませんでした。
firestorage や おくりん坊 などのファイル転送サービスにmp4ファイルをアップしていただき、URLをフォーラムの投稿ページに添付していただくか、iPhoneで操作時の画面キャプチャなどを撮っていただき、添付していただけますと、より具体的なアドバイスがつきやすくなります。Lightning固有の問題では無いようで以下のようなCSSの追加を進められるのですが
またLightning固有の問題でない場合、WordPress のユーザーが助け合う WordPress.org 公式フォーラムでの質問の方が回答がつきやすいかもしれません。
https://ja.wordpress.org/support/forums/
どうぞよろしくお願いいたします。
jkwebさま
添付画像ありがとうございます、画像を見る限りでは操作は合っているように思います。
数字を入れた後に、「Enter」キーを押すと、数値が入ったりしませんか？どうでしょうか。もしそれでも余白が入らないようでしたら、以下のパターンを用意しましたので、お手数ですが、こちらをコピペして、作り直していただくのが早いかもしれません。
どうぞよろしくお願いいたします。
編集ロックを解除してしまうと、おそらくですが別々の色に設定した背景色などが解除されてしまうと思われますので、
お手数ですが、編集モードは「このカラムのみ」で編集ロックをかけたまま、グリッドカラムカードアイテムを選択して、カラムの余白を設定すると数値が適応されると思いますがいかがでしょうか。jkwebさま
Lightningのご利用ありがとうございます。
WordPressの子カラムの角丸の設定はできないようでしたので、CSSで調整していただくか、もしくは VK Blocks Pro のグリッドカラムカードブロックを使用していただくのはいかがでしょうか。グリッドカラムカードブロックの、グリッドカラムカードアイテムを選択して「編集ロック」をオンにしますと、それぞれカラムごとに背景色を変えたりできます。
カラムの角丸の大きさも設定できます。いかがでしょうか。
Peaceさま
お世話になっております、X-T9のご利用ありがとうございます。
VK Dynamic If Blockで実現できないか試そうとしましたが、ナビゲーションの下位階層で選択できるブロックに表示されません。
ナビゲーションブロックの後にVK Dynamic If Block を挿入するのはいかがでしょうか。
もし見当違いのことをいっていたらすみません。可能でしたら画面キャプチャなどで、どこにどのようなブロックを設置したいなど、具体的な指示など書いていただけましたら、返信がつきやすくなります。
どうぞよろしくおねがいいたします。
idfさま
お世話になっております、VK パターンライブラリのご利用ありがとうございます。こちらのパターンのカラムブロックの写真が交互になっているデザインは、「VK Block Patterns」プラグインで実装していますので、プラグインをインストールして有効化してください。
もしくは、VK Blocks 1.73.0 で WordPress 標準のカラムブロックに逆向き設定が追加されましたので、そちらをご利用ください。
【ご利用のテーマにつきまして】
Lightning Pro をご利用とのことですが、もし Vektor Passportをご購入されたと言うことでしたら、Lightning Proテーマは旧製品となりますので、もしこれから新規でサイトを制作すると言うことでしたら、LightningテーマとLightning G3 Pro Unit プラグイン（Lightning のPro機能）を推奨しております。一度ご確認くださいませ。どうぞ宜しくおねがいいたします。
—-
【Lightning G3 Pro Unit ランディングページの作成】
こちらはLightning と Lightning G3 Pro Unit でのランディングページの設定方法です。
よろしければご参考にしてください。gundam さま
おはようございます、いつもお世話になっております。
グリッドカラムでも、同じようにスマホの場合は真ん中が幅広くなってしまいます。
グリッドカラムブロックは「カラム間の余白」が設定できませんので、「グリッドカラムカードブロック」を使用するのはいかがでしょうか。
グリッドカラムカードブロックでしたら、「カラムの余白」が設定できます。(余白は共通になりますので、デバイスごとには設定できません)いかがでしょうか、一度ご確認お願いいたします。
よろしくお願いいたします。前嶋美佐子さま
お世話になっております。
ロゴ左側の余白等はCSSなどで調整するということになりますでしょうか（SP用ロゴは画像で配置しました）。
また、ロゴを中心に配置する場合もCSSで調整することになりますでしょうか。【余白の件】
余白の件ですが、モバイル用のヘッダーの内側の余白は、一番外側の親のブロックを選択して（添付画像参照：添付画像の場合は“ヘッダー_モバイル用”という名前のグループブロック）右側のブロックの設定画面から、サイズの「パディング」から設定可能です。【モバイルでのロゴ中央の件】
ロゴを中心にする件ですが、ロゴを中央でナビゲーションを右寄せというイメージであっておりますか？
もしそうでしたら、こちらのパターン「ヘッダー サイトロゴメニュー中央 / ナビゲーション」がイメージに近いと思います。現状ですと横並びブロックでロゴとナビゲーションを横並びにしています。横並びブロックですと、ロゴだけ中央寄せにはできないため（配置からロゴとナビゲーションを中央寄せにはできます）、“ヘッダー_モバイル用”のグループブロック部分を、上記のパターン「ヘッダー サイトロゴメニュー中央 / ナビゲーション」の“ヘッダー_モバイル用”のグループブロックと差し替えるか、該当箇所を参考にして調整してみてください。
前嶋美佐子さま
Block Template Partsにてモバイル用メニューを追加しましたが、PCで表示されてしまうのとSPのメニューバーは表示されるようになりましたが、位置・動作が正しいのか不安がございます。
「保育園・幼稚園02_トップページ」のパターンの、モバイル用のヘッダーの設置方法です。
- ［添付画像1枚目参照］ モバイル用のナビゲーションメニューが設置し終わりましたら、編集画面の「ナビゲーション」ブロックを選択して、右側のブロックの設定画面の「オーバーレイメニュー」を「常時」に変更します。
- ［添付画像2枚目参照］ 次に、モバイル用のヘッダーの一番親のブロック（添付画像では“ヘッダー_モバイル用”という名前のグループブロック）を選択して、右側のグループブロックの設定画面の下の方にある「非表示設定」をクリックで展開して、「画面サイズ : md 、 画面サイズ : lg、画面サイズ : xl、画面サイズ : xxl 」をONにします。そうしますと画面サイズがsm と xsサイズのみで表示されるようになります。
添付いただきました該当URLを確認しましたところ、モバイル用のヘッダーがうまく設置できていないようですので、
ブロックの構成などは、添付画像の2枚目を参考にしながら、設置してみてください。もしくは、適当に固定ページを新規で作って、「保育園・幼稚園02_トップページ」をコピペして、“ヘッダー_モバイル用”のグループブロックを参考にしてください。
いかがでしょうか？
不明な点などございましたらご連絡ください。前嶋美佐子さま
お世話になっております、VK Pattern Libraryのご利用ありがとうございます。
「保育園・幼稚園02_トップページ」のパターンの、PCとタブレットサイズ用のヘッダーナビ部分は、カラムブロックとVK Blocks のボタンブロックを組み合わせて作っています。モバイルのサイズではコアのナビゲーションブロックを使用しています。
※理由としましては、コアのナビゲーションブロックは現時点（2024年5月現在）では、ラベルにHTMLが入力できないため、ラベルにFontAwesomeのタグが挿入できませんでしたので、このような作りにしています。上記の作りのため、モバイルサイズでのナビゲーションブロックは、添付画像のように「新しいメニューを作成しますか」をクリックして新規で新しいメニューを作成する必要があります。
右のナビゲーションブロック設定画面の「新しいメニューを作成しますか」をクリックしますと、添付画像2枚目のように、「＋」ボタンがでてきますので、ここからメニューを設定していきます。
一度、上記のマニュアルを見ながら、設定をしてみてください。
もしわからない箇所がございましたらお知らせください。
よろしくお願いいたします。
gundamさま
調整いたしまして、一旦は以下のCSSでいかがでしょうか。
/* レイアウト：カード */ /* 767.98以下 */ @media (max-width: 767.98px){ .vk_posts.vk_posts-layout-card { justify-content: space-between; margin-left: 0; margin-right: 0; } .vk_post.card.vk_post-col-xs-6.vk_post-col-sm-6 { width: calc(50% - 7px); margin-left: 0px; margin-right: 0px; margin-bottom:14px; } }CSSにつきましては、こちらがわかりやすいかと思いますので、もしよろしければご確認ください。
よろしくお願いいたします🙇
