【WordPress / JavaScript】前後の記事に移動した時、指定の位置にスクロールする

WordPressのサイトで、「前の記事へ、次の記事へのリンクをクリックした時に、画面がページトップに戻るのがヤダ。」というご意見がありました。

新しいページを読み込んだら通常はページの先頭が表示されますが、ヘッダーメニューの部分を手動でスクロールして記事まで下りてくるのが面倒だから、移動したらすぐに記事が読めるようにしてほしいというのですね。
何だか珍しいご要望ですが、実現できたので。

結論から。
[header.php]（headタグ内）

<?php if(is_single()): ?>
<script>
$(function() {
  if (document.referrer.length !=0 ){
  var myRef = document.referrer;
  if ( myRef.indexOf( "<?php echo home_url(); ?>" ) == 0 &&
       myRef.indexOf( ".html" ) >= 0 ){
    var p = $(".PostArea").offset().top;
    $('html,body').animate({ scrollTop: p }, 'slow');
    return false;
    }
  }
});
</script>
<?php endif; ?>

最初は、こちらの記事を参考に
■リンク先ページの指定位置にスクロールで移動
■JS：アンカーリンクを使わず指定位置までスクロール

<?php if(is_single()): ?>
<script>
$(function() {
    var p = $(".PostArea").offset().top;
    $('html,body').animate({ scrollTop: p }, 'slow');
    return false;
});
</script>
<?php endif; ?>

とだけ書いていて、カスタム投稿の分も含めて記事の個別ページについては、アクセスしたら任意の場所（ここでは.PostAreaと名付けた記事エリアの先頭部分）に移動していました。

ただこれでは、前後の記事へのリンクからだけでなく、記事の一覧ページからアクセスした場合も、アドレスバーに直接URLを入れてアクセスした場合も、みんなその場所にスクロールしていってしまいます。
そうなるのは前後の記事へのリンクからだけでいいので、ここではリンク元を判定できないかと考えました。

■イヌでもわかるJavaScript講座 – リファラ(referrer) – Oit-net

こちらでやさしく解説されていました。イヌ程度の知識の私でも本当に分かった。。（感動
ほぼ解説どおりなのですが、ポイントは

if ( myRef.indexOf( "<?php echo home_url(); ?>" ) == 0 &&
myRef.indexOf( ".html" ) >= 0 )

でしょうか。

<?php if(is_single()): ?>

ここで、記事の個別ページを判定

if (document.referrer.length !=0 )

ここで、ブラウザやお気に入りからのアクセスでないことを判定

ここまでで、アドレスバーから直接アクセスしてきた場合については処理をはじくことができています。

あとは、一覧ページからの移動でなく、記事ページからの移動のみに限りたい。

今回はプラグイン「Custom Post Type Permalinks」を使って、記事の個別ページのURLは「記事ID.html」の形にしていました。
トップページや一覧ページは、拡張子が付かず「/（スラッシュ）」で終わっています。

なのでこれを利用して、indexOfの検索文字列を「.html」としてみました。

これだけだと、他のサイトのhtmlファイルからリンクされた時にも効いてしまうので、&& で自サイトからのリンクという条件<?php echo home_url(); ?>を並列にしています。

これでできたよ！！