うなこ
フォーラムへの返信
-
投稿者投稿
-
うなこモデレーター1)VK BLOCKS の PR Content ですが、左右が等幅だと思うのですが、左右の幅を自由に調整できないでしょうか。
追加CSSや子テーマのcssに以下を追加するといかがでしょうか。
全部のPRコンテンツに反映されますので、もし個別で指定したい場合は高度な設定項目に追加 CSS クラスを追加して調整してみて下さい。@media (min-width: 576px){ .vk_prContent .vk_prContent_colImg{ width: 30%; max-width: 30%; flex:auto; } .vk_prContent .vk_prContent_colTxt{ width:70%; max-width: 70%; flex:auto; } }
2)画像を設置した際、そのままのサイズで表示されるようで、PR Contensの画像が上のコンテンツと重なって、結構使いづらいです。
こちらの現象はわたしの環境では見られませんでした。
VK Blocks Proは最新バージョンですか?
そのままページを表示するとはみ出しますか?Attachments:
You must be logged in to view attached files.
うなこモデレーター
うなこモデレーター
うなこモデレーターご連絡ありがとうございます。
なるほど、なんとなくわかった気がします。
カスタマイズ → Lightning デザイン設定 → 見出しデザイン に設定した見出しデザインが
固定ページに反映されていないということでいいでしょうか。
(管理画面上ではなく、実際の表側のページをみると見出しデザインが変わっていませんか)
カスタマイズのLightning デザイン設定から設定する見出しデザインはページ全体の見出しデザインとなります。添付していただいた写真の、固定ページから「見出しブロック」で見出しのスタイルを変更すると、そちらが優先して上書きされますので… 例えば「装飾無し」にすると装飾が無くなるはずです。
もし、カスタマイズ → Lightning デザイン設定 の見出しデザインにしたい場合は、
固定ページの「見出しブロック」の見出しスタイルは何もしなくても反映されるはずです。
もし、見出しスタイルを選択してしまった場合は一度、添付画像の「ブロックスタイル変更」から「段落」ブロックに変更し、そのあと「見出し」ブロックに戻してください。いかがでしょうか。
(質問の意図が違っていましたら教えください。)Attachments:
You must be logged in to view attached files.
うなこモデレーターこんにちは。 少し確認したいことがあります。
固定ページの方で、見出しを「標準」「装飾無し」双方で試してみたのですが、反映されません。
とありますが、固定ページで使用している見出しブロックはサブテキスト付きの「VK Blocks」の見出しをご利用でしょうか?
それとも通常のGutenbergの見出しブロックでしょうか?あと、追加CSSや子テーマでカスタマイズなどされていますか?
うなこモデレーター添付画像拝見しました。
グローバルメニューを左寄せにするより、ロゴとメニューを中央寄せにする方がバランスが良い気がします。
下のcssはロゴとグローバルナビを中央寄せにするcssとなります。
いかがでしょうか
もし左寄せが良い場合はまた教えてください。※1200px以上のサイズで適応されます。
@media (min-width: 1200px){ .navbar-header { float: none; text-align: center; } .navbar-brand { text-align: center; float: none; } .gMenu_outer { float: none; width: 100%; } ul.gMenu { float: none; position: relative; left: 50%; display: inline-block; text-align: center; -webkit-transform: translate(-50%, 0); transform: translate(-50%, 0); } }
うなこモデレーター応急処置としまして、
追加CSSに以下のCSSを追加するといかがでしょうか?
それでもはみ出す場合はまた教えてください。.vkvu_wrap.move_auto_reduce video { width:100vw; } @media (max-width: 1024px){ .vkvu_wrap.move_auto_reduce video { width:100vw; } }
うなこモデレーターPaleⅡはヘッダー、ヘッダー上部(最上部)ともメインの背景色と同じ色が以前からの仕様
ということでよろしいですか?Paleの説明ページを確認したところ、以前から同じ色の仕様だったと思います。
もし.headerTopの背景色を薄いグレーに変更する場合は追加CSSや子テーマのcssに以下を追記で変更できると思います。
半透明の設定はお好みで変更してください。@media (min-width: 992px){ .headerTop { background: rgba(0,0,0,.06); } }
うなこモデレーター左に寄せるのはプラグイン Invisible reCAPTCHA for WordPressで設定しているようです。
管理画面の設定→Invisible reCaptcha Settingsから添付画像の「Badge Position」を「Bottom Left」で左によると思います。プラグインの設定の仕方はご案内したページか、もしくは「Invisible reCAPTCHA for WordPress 設定」などで検索していただければ出てくるかなと思います。
-
この返信は4年、 11ヶ月前に
うなこが編集しました。
Attachments:
You must be logged in to view attached files.
うなこモデレーターこちらに詳しく載っておりました。
プラグインInvisible reCAPTCHAを使ってreCAPTCHA v3のバッジを邪魔にならずに表示させる方法もしくは「Invisible reCAPTCHA for WordPress 設定」などで検索してみて下さい。
うなこモデレーターテスト用サイトを確認しました。
カスタマイズ→「Lightningのモバイル固定ナビ」の「メニュー開閉ボタンの追加」にチェックが入っていますので、
下に固定されて出てくるメニューの中にハンバーガーメニューが含まれている状態です。もしヘッダーのロゴの右側にハンバーガーメニューを表示させたいのであれば
「メニュー開閉ボタンの追加」のチェックを外してみて下さい。あとは念のため、Lightning Proのテーマも最新版に更新してください。
いかがでしょうか。【追記】
ちなみにこのスレッドの最初のコメントに添付していただいたサイトの方で試してみるといかがでしょうか。(!important を付けた方をご使用ください。)Attachments:
You must be logged in to view attached files.
うなこモデレーターleft: inherit の後ろに「!important」をつけるとどうでしょうか。
【css解説】「!important」がついているプロパティが最優先して使用されます.vk-mobile-nav-menu-btn { right: 5px; left: inherit !important; }
-
この返信は4年、 11ヶ月前に
うなこが編集しました。
うなこモデレーター確認したところスマホサイズでボタンの上にsvgが乗ってしまっているのが原因のようでした。
区切りの設定のカーブを0で無効にすれば押せるようになりますが、
デザインが変わってしまうので、お急ぎでしたら追加cssなどに以下のcssを追加してみて下さい。※Outerブロック内のsvgファイルがクリックできなくなります。
SVGファイルでクリックするようなものがありましたら、ご注意ください。いかがでしょうか?
.vk_outer_separator svg{ pointer-events: none; }
-
この返信は4年、 11ヶ月前に
うなこが編集しました。
うなこモデレーター全く同じではないのですが、、似たようなレイアウトにするには
表示タイプを「メディア」にしてカラムを全て「1」に設定すれば一番近いかもしれません。LTG Media Postsと比べるとサムネイル画像とタイトルがやや大きくなりますので、
以下のcssで必要に応じて調整してみて下さい。
数値などはお好みの大きさに調整してください、いかがでしょうか?.mainSection .vk_post.media { padding: 1rem 0; } @media (min-width: 768px){ .mainSection .vk_post.media .media-img { width: 24%; } } .mainSection .vk_post.media .vk_post_title { font-size: 1em; } .mainSection .vk_post.media.vk_post-col-lg-12.media { padding: 1rem 0; }
-
この返信は4年、 11ヶ月前に
うなこが編集しました。
-
この返信は4年、 11ヶ月前に
-
投稿者投稿