SWELLで目次からのリンク先のズレを修正する方法を紹介
人気のWORDPRESSテーマのSWELL使っていて、目次からのH2やH3へのリンクがスムーススクロール後にズレた位置に移動してしまい、何度か同じリンクを押すと目的の見出しに到達するという現象が起きました。
それを解決できたので方法を書き記しておきます。
本記事の目次
リンク先がズレた記事
リンク先がズレた記事は外注のライターさんに書いてもらった記事がほとんどで、画像をgoogleドキュメントに貼り付けられたもの納品してもらい、それをコピペで記事に貼り付けて投稿したページでした。
これは、画像をメディアに登録せずに記事に貼り付けているという状況です。
こちらの記事を見ると、メディアライブラリに入れずに投稿した画像は高さと幅がimgタグに書かれていないので、lazyloadをした際に数値を取得できないということがかいてありました。
lazyloadをオフにすれば解決するとこの記事では書かれていましたが、私の場合はそれだけでは解決できませんでした。
解決した方法
まずはlazyloadをオフ。
そして、画像圧縮系プラグインを無効化しました。
- Autoptimize
- EWWW Image Optimizer
- WP-Optimize
この3つをオフにしました。
その結果、リンク先が正常に作動するようになりました。
ですが、これでは画像圧縮ができないのでサイト速度は遅くなってしまうと思われます。
参考になればと思います。