【Wordpres】Safariでアンカーリンクがずれるし、勝手に付く

WordPressでページを作成して、アンカーリンクをつけた際に、Safariのみで動作がおかしくなってしまいました。

前提として、アンカーリンクを含んだ複数のリンクをメニューとして並べておりました。

具体的に、どんな動作かというと、

• アンカーリンクのリンクをクリックすると、クリックしたリンクではないリンクをクリックした事になっている。（ソースは合っている、クリックするとURLのアンカーリンクも別のリンクになっている）
• アンカーリンク無しのページへアクセスするリンクをクリックすると、アンカーリンクがついている

訳が分からない文章になってしまいますが、とにかくクリックしたアンカーリンクとは別のアンカーに飛ぶ、という感じです。

ちなみに他のブラウザでは正しく動作しています。

原因と解決方法

どうやらSafariでアンカーリンクをつける場合は、スラッシュ（/）の後ろにシャープ（#）とならなければいけないようです。

//NG
<a href="https://example.jp/example-page#link">アンカーリンク</a>

//OK
<a href="https://example.jp/example-page/#link">アンカーリンク</a>

ちなみに、これはいけます↓

//OK
<a href="#link">アンカーリンク</a>

WordPressのhome_urlを使っている場合も、後ろにスラッシュを入れてあげます。

//NG
<a href="<?php echo home_url('example-page');?>#link">アンカーリンク</a>
//もしくは
<a href="<?php echo home_url('example-page#link');?>">アンカーリンク</a>

//OK
<a href="<?php echo home_url('example-page/');?>#link">アンカーリンク</a>
//もしくは
<a href="<?php echo home_url('example-page/#link');?>">アンカーリンク</a>