{"id":6378,"date":"2016-02-17T14:18:35","date_gmt":"2016-02-17T19:18:35","guid":{"rendered":"https:\/\/themespress.ca\/?p=6378"},"modified":"2022-09-11T11:23:08","modified_gmt":"2022-09-11T15:23:08","slug":"display-woocommerce-product-categories","status":"publish","type":"post","link":"https:\/\/themespress.ca\/en\/display-woocommerce-product-categories\/","title":{"rendered":"Display WooCommerce Product Categories"},"content":{"rendered":"
\n\t
\n\t\t
\n\t\t\t

With this tutorial, we will show you a way to display your WooCommerce product categories outside of widgets. We will run a query that will display the categories matching the WooCommerce taxonomy.<\/p>\n

To find your WordPress taxonomy, simply access your category’s Post Type and look at the URL.
\nIn this example, we see this: taxonomy=product_cat in the URL so the taxonomy’s name is WooCommerce.<\/p>\n\n\t\t<\/div>\n\t<\/div>\n\n\t

\n\t\t\n\t\t
\n\t\t\t
\"\"<\/div>\n\t\t<\/figure>\n\t<\/div>\n

Display WooCommerce Product Categories<\/h2>
<?php \n$categories = get_categories('taxonomy=product_cat&amp;hide_empty=1');\n$select = "<select name='cat' id='cat' class='postform'>\n<option value='".$category->slug."'>Quelle Occasion ?<\/option>";\n  foreach($categories as $category){\n  if($category-&gt;count &gt; 0){\n      $select.= "<option value='".$category->slug."'>".$category->name."<\/option>";\n  }}\n$select.= "<\/select>";\necho $select;\n?><\/pre><\/div>\n\t
\n\t\t
\n\t\t\t
With the Javascript, we will specify the desired category and redirect it to the URL matching your category.<\/p>\n
After our query, we will add our JavaScript.<\/p>\n\n\t\t<\/div>\n\t<\/div>\n
<script type="text\/javascript">\nvar dropdown = document.getElementById("cat");\nfunction onCatChange() {\nif ( dropdown.options[dropdown.selectedIndex].value != -1 ) {\nlocation.href = "<?php echo home_url();?>\/boutique\/categorie\/"+dropdown.options[dropdown.selectedIndex].value+"\/";\n}}\ndropdown.onchange = onCatChange;\n<\/script><\/pre><\/div>\n\t
\n\t\t
\n\t\t\t
When we look at the redirected ULR in the previous code.
\nSimply update the URL with the slug category.<\/p>\n\n\t\t<\/div>\n\t<\/div>\n
location.href = "<?php echo home_url();?>\/boutique\/categorie\/"+dropdown.options[dropdown.selectedIndex].value+"\/";<\/pre><\/div><\/div><\/div><\/div><\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"With this tutorial, we will show you a way to display your WooCommerce product categories outside of widgets. We will run a query that will display the categories matching the
Read More<\/a><\/div>","protected":false},"author":81,"featured_media":4501,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[283],"tags":[357,328],"class_list":["post-6378","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","tag-taxonomy","tag-woocommerce-config"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/themespress.ca\/en\/wp-json\/wp\/v2\/posts\/6378","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themespress.ca\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themespress.ca\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themespress.ca\/en\/wp-json\/wp\/v2\/users\/81"}],"replies":[{"embeddable":true,"href":"https:\/\/themespress.ca\/en\/wp-json\/wp\/v2\/comments?post=6378"}],"version-history":[{"count":0,"href":"https:\/\/themespress.ca\/en\/wp-json\/wp\/v2\/posts\/6378\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themespress.ca\/en\/wp-json\/wp\/v2\/media\/4501"}],"wp:attachment":[{"href":"https:\/\/themespress.ca\/en\/wp-json\/wp\/v2\/media?parent=6378"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themespress.ca\/en\/wp-json\/wp\/v2\/categories?post=6378"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themespress.ca\/en\/wp-json\/wp\/v2\/tags?post=6378"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}