takumizer
@takumizer

Are you sure you want to delete the question?

Leaving a resolved question undeleted may help others!

アンカーリンクが複数設定されたページで、別ページ記事への遷移がうまくいかない件

Wordpressを使って、サイトを作成しています。
その中で、新着情報を表示する欄があり、それぞれにwordpressの投稿IDをアンカーにして
別ページで作った新着情報一覧個別ページの該当記事を表示したいと思っています。

仮に、新着情報1についてIDが#10、新着情報2についてIDが#20とした場合、
それぞれのリンクをクリックすると
⚫︎chrome
 新着情報1のリンクURL : https://hoge.com/info#10
新着情報2のリンクURL : https://hoge.com/info#20
ときちんとリンクが出し分けられて、該当の記事に遷移して表示されるのですが、
Safariの場合、最初に押したリンクのURLがそのまま引きずられて
2回目以降も必ず最初に押した記事にリンクします。

例えば、Safariで最初に新着情報1のリンクを押した場合、
その後はずっと https://hoge.com/info#10のリンクで遷移しようとして、
新着情報2を押しても、新着情報1の個別記事の方にリンクします。

Safariの履歴を消すと、1回目はきちんと選んだ方にリンクが飛ぶのですが、
その後はまた同じことの繰り返しです。(キャッシュが残っているのでしょうか)
これはSafariのバグでしょうか。

ちなみに該当部分のソースは以下のとおり。

$paged, 'post_type' => 'info' , 'order' => 'DESC', 'post_status' => 'publish', 'posts_per_page' => 5, 'orderby' => 'date', ) ); if( $info ->have_posts() ):?> have_posts() ) : $info ->the_post(); ?>
<div class="article">
	<p class="updatedate"><?php the_time("Y/n/j"); ?></p>
<a href="<?php echo esc_url(home_url("/info")); ?>#<?php the_ID() ; ?>" target="_blank">
  <p class="infotitle"><?php the_title(); ?></p>
</a>
</div>

どなたか解消法等教えていただけますと幸いです。

よろしくお願いします。

0

1Answer

#の前にスラッシュをひとつ入れて、https://hoge.com/info/#10のようにすると直ると思います。
https://hoge.com/info#10をクリックした後、ブラウザのアドレスバーを見るとhttps://hoge.com/info/#10となっているはずです。
これが正しいURLの形式であるため、ブラウザが補完する形でこのようになっているのだと思いますが、Safariは対応しきれていないのではないでしょうか。
そういう意味ではSafariのバグと言えなくもないですが、そもそもURLとして正しくないのでSafariのせいとは言えないですね。

1Like

Comments

  1. @takumizer

    Questioner

    @halo1kw
    早速の回答ありがとうございました。
    ご指摘のとおり対応し、正常に動作するようになりました。
    大変助かりました。

    結構ネットだと「/」なしで書いてあるものが多かったので、鵜呑みにしておりましたが、自分の知識・確認不足を痛感いたしました。
    Safariにもお詫びしないといけないですね。^^;

    ますます精進努力しようと思います。
    本当にありがとうございます。

  2. 解決してよかったです!
    どういったものを参照されたかわからないので想像ですが、/なしのものはhttps://example.com/info/index.html#anchorのような形式ではなかったでしょうか。この場合はファイル名の下にアンカーが来るため/は必要ありません。
    infoディレクトリを表示する際index.htmlは省略可能であるため、https://example.com/info/#anchorと書くことができます。
    WPのパーマリンクであってもこのルールは変わらないので、今後もし末尾に.html等をつけるパーマリンク形式を使う場合には/が必要ないこともありえる、ということは覚えておいて損はないかなと思います。

  3. @takumizer

    Questioner

    @halo1kw
    追加情報をありがとうございます。
    覚えておくように理ます。
    今後ともよろしくお願いいたします。

Your answer might help someone💌