Discordコミュニティを作りました! 参加する

フォーラム

トピックを立てる前にチェック
  1. フォーラムガイドライン」に必ず目を通してください。
  2. バージョンアップデート後に表示がおかしくなった場合は、
    「SWELL設定」>「リセット」からキャッシュクリアを先にお試しください。
  3. フォーラム内検索で過去に同じようなトピックがないか検索してみてください。
タブブロックにブログパーツを配置でレイ...
 
通知
すべてクリア

[解決済] タブブロックにブログパーツを配置でレイアウト崩れ

5 投稿
2 ユーザー
1 Likes
794 表示
tuboi
(@tuboi)
投稿: 3
メンバー
Topic starter
 

タブブロックに、ブログパーツを読み込んだ際に、ブログパーツ内のリッチカラムのレイアウトがくずれてしまう。

タブブロックではなく、そのままブログパーツを読み込んだ場合は正常に表示されます。

対処方法ございますでしょうか。

確認項目
利用規約に同意します*, ガイドラインを読み、内容を把握しています*, よくある質問を先にチェック済みです*, 過去に同じようなトピックがないか検索済みです*, WordPress更新後、SWELLは最新版にしましたか?, Googleなどでも検索してみました
問題が確認できるページのURL
利用中のSWELL本体のバージョン
2.7.9
OS
windows
利用中のWordPressバージョン
6.3.1
利用中のサーバー会社
サクラサーバー
ブラウザ
edge
利用中のプラグイン一覧

BBQ Firewall
Duplicate Page
EditorsKit
Envira GFallery
Organize Media Folder
SEO SINPLE PACK
WP Multibyte Patch
WPForms Lite
XNL Sitemap & Google News

 
投稿済 : 05/10/2023 11:24 am
サブロ
(@windorz)
投稿: 125
メンバー
 

SWELLの高速化設定に『必要なCSSのみ読み込む』という項目があります。
『必要なCSSのみ読み込む』にチェックが入っていると、ブログパーツに必要なCSSが読み込まれないことがあります。
『必要なCSSのみ読み込む』はOFFにします。

 
投稿済 : 05/10/2023 2:28 pm
tuboi
(@tuboi)
投稿: 3
メンバー
Topic starter
 

@windorz 様 情報ありがとうございます。

設定確認してみましたが、『必要なCSSのみ読み込む』にはチェックが入っていませんでした。

 

 
投稿済 : 05/10/2023 4:22 pm
サブロ
(@windorz)
投稿: 125
メンバー
 

 

みたところ、tabブロックの場合は以下のようなclass構造になっています。

.c-tabBody__item

 .swell-block-columns

  .swell-block-columns

   .p-blogParts post_content

    .swell-block-columns

 

一方、正常に表示されるtabブロック外の状態は、

.p-blogParts post_content

 .swell-block-columns

となっています。

 

タブブロック内部で、.swell-block-columnsがネストしており、うまく動いてないように見えます。

 

タブブロック内部の.swell-block-columnsのネストをやめればうまく動くと思います。

念のため、リストビューで構造をご確認ください。

2023 10 05 16h38 41

 

 
投稿済 : 05/10/2023 11:31 pm
tuboi
(@tuboi)
投稿: 3
メンバー
Topic starter
 

@windorz

助言いただき、解決いたしました!

とても単純なミスですが自分ではわからず感謝いたします。

ありがとうございました。

 
投稿済 : 06/10/2023 9:13 am
サブロ reacted
共有: