SWELLで目次からのリンク先のズレを修正する方法を紹介

\ お買い物忘れにご注意!/

人気のWORDPRESSテーマのSWELL使っていて、目次からのH2やH3へのリンクがスムーススクロール後にズレた位置に移動してしまい、何度か同じリンクを押すと目的の見出しに到達するという現象が起きました。

それを解決できたので方法を書き記しておきます。

目次

\ お買い物忘れにご注意!/

リンク先がズレた記事

リンク先がズレた記事は外注のライターさんに書いてもらった記事がほとんどで、画像をgoogleドキュメントに貼り付けられたもの納品してもらい、それをコピペで記事に貼り付けて投稿したページでした。

これは、画像をメディアに登録せずに記事に貼り付けているという状況です。

https://u.swell-theme.com/community/swell-forum/%E3%80%90swell%E3%81%A7%E3%81%AF%E3%83%9A%E3%83%BC%E3%82%B8%E5%86%85%E3%82%B8%E3%83%A3%E3%83%B3%E3%83%97%E3%81%A7%E3%82%B9%E3%83%A0%E3%83%BC%E3%82%BA%E3%82%B9%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%AB/

こちらの記事を見ると、メディアライブラリに入れずに投稿した画像は高さと幅がimgタグに書かれていないので、lazyloadをした際に数値を取得できないということがかいてありました。

lazyloadをオフにすれば解決するとこの記事では書かれていましたが、私の場合はそれだけでは解決できませんでした。

解決した方法

まずはlazyloadをオフ。

そして、画像圧縮系プラグインを無効化しました。

  • Autoptimize
  • EWWW Image Optimizer
  • WP-Optimize

この3つをオフにしました。

その結果、リンク先が正常に作動するようになりました。

ですが、これでは画像圧縮ができないのでサイト速度は遅くなってしまうと思われます。

参考になればと思います。

参考になったらシェアお願いします!

この記事を書いた人

■自己紹介
MEDIARCS ディレクター 河島 靖
1984年5月生まれの39歳

■趣味
銭湯・サウナ行くこと(サウナ・スパ健康アドバイザー)
筋トレ(懸垂をよりできるようになりたい)
音楽鑑賞(Nujabes、NewJeansなど)
ヴィンテージもの、レザーグッズが好き

コメントはこちらよりお願いします

コメントする

目次