cancel
Showing results for 
Search instead for 
Did you mean: 

How to Hide Product InStock status from product list/grid

SOLVED

How to Hide Product InStock status from product list/grid

I have found part of the answer in another post listed below:

https://community.magento.com/t5/Magento-2-x-Programming/How-to-remove-in-stock-status-in-magento-2-... 

 

--------

Unfortunately it only hides the stock status for the product page and it is still showing up when the products are listed in a group in the list/grid page.  My website is:

mdreaststore.com and will see the "instock" shows when you hover over a product but when You click to view just a single product it is indeed hidden.  How do I hide the stock status in the list/grid view?  

 

Thank you all in advance!!

 

Ellen

1 ACCEPTED SOLUTION

Accepted Solutions

Re: How to Hide Product InStock status from product list/grid

Hi @5dec59fa0bf50 

Minor change, missed while copying

<style>
.product-item-actions .actions-primary .stock.available
{
 display:none !important;
}
</style>

please try once and flush the cache

View solution in original post

7 REPLIES 7

Re: How to Hide Product InStock status from product list/grid

Hi @5dec59fa0bf50 

You can use the below css to hide this.

.product-item-actions .actions-primary .stock available
{
 display:none;
}

I hope it will help you!

Re: How to Hide Product InStock status from product list/grid

Hi @5dec59fa0bf50 ,

 

You can follow the approach mentioned by @Vimal Kumar.

Or 

If you want this customization using code follow these steps.

 

1. copy vendor/magento/module-catalog/view/frontend/templates/product/list.phtml in your custom theme on path app/design/frontend/[Theme_Vendor]/Theme_Name/Magento_Catalog/templates/product/list.phtml

2. Comment the code related to stock. (check attached screenshot)Screenshot from 2020-05-06 22-44-44.png

3. Flush the Magento cache.

 

Thanks!

---------------------
Problem solved? Click Kudos & Accept as Solution!

Re: How to Hide Product InStock status from product list/grid

what css file are you suggesting I edit?

 

 

Re: How to Hide Product InStock status from product list/grid

Hi @5dec59fa0bf50 

You can add in the custom css file or in admin for your active theme.

admin->Content->Design->Configuration->Edit your Active theme->Html Head->Scripts and Style Sheets-> Add the following lines.

<style>
.product-item-actions .actions-primary .stock available
{
 display:none !important;
}
</style>

Screenshot from 2020-05-07 06-45-59.png

I hope it will help you!

Re: How to Hide Product InStock status from product list/grid

 

Sorry It didn't work, let me show You what I mean!  It is in the product list at the bottom. If you hover over the other images it shows the exact same thing. 

 

instockProblem.png

 

Re: How to Hide Product InStock status from product list/grid

Hi @5dec59fa0bf50 

Minor change, missed while copying

<style>
.product-item-actions .actions-primary .stock.available
{
 display:none !important;
}
</style>

please try once and flush the cache

Re: How to Hide Product InStock status from product list/grid

That Did the trick, thank you for your time and checking back to get it fixed!!!!

 

Ellen