title: Wordpress post categories Ajax URL structure
body: <p>I have a basic wordpress blog that has categories and when the categories are clicked the posts filter. This works great but I ideally want when the category is clicked the URL to change to</p>
  
  <pre><code>http://site.preview/resources/CATEGORYNAME
  </code></pre>
  
  <p>currently the blog loads as <code>http://site.preview/resources/</code> and when a category is clicked it changes to <code>http://site.preview/resources/#</code></p>
  
  <p>Hope I explained this properly. Please find my code below.</p>
  
  <p><strong>Home.php - blog</strong></p>
  
  <pre><code>&lt;?php get_header('home'); ?&gt;
  &lt;div class="banner"&gt;
      &lt;div class="in"&gt;
          &lt;img src="&lt;?php echo get_stylesheet_directory_uri() . '/assets/images/blue-cover-with-illustrations.png' ?&gt;"&gt;
          &lt;div class="banner__content"&gt;
              &lt;div class="in"&gt;
                  &lt;h1&gt;The Good Air Resources Center&lt;/h1&gt;
                  &lt;h2&gt;Knowledge to figure out indoor air quality. Tips to breathe cleaner air&lt;/h2&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;section class="blog"&gt;
      &lt;div class="in"&gt;
          &lt;?php
          $categories = get_categories(); ?&gt;
              &lt;div class="categories"&gt;
                  &lt;div class="in"&gt;
                      &lt;h5&gt;Categories&lt;/h5&gt;
                      &lt;ul id="category-menu"&gt;
                          &lt;?php foreach ( $categories as $cat ) { ?&gt;
                          &lt;li id="cat-&lt;?php echo $cat-&gt;term_id; ?&gt;"&gt;
                              &lt;a class="&lt;?php echo $cat-&gt;slug; ?&gt; ajax" onclick="cat_ajax_get('&lt;?php echo $cat-&gt;term_id; ?&gt;');" href="#"&gt;
                                  &lt;?php echo $cat-&gt;name; ?&gt;
                              &lt;/a&gt;
                          &lt;/li&gt;
                          &lt;?php } ?&gt;
                      &lt;/ul&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="posts"&gt;
                  &lt;div class="in"&gt;
                      &lt;?php
                      $args = array(
                          'post_type' =&gt; 'post',
                          'orderby' =&gt; 'publish_date'
                      );
                      $post_query = new WP_Query($args);
                      if($post_query-&gt;have_posts() ) {
                      while($post_query-&gt;have_posts() ) {
                      $post_query-&gt;the_post();
                      ?&gt;
                          &lt;div class="post"&gt;
                              &lt;div class="in"&gt;
                                  &lt;div class="post__image"&gt;
                                      &lt;?php the_post_thumbnail(); ?&gt;
                                  &lt;/div&gt;
                                  &lt;div class="post__title"&gt;
                                      &lt;h4&gt;
                                          &lt;a href="&lt;?php the_permalink(); ?&gt;"&gt;
                                              &lt;?php the_title(); ?&gt;
                                          &lt;/a&gt;
                                      &lt;/h4&gt;
                                  &lt;/div&gt;
                                  &lt;div class="post__content"&gt;
                                      &lt;?php the_excerpt(); ?&gt;
                                  &lt;/div&gt;
                                  &lt;div class="post__readmore"&gt;
                                      &lt;a href="&lt;?php the_permalink(); ?&gt;" class="btn btn--brand btn--block"&gt;Read More &gt;&lt;/a&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                          &lt;?php } } ?&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div id="loading-animation" style="display: none;"&gt;
                  &lt;img src="&lt;?php echo admin_url ( 'images/loading-publish.gif' ); ?&gt;" /&gt;
              &lt;/div&gt;
      &lt;/div&gt;
  &lt;/section&gt;
  &lt;script&gt;
      function cat_ajax_get(catID) {
          jQuery("a.ajax").removeClass("current");
          jQuery("a.ajax").addClass("current");
          jQuery("#loading-animation-2").show();
          var ajaxurl = '/wp-admin/admin-ajax.php';
          jQuery.ajax({
              type: 'POST',
              url: ajaxurl,
              data: {
                  "action": "load-filter",
                  cat: catID
              },
              success: function (response) {
                  jQuery(".posts .in").html(response);
                  jQuery("#loading-animation").hide();
                  return false;
              }
          });
      }
  &lt;/script&gt;
  &lt;/article&gt;
  &lt;?php get_footer('home'); ?&gt;
  </code></pre>
  
  <p><strong>Functions.php</strong></p>
  
  <pre><code>add_action( 'wp_ajax_nopriv_load-filter', 'prefix_load_cat_posts' );
  add_action( 'wp_ajax_load-filter', 'prefix_load_cat_posts' );
  function prefix_load_cat_posts () {
      $cat_id = $_POST[ 'cat' ];
           $args = array (
          'cat' =&gt; $cat_id,
          'order' =&gt; 'DESC'
  
      );
      $posts = get_posts( $args );
              global $post;
      ob_start ();
      foreach ( $posts as $post ) {
      setup_postdata( $post ); ?&gt;
  &lt;div class="post"&gt;
      &lt;div class="in"&gt;
          &lt;div class="post__image"&gt;
              &lt;?php the_post_thumbnail(); ?&gt;
          &lt;/div&gt;
          &lt;div class="post__title"&gt;
              &lt;h4&gt;
                  &lt;a href="&lt;?php the_permalink(); ?&gt;"&gt;
                      &lt;?php the_title(); ?&gt;
                  &lt;/a&gt;
              &lt;/h4&gt;
          &lt;/div&gt;
          &lt;div class="post__content"&gt;
              &lt;?php the_excerpt(); ?&gt;
          &lt;/div&gt;
          &lt;div class="post__readmore"&gt;
              &lt;a href="&lt;?php the_permalink(); ?&gt;" class="btn btn--brand btn--block"&gt;Read More &gt;&lt;/a&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;/div&gt; 
      &lt;?php } wp_reset_postdata();
  $response = ob_get_contents();
  ob_end_clean();
  
  echo $response;
  die(1);
  }
  </code></pre>
  
  <p>Thanks</p>