[ 解決済 ] VK blockの投稿一覧の背景をカスタマイズしたい

VWSとは フォーラム Lightning [ 解決済 ] VK blockの投稿一覧の背景をカスタマイズしたい

[ 解決済 ] VK blockの投稿一覧の背景をカスタマイズしたい

4件の投稿を表示中 - 1 - 4件目 (全4件中)
  • 投稿者
    投稿
  • #70794

    勇太吉川
    参加者

    ■ WordPress のバージョン
    6.0.2

    ■ テーマ・プラグインは全て最新版で確認してください。
    確認しました。

    ■ テーマの種類
    Lightning ( G3 ) + Lightning G3 Pro Unit

    ■ テーマのバージョン
    14.23.4

    ■ Pro Unit のバージョン
    0.23.2

    ■ スキンの種類
    Origin III

    ■ 関連しそうなプラグインを一つづつ停止して症状が改善するか確認してください。
    確認しました。

    ■ 期待する動作
    VK blocksの投稿一覧を使用した上で、その周辺の背景を自由にカスタマイズしたい

    うしろに
    現状 (画像1) と
    仕上げたい状態 (画像2)
    を添付しています。

    ■ 自分で試した事
    1. WordPressの「固定ページ編集」から「コードエディター」上で、<!– wp:vk-blocks/post-list {“name”:”vk-blocks/post-list”} /–>を<div class=”xxx”> </div>で囲み、style.cssで背景を装飾できないか試してみた
    →結果、コードエディター上では<div>で囲めない

    2.「固定ページ編集」の「ビジュアルエディタ」上で、「追加CSSクラス」でクラスを追加し、style.cssで背景のカスタマイズを試みた
    →結果、vk postsの範囲のみCSSが効き、bodyの範囲ではbackground-colorは効かなかった(添付画像①)

    ■ 症状が発生するブラウザ
    Chrome

    ■ 実際の症状
    [自分で試した事]に記した内容と同様です。

    ■ その他特記事項
    functions.phpとstyle.cssを使い、全て自分でコーディングする場所はカスタマイズできています。

    ただ、vk blocksを利用した箇所だと、背景をどうカスタマイズしていいか、わからない状態です。

    お手数をおかけしますが、どうぞよろしくお願い致します。

    Attachments:
    You must be logged in to view attached files.
    #70805

    DRILL LANCER
    モデレーター

    ただ単に囲むだけなら VK Blocks Pro が用意している「Outer」ブロックを使うか、
    WordPress 本体が用意している「Cover」ブロックを使うことで可能です。

    スタイルの調整は各ブロックの設定画面の「高度な設定」の「追加 CSS クラス」に CSS のクラス名を追加して
    そのクラス名に対してスタイリングするのが良いでしょう。

    #70810

    うなこ
    モデレーター

    DRILL LANCERさんのご案内しているOuterブロックはこちらになります。

    Outer(Pro版のみ)

    Outerブロック、もしくはカバーブロックかグループブロックを全幅サイズで配置して、中に投稿リストを入れたら実現できるかなと思います。

    • この返信は1年、 4ヶ月前にうなこが編集しました。
    #70883

    勇太吉川
    参加者

    DRILL LANCER様
    うなこ様

    こんばんは!
    返事が遅くなり申し訳ありません(体調不良で3日寝込んでいました)。
    アドバイスに頂いた通り、VK Blocks Proのouterを使用し、追加CSSクラスでクラス名を追加して、スタイルを加えたところ、期待していたカタチにすることができました。

    ご親切にアドバイスを頂き、本当にありがとうございました!
    Lightningの使い方が少しずつわかってきました。

    吉川

4件の投稿を表示中 - 1 - 4件目 (全4件中)
  • このトピックに返信するにはログインが必要です。