Wordpressのリンクとコンテンツ

Question

私はwordpressのメニューを作成していますが、私がpermalinkをクリックしても内容は変わりません。そして私の2番目のドロップダウンはeatherでは動作しません。問題は、コンテンツが表示されないようにする必要がある私のセクションにあることです。コンテンツは最後のメッセージを受け取るだけで、メニューで選択した投稿ではありません。

https://i.gyazo.com/1698056c27baa40768659d2edab5e3d9.png これは、他の投稿をクリックしてもそのまま残ります。

<?php 
    get_header(); 
    ?> 
    <div class="menu"> 

    <div> 
     <a href="<?php echo home_url(); ?>"><h1>Documentatie</h1></a> 
    </div> 


     <?php $cats = get_categories(); 

     foreach ($cats as $cat) { 
     $cat_id= $cat->term_id; 
     echo "<div class='dropdown'>"; 
     echo "<button onclick='myFunction()' class='dropbtn'>".$cat->name."</button>"; 
     echo "<div id='myDropdown' class='dropdown-content'>"; 

     query_posts("cat=$cat_id&post_per_page=100"); 

    if (have_posts()) : while (have_posts()) : the_post(); ?> 

    <button class="dropbutton"><h2><a href="<?php the_permalink();?>"><?php the_title(); ?></a></h2></button> 

    <?php endwhile; 
?> 
</div> 
</div> 
<?php 
    else : 
    echo "<p>Geen content gevonden</p>"; 
    endif; 
    wp_reset_postdata(); 
} 
?> 
</div> 
    <div class="content"> 
    <h2><?php the_title(); ?></h2> 
    <div class="wpcontent"><?php the_content(); ?> </div> 
</div> 
<?php wp_footer(); ?> 
<script> 
/* When the user clicks on the button, 
toggle between hiding and showing the dropdown content */ 
function myFunction() { 
    document.getElementById("myDropdown").classList.toggle("show"); 
} 

// Close the dropdown if the user clicks outside of it 
window.onclick = function(event) { 
    if (!event.target.matches('.dropbtn')) { 

    var dropdowns = document.getElementsByClassName("dropdown-content"); 
    var i; 
    for (i = 0; i < dropdowns.length; i++) { 
     var openDropdown = dropdowns[i]; 
     if (openDropdown.classList.contains('show')) { 
     openDropdown.classList.remove('show'); 
     } 
    } 
    } 
} 
</script> 

Answer 1

は私の他の2つのコメントと、以下の提案されたソリューションを見てください、これはあなたが直面しているWPの問題ではありません、それは

echo "<div class='dropdown'>"; 
    echo "<button onclick='myFunction(" . $cat->slug . ")' class='dropbtn btn-" . $cat->slug . "'>".$cat->name."</button>"; 
    echo "<div id='myDropdown' class='dropdown-content'>"; 

そしてJS/jQueryの

です：

function myFunction(cat_slug) { 
    $('.btn-' + cat_slug).show(); 
} 

試してみてください。