Show "Out of stock" message on product listing pages

Open to all! Ask other shopowners for help.
14Steve14
Senior Contributor
Posts: 922
Joined: Fri Oct 25, 2019 7:01 pm
Phoenix Version: v1.0.9.1
Has thanked: 17 times
Been thanked: 103 times

Show "Out of stock" message on product listing pages

Post by 14Steve14 »

Does anyone know of a way of adding an "Out of Stock" message/banner across an out of stock product on the product listing pages, not the actual product page.

I saw this on another non Phoenix site and thought it may be good to show a product that is out of stock, just so customers can see that the item should be stocked. Currently on my site the image can be shown when at zero stock but its not until the customers actually clicks on the product that they see it is out of stock.

Please see image for better explanation
out-of-stock.png


Join The Code Co-op to get access to your library in the Code Co-op Forum
raiwa
Certified Developer
Posts: 1640
Joined: Sat Dec 21, 2019 8:08 am
Phoenix Version: 1.1.0.6
Has thanked: 70 times
Been thanked: 152 times

Re: Show "Out of stock" message on product listing pages

Post by raiwa »

Public Phoenix Change Log Cheat Set on Google Sheets
https://docs.google.com/spreadsheets/d/ ... sp=sharing

Need Help?viewtopic.php?f=10&t=27
14Steve14
Senior Contributor
Posts: 922
Joined: Fri Oct 25, 2019 7:01 pm
Phoenix Version: v1.0.9.1
Has thanked: 17 times
Been thanked: 103 times

Re: Show "Out of stock" message on product listing pages

Post by 14Steve14 »

raiwa wrote: Wed Jul 07, 2021 9:12 am app.php/addons/paid_addon/no_stock_button/
Thanks for that. It may work, and may also replace other older code that I have already installed on the product info page that Gary wrote ages ago.
lecarlb
Contributor
Posts: 316
Joined: Mon Oct 26, 2020 5:26 pm
Phoenix Version:
Has thanked: 48 times
Been thanked: 9 times

Re: Show "Out of stock" message on product listing pages

Post by lecarlb »

@14Steve14 here's how it look on one of my Phoenix sites. I thought it was better because it was nonintrusive.
You do not have the required permissions to view the files attached to this post.
Nigel
Contributor
Posts: 114
Joined: Mon Jan 11, 2021 1:39 am
Phoenix Version:
Has thanked: 29 times
Been thanked: 8 times

Re: Show "Out of stock" message on product listing pages

Post by Nigel »

I buy online from the wholesale arm of Heineken.
They put a thin red border around the item box (card) and disable the add to basket + / - options too.
It works well with all other info options about the product still available.
User avatar
burt
Core Team
Posts: 4551
Joined: Tue Oct 29, 2019 9:37 am
Phoenix Version: v1.1.0.8
Has thanked: 252 times
Been thanked: 412 times

Re: Show "Out of stock" message on product listing pages

Post by burt »

Somewhat similar would be the Supporters Code "s01e10 - Sale Sticker".
What that one does is put up a little "sticker" on product listings when the product is on a special offer.

You could rework that to look for quantity at hand and place a "sticker" or banner ...

Not super straightforward, but definitely doable.
I am not here to build for you.
I am here to build with you. Let's help each other.
14Steve14
Senior Contributor
Posts: 922
Joined: Fri Oct 25, 2019 7:01 pm
Phoenix Version: v1.0.9.1
Has thanked: 17 times
Been thanked: 103 times

Re: Show "Out of stock" message on product listing pages

Post by 14Steve14 »

burt wrote: Thu Jul 08, 2021 1:20 pm Somewhat similar would be the Supporters Code "s01e10 - Sale Sticker".
What that one does is put up a little "sticker" on product listings when the product is on a special offer.

You could rework that to look for quantity at hand and place a "sticker" or banner ...

Not super straightforward, but definitely doable.
Welcome back @burt Gary. Glad to see you here again, even if not full time.

I did look at that and see that it is basically controlled by a few lines of code about the specials, but being a code idiot I have no idea where to start on how to select the out of stock items.

I may have to buy the mod recommended by Rainer and see if that can be changed. Cheap enough if its not what I want completely, but may do some of it.
14Steve14
Senior Contributor
Posts: 922
Joined: Fri Oct 25, 2019 7:01 pm
Phoenix Version: v1.0.9.1
Has thanked: 17 times
Been thanked: 103 times

Re: Show "Out of stock" message on product listing pages

Post by 14Steve14 »

14Steve14 wrote: Fri Jul 09, 2021 11:46 am
burt wrote: Thu Jul 08, 2021 1:20 pm Somewhat similar would be the Supporters Code "s01e10 - Sale Sticker".
What that one does is put up a little "sticker" on product listings when the product is on a special offer.

You could rework that to look for quantity at hand and place a "sticker" or banner ...

Not super straightforward, but definitely doable.
Welcome back @burt Gary. Glad to see you here again, even if not full time. I hope everything is as good as it can be.

I did look at that and see that it is basically controlled by a few lines of code about the specials, but being a code idiot I have no idea where to start on how to select the out of stock items.

I may have to buy the mod recommended by Rainer and see if that can be changed. Cheap enough if its not what I want completely, but may do some of it.
User avatar
burt
Core Team
Posts: 4551
Joined: Tue Oct 29, 2019 9:37 am
Phoenix Version: v1.1.0.8
Has thanked: 252 times
Been thanked: 412 times

Re: Show "Out of stock" message on product listing pages

Post by burt »

It would be something like (changing L26 in the file), to (note, untested!):

Code: Select all

<script>$('.btn-buy').each(function() { var quantity = $(this).data('in-stock'); if (quantity < 1) {
This is targetting every "buy" button, looking at it's quantity and determining if quantity is fewer than 1, if yes, show the sticker. Obviously change the sticker appropriately in the language file.

Rainers solution likely does more, so it would be worth checking that out as the "sticker" solution is just cosmetic and requires user to have javascript turned on...
I am not here to build for you.
I am here to build with you. Let's help each other.
shopify
Member
Posts: 54
Joined: Tue Mar 30, 2021 3:36 pm
Phoenix Version:
Has thanked: 23 times
Been thanked: 3 times

Re: Show "Out of stock" message on product listing pages

Post by shopify »

Sold Out.jpg
I've done this using if ($listing['in_stock'] == 0 {
//Show add to cart button
} else {
//Show sold out button
}

But I like the look of that @lecarlb sold out button. I wonder how he did that button.
You do not have the required permissions to view the files attached to this post.


Join The Code Co-op to get access to your library in the Code Co-op Forum
Post Reply