カテゴリー一覧表示などがページの中央や下部にある場合ページャで次のページへ飛んだ際
ページのトップが表示されいちいち一覧のあるコンテンツなでスクロールする必要があり
面倒なのでその場で切り替わっているような動きをさせたい。
今思いつくのはiframeで一覧PHPファイルを読み込んで表示させれば良いのではないかということ。
下記の手順で実現ができました。
■新規（ヘッダー、フッター無し）テンプレートページを作成
page.phpを複製してテンプレートの準備
記事表示部分は残してget_header();とget_footer();を削除
get_footer();直前の<?phpも削除でよいかと。
上部に
<?php
/*
Template Name: メリット実績一覧（分かれば名前は何でもOK）
*/
?>
※固定ページ作成時に「メリット実績一覧」テンプレートが選択できるようになる。
注意
テーマフォルダ内に「style.css」「index.php」が無いとテンプレートプルダウンが
表示されない。
その下に現サイトHTMLソースからヘッダー部分をコピペする
<!doctype html>～<body>まで。
下部に
</body>
</html>
を追加
■新規固定ページで一覧だけ表示する
ショートコード記述
[myphp file=’sc_merit_articles’]
とだけ書けばＯＫ
■表示させたい箇所にiframe を記述
<iframe id=”iframeParentID” src=”/merit_area” width=”100%” scrolling=”no”></iframe>
・javascriptでiframeの高さ自動調整
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js”></script>
<script type=”text/javascript”>
$(“document”).ready(function(){
$(‘iframe’).load(function(){
if (typeof $(this).attr(‘height’) == ‘undefined’) {
//iframe先ページの高さを設定
$(this).height(this.contentWindow.document.documentElement.scrollHeight+10);
}
});
//iframe先ページロード中にも対応
$(‘iframe’).triggerHandler(‘load’);
});
</script>