• Resolved kuronishi

    (@kuronishi)


    Lightningのバージョン15以降から幅広設定を行っても幅広になりません。
    ご確認いただけると幸いです。

    【設定方法】
    1)固定ページを開く
    2)カラムを追加
    3)カラムを選択し幅広に設定する。

Viewing 12 replies - 1 through 12 (of 12 total)
  • Theme Author Hidekazu Ishikawa

    (@kurudrive)

    ご報告ありがとうございます。
    https://github.com/vektor-inc/lightning/issues/939

    Theme Author Hidekazu Ishikawa

    (@kurudrive)

    @kuronishi

    確認しましたが私の環境では症状が発生しませんでした。

    ページのレイアウト自体をサイドバー有りの2カラムにしていませんか?
    サイドバー有りの場合は幅広にするとサイドバーと被って崩れるため、幅広・全幅は反映されないようにしています。

    もしくは該当URLを貼っていただけば直接確認します。

    Thread Starter kuronishi

    (@kuronishi)

    ご確認ありがとうございます。
    サイトは連絡できないのですが状況を確認したところ以下の状態でした。

    1)レイアウト設定は1カラム

    2)画面に出力されているタグは以下の通り(カラムの幅広設定)
    <div class=”is-layout-flex wp-container-2 wp-block-columns alignwide”>
    <div class=”is-layout-flow wp-block-column”>

    3)上記の「wp-block-column」に以下のスタイル設定が適用されている。
    ※「–vk-width-container」が「1140px」のため、幅広に設定しても「1140px」になる。

    .alignfull:where(:not(.alignfull):not(.alignwide):not(.wp-block-cover__background):not(.wp-block-cover__image-background):not(.vk_outer):not(.swiper-wrapper):not(.swiper-pagination)), .alignfull>div[class*=vk_]:where(:not(.alignfull):not(.alignwide):not(.wp-block-cover__background):not(.wp-block-cover__image-background):not(.vk_outer):not(.swiper-wrapper):not(.swiper-pagination)), .alignfull>div[class*=wp-block-]:where(:not(.alignfull):not(.alignwide):not(.wp-block-cover__background):not(.wp-block-cover__image-background):not(.vk_outer):not(.swiper-wrapper):not(.swiper-pagination)), .alignfull>div[class*=wp-container-]:where(:not(.alignfull):not(.alignwide):not(.wp-block-cover__background):not(.wp-block-cover__image-background):not(.vk_outer):not(.swiper-wrapper):not(.swiper-pagination)), .alignwide:where(:not(.alignfull):not(.alignwide):not(.wp-block-cover__background):not(.wp-block-cover__image-background):not(.vk_outer):not(.swiper-wrapper):not(.swiper-pagination)), .alignwide>div[class*=vk_]:where(:not(.alignfull):not(.alignwide):not(.wp-block-cover__background):not(.wp-block-cover__image-background):not(.vk_outer):not(.swiper-wrapper):not(.swiper-pagination)), .alignwide>div[class*=wp-block-]:where(:not(.alignfull):not(.alignwide):not(.wp-block-cover__background):not(.wp-block-cover__image-background):not(.vk_outer):not(.swiper-wrapper):not(.swiper-pagination)), .alignwide>div[class*=wp-container-]:where(:not(.alignfull):not(.alignwide):not(.wp-block-cover__background):not(.wp-block-cover__image-background):not(.vk_outer):not(.swiper-wrapper):not(.swiper-pagination)) {
    max-width: calc(var(–vk-width-container) – var(–vk-width-container-padding) * 2);
    margin-left: auto;
    margin-right: auto;
    }`

    わたしの環境でも問題なかったです。

    Lightning G3 Pro Unit は使用していますか?
    もし使用しているのであれば、「セクションベース設定」を「セクションベースあり」にしているのかも?と思いお聞きしました。

    Thread Starter kuronishi

    (@kuronishi)

    ご確認ありがとうございます。
    「Lightning G3 Pro Unit」は利用していないです。
    環境固有の問題の可能性が高そうですね。。。

    ひとまず、以下の設定を行うことにより改善しましたのでご報告いたします。
    固定ページのコードエディタで「wp-block-column」に「alignwide」を追加

    【変更前】
    <!– wp:columns {“align”:”wide”} –>
    <div class=”wp-block-columns alignwide”><!– wp:column –>
    <div class=”wp-block-column”>

    【変更後】
    <!– wp:columns {“align”:”wide”} –>
    <div class=”wp-block-columns alignwide”><!– wp:column {“className”:”alignwide”} –>
    <div class=”wp-block-column alignwide”>

    ご返信ありがとうございます

    そうなのですね、、なんでしょうね、、、

    ・他のブロック(例えば画像など)の幅広は効きますか?

    ・不具合をおこしている原因がプラグインの可能性もありますが、キャッシュ系のプラグインなど使ってたりしますか?

    ・Lightningのバージョンは最新でしょうか(今現在は15.1.2)

    Thread Starter kuronishi

    (@kuronishi)

    確認事項について、回答いたします。

    ・他のブロック(例えば画像など)の幅広は効きますか?
     ⇒画像で試したところ問題なく幅広になりました。

    ・不具合をおこしている原因がプラグインの可能性もありますが、キャッシュ系のプラグインなど使ってたりしますか?
     ⇒キャッシュ系のプラグインは利用していないです。

    ・Lightningのバージョンは最新でしょうか
     ⇒Lightningバージョンは最新です。(15.1.4)

    Theme Author Hidekazu Ishikawa

    (@kurudrive)

    効かない部分のブロックのコードは貼れますか?

    例えば以下のコードは僕の環境では幅広で反映されます。

    <!-- wp:columns {"align":"wide"} -->
    <div class="wp-block-columns alignwide"><!-- wp:column -->
    <div class="wp-block-column"><!-- wp:paragraph -->
    <p>あああああああああああああああああああああああああああああああ</p>
    <!-- /wp:paragraph --></div>
    <!-- /wp:column -->
    
    <!-- wp:column -->
    <div class="wp-block-column"><!-- wp:paragraph -->
    <p>いいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいいい</p>
    <!-- /wp:paragraph --></div>
    <!-- /wp:column --></div>
    <!-- /wp:columns -->
    Theme Author Hidekazu Ishikawa

    (@kurudrive)

    https://github.com/vektor-inc/lightning/issues/939

    問題が発生するコードをこちらに貼っていただければ改めて検証させていただきます。

    Theme Author Hidekazu Ishikawa

    (@kurudrive)

    @kuronishi こちら解決済みでしょうか?

    Thread Starter kuronishi

    (@kuronishi)

    幅指定の問題についてバージョン「15.2.1」に更新することで解決しましたのでご報告いたします。
    よろしくお願いいたします。

    Theme Author Hidekazu Ishikawa

    (@kurudrive)

    返信ありがとうございます。

    解決済にステータス変更します。

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘幅広設定が機能しない’ is closed to new replies.