ある質問マイページログインSWELLユーザー限定の新会員サイトです。参加するフォーラムトピックを立てる前にチェック「フォーラムガイドライン」に必ず目を通してください。「SWELL設定」>「リセット」からキャッシュクリアを先にお試しください。フォーラム内検索で過去に同じようなトピックがないか検索してみてください。ConsoleでCLSの値が0.1を超え、警告を受けるようになってきました。Adsenseの広告がCLSに大きく影響することは経験上分かっていた為、予め広告スペースの高さを指定して動かないようにしており、記事ページなどは問題ありませんが、トップページのみ「フルワイド」ブロックを利用している影響か、CLSの値が高くなっております。参考までに当該URLのページ上部の「フルワイド」ブロックは"サイト幅"で利用しております。下記の動画はChromeのデベロッパーツールで読み込み時の動きを撮影したものですが、読み込み時に「フルワイド」ブロックの横幅が"記事幅"から"サイト幅"に拡大されることがCLSに悪影響を及ぼしているものと考えております。ヘッダーと「フルワイド」ブロックの間に表示させているAdsenseの広告を削除すると、「フルワイド」ブロックが最上部に表示されるようになり、横幅のズレがより目立つようになり、CLSの値も悪化するといった状態です。この動きに対応する方法はあるのでしょうか。Googleで検索しても同じような報告例はなく、お力を頂きたく投稿させて頂きました。メインビジュアルを追加し、「フルワイド」ブロックを読み込み時に表示されない位置まで下げれば改善されることは予想出来ますが、出来ればメインビジュアル無しでいければと考えております。1125SWELL高速化顧問SWELLのみ、他の影響を一切受けない状態で再現できたので検証中です。SWELLフォーラムはユーザーフォーラムのため、開発者以外の回答は全て任意です。当アカウントによる回答もボランティアのため、ヒントの提供に留まる場合があります。starterskillsharejp様コメント有難う御座います。検証頂けるとのこと助かります。ある程度の作業は自分でも出来ますので、また何か良い方法が御座いましたら続報頂けますと幸いです。1125SWELL高速化顧問あくまでフルワイドブロックのみを再現したページでしか検証していませんが、下記CSSでCLSはWPT及びPSIのラボデータにおいて0になりました。100vw;}https://pagespeed.web.dev/analysis/https-depressed-dolphin-upglq-instawp-xyz-sample-page/hxu1rm50i0?form_factor=desktop(WPT結果URLはwpforoが勝手にwebpと判断する謎の症状を確認したため削除しました。skillsharejpSWELLフォーラムはユーザーフォーラムのため、開発者以外の回答は全て任意です。当アカウントによる回答もボランティアのため、ヒントの提供に留まる場合があります。starter早速、CSSに適用させて頂きましたが、CLSが0になりました。有難う御座います!本当に助かりました。Consoleの様子を見てみます。1125SWELL高速化顧問ご報告いただくまで気が付かなかったので助かりました。SWELLフォーラムはユーザーフォーラムのため、開発者以外の回答は全て任意です。当アカウントによる回答もボランティアのため、ヒントの提供に留まる場合があります。61メンバー@skillsharejpありがとうございます。以前トピックを立てさせていただいた中の余談で「フルワイドが読み込みの際に収縮する問題」が解決しました。https://users.swell-theme.com/forum/swell-forum/%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e3%83%ad%e3%82%b4%e3%82%84%e3%82%b3%e3%83%b3%e3%83%86%e3%83%b3%e3%83%84%e3%83%98%e3%83%83%e3%83%80%e3%83%bc%e3%81%8c%e3%83%81%e3%83%a9%e3%81%a4%e3%81%8f%e5%95%8f/理屈がちょっと分からないのですが、こちらは基本的に記述しておいた方が良いという解釈でしょうか。テーマ側で対策いただけるならありがたいですね。141メンバーこちらの記述を追加したところ、サイドバー有りのページでは、デザインが崩れました。もとからあるCSSにtransformを追加し、leftの値と同じ数値をマイナスで指定することで対応できました。利用している環境で変更箇所は変わるかもしれませんが、修正の方法はそのまま流用できますね。ありがとうございます。@windorzこちらの記述を追加したところ、サイドバー有りのページでは、デザインが崩れました。ご提案ありがとうございます。フルワイドブロックをサイドバーありの状態で使うというのをあまり想定していませんが、実際にどういったページでしょうか?TwitterかDiscordでDMでも構いませんので確認できるURLをご連絡いただけないでしょうか?SWELLフォーラムはユーザーフォーラムのため、開発者以外の回答は全て任意です。当アカウントによる回答もボランティアのため、ヒントの提供に留まる場合があります。使い方としては少しおかしいかもしれません。CTAをブログパーツで作成し投稿(サイドバー有り)の最後でウィジェットから呼び出しています。ブログパーツは、フルワイドブロックを使って作成しています。投稿の時はブログパーツを呼び出してもフルワイドはならないので、固定ページと投稿で共通で使っています。確かに、サイドバー有りでも背景色やデザインを取り入れたい場合などにフルワイドブロックを利用するかもしれませんね。試しに軽く検証してみましたが、サイドバーありの場合はwidthを%で指定してあるためか、CLSに問題はありませんでした。(サイドバーをなしに戻すとCLSは悪化するため対策は必要)よって、サイドバーなしの時のフルワイドの対策できれば良いかと思いますので、以下のコードで良いかもしれません。参考までに、私の環境で起きたことをまとめておきます。このスレッドにあったCSSを追記したところ、フルワイドを使っていたブログパーツが左側に飛び出してしまいました。100vw;}transfromを打ち消せばよかったので、translateX(-16px)ではなくtranslateX(0)でよかったです。61メンバー@windorz「コンテンツの背景を白にする」をオンにした場合、以下の数値に変更されるため、デザインが崩れてしまいます。96px);}上書きされるよりは、サイドバーがない時(.-sidebar-offを追加)にのみ適用させた方が安全かもしれません。141メンバー@hisそうですね。無理にすべてに適用するよりも、サイドバー無しの時だけ適用する方が良さそうですね。ありがとうございます。Adminフルワイドブロックの横幅がちらつくという現象、未だに僕の方では確認できずでして、原因がよく分からずにいます。SWELL開発者です。Adminvw単位はwindowsのスクロールバーが考慮されないため、本来は変数を使ってるのですが...。🤔SWELL開発者です。61メンバー@loos_ryoなんとなく解決策が分かったかもしれません。0)としてみましたが、こちらは改善せずでした。0px)と単位をつけると改善できました。0px));としたところ、改善できていました。根本的な原因は不明ですが、単位が重要な気がします。0px));}このようleftプロパティとtransformプロパティを当てないと、右半分にズレた状態から思いっきりレイアウトシフトを起こすので単純にpxだけを追加すれば良いというような感じではありませんでした。61メンバーあ、alingnfullのleftプロパティの0が当たっている影響ですね。どちらも単位をつけるとCLSもチラつきも改善しました。Adminあー!すみません原因がわかりました!と思ったらhisさんも書いてくださってました...!cssのlintで単位消されてたっぽいです...おっしゃるとおり、calcなので0には単位必須ですねSWELL開発者です。😫SWELL開発者です。画像クリック時の二重表示対策に関して。ありがとうございます。これを知りたかったです。管理画面の投稿一覧のアイキャッチ列に変な表示が出るコードを見ると、2つのif文が両方trueの時以外は"-"が表示されるようです。管理画面の投稿一覧のアイキャッチ列に変な表示が出るはじめまして。SWELLを買ってなかなか快適に運営できております。>追従ウィジェットに目次を入れれば消えると思います。SWELLERS'.閉じる。