うなこ
フォーラムへの返信
-
投稿者投稿
-
うなこモデレーターお世話になっております。
VK Blocks Pro をご利用いただきありがとうございます。「グリッグカラムアイテムを追加」の「+」マークが枠からはみ出しているとのことですが、こちらの環境(添付のスクリーンショット)では、同様の現象を確認できませんでした。ブラウザが Google Chrome とありますが、一部の拡張機能が影響する可能性も考えられます。別のブラウザでは同様の症状が確認できますか。
念のため、VK Blocks Pro のバージョンが最新(1.95.0.3)かご確認いただけますでしょうか?
また、お手数をおかけしますが、該当箇所のスクリーンショットを共有していただけますでしょうか。
引き続き、よろしくお願いいたします。
Attachments:
You must be logged in to view attached files.2025年2月12日 10:06 AM 返信先: 「PR バナー カラムメニューフィット_工務店」がWordPressバージョンアップしたらカバーの透明度やホバー時のアニメーションが機能しなくなりました #106303
うなこモデレーターお世話になっております。
カラムブロックの「カスタム CSS」設定が消えているように見えました。
消えてしまった原因は現時点では不明ですが、もし同様のご経験がある方がいらっしゃいましたら情報を共有いただけますと幸いです。以下の手順で設定をご確認いただき、必要に応じて CSS を追加していただけますでしょうか?
1. 該当のページを開き、「カラムブロック」を選択してください。
2. 右側の設定パネルで「カスタム CSS」欄を確認してください。(添付画像参照)
3. 以下の CSS が入っているかご確認ください。もし何も入っていない場合は、以下の CSS を「カスタム CSS」欄にコピーして貼り付けてください。
/* フィットカラム hover時のエフェクト */ selector .vk_button{ position:relative; } selector .vk_button:not(.vkp_button-through-arrow)::before{/*背景スライドボタンは除外しないとおかしくなる*/ position: absolute; top: 0; right: 0; bottom: 0; left: 0; content: ''; background: #000; opacity:0.4; transition: all 0.5s ease-out; z-index:-1; } selector .vk_button:hover::before { opacity: 0; transition: all 0.5s ease-out; } selector.vk-cols--fit--gap1.wp-block-columns { gap: 0px; } selector .wp-block-cover{ overflow:hidden; } selector .wp-block-cover .wp-block-cover__image-background{ transition: all 0.4s ease-out; } selector .wp-block-cover:hover .wp-block-cover__image-background{ transform: scale(1.08); transition: transform 0.2s linear; } selector.alignfull .wp-block-cover__inner-container{/*スマホサイズで隙間ができるので追加*/ max-width:100vw; }
もしくは以下のパターンをコピーしていただき、カラムブロックの「カスタムCSS」をコピーして、該当のページのカラムブロックの「カスタムCSS」部分に貼り直してください。
上記の手順をお試しいただき、改善されるかご確認いただけますでしょうか?
Attachments:
You must be logged in to view attached files.
うなこモデレーターことりさんのおっしゃる通り、CSSを書く際にはスマホサイズの対応も考慮する必要がありますね。まずは基本的なCSSを理解するところから始めると良いかもしれません。
▼ベクトレ できる!CSSカスタマイズ
https://training.vektor-inc.co.jp/courses/wordpress-customize/lessons/css-customize/もしノーコードで組みたい場合は、Lightningのデフォルトのフッターではなく「ブロックテンプレートパーツ機能」を使うのがスムーズかと思います。
▼ブロックテンプレートパーツ機能
https://lightning.vektor-inc.co.jp/lightning-g3-pro-unit/block-template-parts/VKブロックパターンライブラリから、理想に近いフッターのパターンをコピーして貼り付ければ、簡単にカスタマイズできるのではないでしょうか?
例えば、こちらのパターンはいかがでしょうか?
カラムブロックで、ロゴのある左側が33%、コンタクト部分の右側が66%になっています。
https://patterns.vektor-inc.co.jp/vk-patterns/20924/
うなこモデレーターHANAさま
いつもお世話になっております。
テーブルブロックで、デフォルトで「水平方向スクロール」がオンになるので、オフにするが保存してもオンに戻ってしまう。
ご質問の件ですが、私の環境では該当の症状が再現できませんでした。
編集画面で「水平方向スクロール」をオフに戻しても、再びオンになってしまう状況でしょうか?
また、もしフロント画面(実際のウェブサイトの表示部分)でのみスクロールが有効になっている場合は、キャッシュプラグインが影響している可能性が考えられます。この場合、キャッシュのクリアをお試しいただけますでしょうか。また、同様の症状が発生しているユーザー様がいらっしゃいましたら、フォーラムにご投稿いただけますと幸いです。
うなこモデレーターMATSUMURANAOTOさま
石川の回答の追記になりますが、添付画像の画面は、管理画面の【Lightning Block Template Parts】から該当のヘッダー用ページを開くと編集できます。
うなこモデレーター少し気になる箇所がありまして、
まったく見当違いのことを言っていましたらすみません。「パンくずリストが『ホーム / チラシ / エディオン1月号チラシ』となっているのに対し、記事の URL が『未分類』になっている点が気になります。
以下の手順でご確認ください
【01】投稿一覧画面を開く
・管理画面の「投稿」 > 「投稿一覧」を開きます
・該当の投稿の行にマウスを合わせ、「クイック編集」リンクをクリックしてください。(添付画像参照)【02】カテゴリーを確認
・「カテゴリー」の項目に「チラシ」にチェックが入っているかご確認ください。
・「未分類」にもチェックが入っている場合は、「未分類」のチェックを外してください。【03】保存する
必要な修正を行ったら「更新」ボタンを押して保存してください。もし「カテゴリー」に「チラシ」が正しく設定されている場合は、
管理画面の「設定」 > 「パーマリンク設定」で、特に何も変更せずに、そのまま「変更を保存」ボタンを押してください。Attachments:
You must be logged in to view attached files.
うなこモデレーターお世話になっております。
このたびは Vektor Passport をご購入いただき、誠にありがとうございます。VK Blocks Proを使いたいため昨日Vektor Passportを購入し新しいライセンスキーを
外観→カスタマイズ→Lightningライセンスキーに入力しましたご連絡いただきありがとうございます。
VK Blocks Pro をご利用いただく場合は、Lightning のライセンス認証とは別に、
VK Blocks Pro にもそれぞれライセンス認証が必要となります。お手数をおかけいたしますが、管理画面の 設定 > VK Blocks Pro にライセンスキーが入力されているかご確認いただけますでしょうか。
もし入力がされていない場合は、ライセンスキーをご入力いただきますようお願いいたします。また、以下のリンク先にライセンスに関するページをご用意しておりますので、併せてご参照くださいませ。
何かご不明な点やお困りのことがございましたら、どうぞお気軽にお問い合わせください。
うなこモデレーターWithさま
お世話になっております。画像を拝見いたしました。左側の「横三本線」をクリックしないと反映されませんでした。
「横三本線」は親の「リスト」ブロックを選択するためのもので、その中に「リスト項目」が含まれています。親の「リスト」ブロックを選択することで、「スタイル」を設定できる仕組みとなっております。
(ちなみに、SWELLテーマではリスト項目の右側設定画面に「親のリストブロックを選択」ボタンがあるようです)VK Blocksのリストブロックにつきましても、「親のリストブロックを選択」ボタンをリスト項目の設定画面に追加するか検討いたしましたが、現在では多くのユーザー様がブロックエディターの操作に慣れてきていることや、ツールバーの親選択ボタンで十分対応可能と判断し、実装には至っておりません。
また、リストブロックのコピーができなくなる件につきましては、ことりさまのご返信内容をご確認いただき、もし解決されているようでしたら、ことりさまをベストアンサーに選んでいただけますと幸いです。
今後ともどうぞよろしくお願いいたします。
Attachments:
You must be logged in to view attached files.
うなこモデレーターカクさま
UTF-8で保存し直した style.css のファイルは、サーバーにも再アップロードしていただけていますでしょうか。
ご確認よろしくお願いいたします。
うなこモデレーターお世話になっております。
子テーマの style.css ですが、ファイルのエンコーディング(文字コード)が UTF-8 で保存していないのが原因の可能性もあります。
子テーマの style.css をエディタで開き、ファイルが UTF-8 エンコーディングで保存されているかの確認をお願いいたします。
VS Codeで確認する場合は、画面右下のエンコーディング表示部分で確認できます。
VSCでの文字コード変換方法よろしくお願いいたします。
うなこモデレーターことりさんの回答の補足です。
コードを貼る時は、右上にある三点リーダーのオプションをクリックし、
エディタをコードエディターにチェックをしてください。(添付画像一枚目参照)
コードを貼り終えましたらコードエディターを終了するとブロックの確認ができます。(添付画像二枚目参照)もし解決されましたら、ことりさんにベストアンサーをお願いいたします
Attachments:
You must be logged in to view attached files.
うなこモデレーターお世話になっております。
ひとつの提案になります。
カードブロックではなく、グリッドカラムカードブロックを利用して、
「グリッドカラムカードブロック」の設定の「カラムヘッダーメディアエリア」は「非表示」にして、
「グリッドカラムカードアイテムボディ」 内のタイトルブロックの上にカバーブロックを配置するのはいかがでしょうか。
カバーブロックでしたら背景画像の上にタイトルや段落を配置できますので、ご希望の形に近いのではないかと思いましたがいかがでしょうか。Attachments:
You must be logged in to view attached files.
うなこモデレーターお世話になっております。パターンライブラリのご利用ありがとうございます。
該当サイトを確認しましたところ、「VK Blocks Pro」プラグインがインストールされていないようでした。
※「保育園・幼稚園_年間行事とギャラリー」は「 VK Blocks Pro 」を使用しております「VK Blocks」は無料版のプラグインとなりますので、恐れ入りますが、「VK Blocks Pro」をインストールいただき、有効化していただけますようお願いいたします。
VWSのサイトへログインしていただき、マイアカウント > ダウンロード からダウンロードできます。( vk-blocks-pro.zip のボタンをクリックしてください。)
Lightning の Pro機能のプラグイン Lightning G3 Pro Unit もインストールがまだでしたら、同様にダウンロードしてください。( lightning-g3-pro-unit.zip のボタンをクリックしてください。)
どうぞよろしくお願いいたします。
うなこモデレーター参考サイトを確認いたしました。
Lightning テーマの Lightning G3 Pro Unit プラグインの場合は、ヘッダー設定のヘッダー透過機能で設定としてあるのですが、X-T9 テーマの場合はCSSでカスタマイズしていただくことになります。
position: absolute;
で調整されてモバイルでうまくいかなかったとのことですが、以下のCSSでいかがでしょうか。header{ position: absolute; z-index: 10; left: 0; width: 100%; }
うなこモデレーターお世話になっております。
ご質問ありがとうございます。
文章だけですと、どうしても認識に違いが出てしまう可能性がございます。もし可能でしたら、画面キャプチャをとっていただき、「ここをこうしたい」といった内容をキャプチャ画像に書き込んでいただけると、回答がしやすくなるかと思います。
また、参考になるサイトのURLを添付していただけると、さらに状況を把握しやすくなります。
ご記載いただいた内容を確認したところ、以下のようなイメージでしょうか?
-
投稿者投稿