Do you own a Magento 2 store with the wide variety of products and services? Do you have multiple subcategories under a category and do you want to provide easy navigation from the category in the store to improve the user experience?<\/p>\n\n\n\n
It is not at all accepted that you lose a conversion just because a potential customer was unable to find what he wanted at your store Here\u2019s the solution to display Magento 2 subcategories with image on category page<\/strong><\/i> that helps visitors to navigate easily through your store!<\/p>\n\n\n\n Provide a rich navigation system in Magento 2 store. Display Magento 2 subcategories with <\/strong><\/i>image<\/strong><\/i> on <\/strong><\/i>category<\/strong><\/i> page<\/strong><\/i>. It allows visitors to quickly navigate through the store and the images add to the visual display for easy navigation.<\/p>\n\n\n\n Follow the solution and you\u2019ll have a Magento 2 store with enhanced user experience <\/p>\n\n\n\n Add the below code at app\/design\/[Theme Folder]\/Magento_Catalog\/templates\/product\/list.phtml<\/strong><\/p>\n\n\n\n There you go! A Magento 2 store with a wide variety of products, all easily sorted and accessible for your valuable customers!<\/p>\n\n\n\n Please feel free to seek help in the implementation of the above solution ? Thank You.<\/p>\n","protected":false},"excerpt":{"rendered":" Do you own a Magento 2 store with the wide variety of products and services? Do you have multiple subcategories under a category and do…<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[34],"tags":[],"class_list":["post-193","post","type-post","status-publish","format-standard","hentry","category-magento"],"acf":[],"_links":{"self":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/193","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/comments?post=193"}],"version-history":[{"count":2,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/193\/revisions"}],"predecessor-version":[{"id":10247,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/posts\/193\/revisions\/10247"}],"wp:attachment":[{"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/media?parent=193"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/categories?post=193"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/meetanshi.com\/blog\/wp-json\/wp\/v2\/tags?post=193"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}Method to Display Magento 2 Subcategories With Image on Category page:<\/h2>\n\n\n\n
<?php\n$objectManager = \\Magento\\Framework\\App\\ObjectManager::getInstance();\n$category = $objectManager->get('Magento\\Framework\\Registry')->registry('current_category');\/\/get current category\nif ($category) {\n $subcats = $category->getChildrenCategories();\n $_helper = $this->helper('Magento\\Catalog\\Helper\\Output');\n ?>\n <ul style=\"padding: 0px;float: left;width: 100%\">\n <?php\n foreach ($subcats as $subcat) {\n if ($subcat->getIsActive()) {\n $_category = $objectManager->create('Magento\\Catalog\\Model\\Category')->load($subcat->getId());\n $_outputhelper = $this->helper('Magento\\Catalog\\Helper\\Output');\n $subcaturl = $subcat->getUrl();\n \n $_imgHtml = '';\n if ($_imgUrl = $_category->getImageUrl()) {\n \n $_imgHtml = '<img style=\"width: 100%;\" src=\"' . $_imgUrl . '\" \/>';\n $_imgHtml = $_outputhelper->categoryAttribute($_category, $_imgHtml, 'image');\n \n \/* @escapeNotVerified *\/\n echo '<li style=\"list-style-type: none;width:24%;margin-right:1%;float:left\"><a href=\"' . $subcaturl . '\n \" class=\"block-promo\" title=\"' . $subcat->getName() . '\">' . $_imgHtml . '\n <\/a><\/li>';\n }\n }\n } ?>\n <\/ul>\n<?php } ?><\/pre>\n\n\n\n
Don\u2019t forget to rate the post with 5 stars.<\/p>\n\n\n\n