wordpress - カテゴリの投稿とタイトルを別のループで表示する方法

Question

私は 1 つのスライダー タブを作成しています。そのためのプラグインがたくさんあることは知っていますが、プラグインを使用したくありません。だから私は自分のカテゴリの投稿のタイトルと投稿を以下のhtml形式のように表示したいのですが、できません。私は私の方法を試しましたが、タイトルではなくコンテンツループのみです。怒鳴るようなhtmlを作ることができれば、タブは機能します。どうすればそれができますか。

    <ul class="tabs">
    <li><a href="#content_1" rel="tab_1" class="tab active_tab">Tabs 1</a></li>
    <li><a href="#content_2" rel="tab_2" class="tab">Tabs 2</a></li>
    <li><a href="#content_3" rel="tab_3" class="tab">Tabs 3</a></li>
    <li><a href="#content_4" rel="tab_4" class="tab">Tabs 4</a></li>
    <li><a href="#content_5" rel="tab_5" class="tab">Tabs 5</a></li>
    </ul>

so here under li (tabs) put post title 




<div id="content_1" class="tab_view first_tab">
                    <h2>Tab #1</h2>
                        <p>Lorem ipsum dolor sit amet, duis netus ut posuere feugiat arcu, purus wisi quis fringilla at, nunc ut eget elit duis erat praesent, ut fermentum lacus turpis cras. Justo gravida erat quam mauris purus, aliquam quisque, eget nisl. Pellentesque nibh duis odio morbi quam, scelerisque convallis aenean quam tincidunt ornare nam nec feugiat sodales tristique.</p>                         
                </div>

<div id="content_1" class="tab_view first_tab">
                    <h2>Horizontal Tab #1</h2>
                        <p>Lorem ipsum dolor sit amet, duis netus ut posuere feugiat arcu, purus wisi quis fringilla at, nunc ut eget elit duis erat praesent, ut fermentum lacus turpis cras. Justo gravida erat quam mauris purus, aliquam quisque, eget nisl. Pellentesque nibh duis odio morbi quam, scelerisque convallis aenean quam tincidunt ornare nam nec feugiat sodales tristique.</p>                         
                </div>
<div id="content_1" class="tab_view first_tab">
                    <h2>Horizontal Tab #1</h2>
                        <p>Lorem ipsum dolor sit amet, duis netus ut posuere feugiat arcu, purus wisi quis fringilla at, nunc ut eget elit duis erat praesent, ut fermentum lacus turpis cras. Justo gravida erat quam mauris purus, aliquam quisque, eget nisl. Pellentesque nibh duis odio morbi quam, scelerisque convallis aenean quam tincidunt ornare nam nec feugiat sodales tristique.</p>                         
                </div>
<div id="content_1" class="tab_view first_tab">
                    <h2>Horizontal Tab #1</h2>
                        <p>Lorem ipsum dolor sit amet, duis netus ut posuere feugiat arcu, purus wisi quis fringilla at, nunc ut eget elit duis erat praesent, ut fermentum lacus turpis cras. Justo gravida erat quam mauris purus, aliquam quisque, eget nisl. Pellentesque nibh duis odio morbi quam, scelerisque convallis aenean quam tincidunt ornare nam nec feugiat sodales tristique.</p>                         
                </div><div id="content_1" class="tab_view first_tab">
                    <h2>Horizontal Tab #1</h2>
                        <p>Lorem ipsum dolor sit amet, duis netus ut posuere feugiat arcu, purus wisi quis fringilla at, nunc ut eget elit duis erat praesent, ut fermentum lacus turpis cras. Justo gravida erat quam mauris purus, aliquam quisque, eget nisl. Pellentesque nibh duis odio morbi quam, scelerisque convallis aenean quam tincidunt ornare nam nec feugiat sodales tristique.</p>                         
                </div>

href="#content_1" rel="tab_1"この #content_ (1,2,3,4,5)should autoをよく見てください。同様の <div id="content_1"このコンテンツ_も番号が自動で投稿番号を意味します