静的ページにWordPressの特定のカテゴリーとブログのリンク付き見出しを表示する手順

①表示したいカテゴリ―のページを開きます。
表示されたURLを確認してください。

②カテゴリ―のURLが日本語だったら、URLを英語に変更します。（英語だった場合はこの手順は飛ばしてください）
ブログの管理画面＞投稿＞カテゴリ―　で変更したい表示したいカテゴリ―の「スラッグ」を英語に変更してください。※今回は「お知らせ ⇒ news」に変更しました。

③WordPressの記事を表示したいHTMLに見出しを読みこむJSの記述を追加します。
下記を参考に、記述を追加してください。
※お知らせのJS読み込みがある場合には同じ箇所に入れてください。

例：

<script type="text/javascript">
$(function(){
$(".blog_load_tit").load("/blog/ .blog_tit");
$(".news_load").load("/blog/category/news/ .news_information");
})
</script>

$(function(){

$(".blog_load_tit").load("/blog/ .blog_tit");

$(".news_load").load("/blog/category/news/ .news_information");

})

</script>

記述の解説は以下となります。

この場合「.news_load の部分に　/blog/category/news/　のディレクトリの　.news_information のクラス名の記述を表示する」ということです。
※ディレクトリの指定はルートパスにしてください。

今回はこんな感じで入れました。ブログ一覧とお知らせ一覧のタイトル（.blog_tit）を引っ張ってきます。

<script type="text/javascript">
$(function(){
$(".blog_title_load").load("/blog/ .blog_tit a"); 
$(".news_title_load").load("/blog/category/news/ .blog_tit a");
})
</script>

$(function(){

$(".blog_title_load").load("/blog/ .blog_tit a");

$(".news_title_load").load("/blog/category/news/ .blog_tit a");

})

</script>

④HTMLにブログを表示させる箇所の記述を追加します。

例：

<ul class="top_news_box">
<li>
<h3 class="tit01"><img src="images/tit_top_news.svg" alt="お知らせ" width="154" height="34"/><span><img src="images/tit_top_news_02.svg" alt="お知らせ" width="154"></span></h3>
<div class="news_title_load scroll_area"></div>
<div class="top_news_bnr"><a href="/blog/category/news/"><img src="images/top_news_bnr.png" alt="お知らせ一覧" width="295" height="75"/></a></div>
</li>
<li>
<h3 class="tit01"><img src="images/tit_top_news03.svg" alt="ブログ" width="154" height="34"/><span><img src="images/tit_top_news_04.svg" alt="ブログ" width="154"></span></h3>
<div class="blog_title_load scroll_area"></div>
<div class="top_news_bnr"><a href="/blog/"><img src="images/top_news_bnr02.png" alt="ブログ一覧" width="295" height="75"/></a></div>
</li>
</ul>

<li>

</li>

<li>

</li>

</ul>

⑤CSSを調整したら完成です！

※今回の作業を行ったサイト　https://koujiya-kodomo.com/