7.1 empty product category

Site URL: https://tuna-ladybug-3hgy.squarespace.com/shop/sale/2550

 So, I don't currently have any item in a shop category but I don't want to delete it. Is there a way to display a message that says "check back soon" on empty pages? 

site:https://tuna-ladybug-3hgy.squarespace.com/shop/sale/2550
pass: brineintopedro

Please see Store Product List Empty Text Add.

I've supplied a CSS id selector #twc-empty-products-pages-text if you want to style the text.

Let us know how it goes.

Worked like a charm, and TYso much for adding the css id selector – next level 👏

On 4/1/2021 at 9:32 PM, creedon said:

Add the following to Settings > Advanced > Code Injection > HEADER. You've already done this step but others will need to if they haven't.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

Add the following to Store Settings > Advanced > Page Header Code Injection for the store page.

<script>

  $( ( ) => {
  
    /*
    
      add text to empty products pages
      
      SS Version : 7.1
      
      */
      
    const text = 'Please check back soon!';
    
    // do not change anything below, there be the borg here
    
    if ( ! $( '.view-list' ).length ) return;
    
    const $listGrid = $( '.list-grid' );
    
    if ( $listGrid.children ( ).length ) return;
    
    $( '<p id="tc-empty-products-pages-text">' +
    
      text +
      
      '</p>' )
      
      .appendTo ( $listGrid );
       
    } );
    
  </script>

This is for v7.1.

I've supplied a CSS id selector #tc-empty-products-pages-text if you want to style the text.

Let us know how it goes.

How would you do this for 7.0?

8 hours ago, sdinsmore said:

How would you do this for 7.0?

I can't make any promises that I can come up with a solution but I'm willing to take a look.

Please post the URL for a page on your site where we can see your issue.

If your site is not public please set up a site-wide password, if you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site. Please read the documentation at the link provided to understand how it works.

Please read the documentation at the link provided on how to share a link to your site to understand how it works. A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

We can then take a look at your issue.

Website is public. Here is an empty category at the store: https://www.dancingastronautdesigns.com/store?category=Headcovers. 7.0, Brine.

So not only is there nothing to display (which is why I would like to add a message), but the webpage height is absurdly short; it ends just after the store nav bar, leaving the remaining area white (while my site is a black background).

Ideally, I would like to:

*Make any page in the store a default minimum height so that the background color (black) is always displayed; never white.

*Display a message if a store category is empty.

*Even add a footer to the store pages? Not sure why this isn't allowed or editable. Only an Intro is allowed.

I have updated my cited code in my April 1, 2021 post.

It now supports v7.0 (Brine template family).

@sdinsmore I can help with the adding text but don't have solutions to your other issues at this time.

Thank you. So when it comes to Store pages, you have to have it full of items in order to not have a webpage with a height of ~150 pixels??

2 hours ago, sdinsmore said:

So when it comes to Store pages, you have to have it full of items in order to not have a webpage with a height of ~150 pixels??

I can only guess the design decisions Squarespace had to make. It appears SS didn't anticipate many folks having totally empty categories. I think they probably expected most folks to have categories with sold out products. So they would still be listed but tagged as sold out.

Try this. Add the following to Store Settings > Advanced > Page Header Code Injection for the store page. Please see per-page code injection.

<style>

  body.tweak-site-width-option-full-width {
  
    background-color : black;
    
    }
    
  </style>

Let us know how it goes.

Just to clarify the reason why (in case SS is listening), our company sells unique, one-of-a-kind products, which we REMOVE after they sell. So when categories sell out, then we have an empty category, although we don't want to remove/hide that category.

Regarding your code for the background and the script for an empty product list, both of those worked to an extent. There isn't a white background anymore, which is, at a minimum, a safe backup plan. The script also adds some basic text (which you can see at the original link I posted). I made a donation on your website as a thank you, I appreciate your help!

From an earlier post in this thread, I see I can style the text using CSS, which I can probably figure out myself.

One more advanced question... would it be possible, instead of just inserting text, to also insert spacers and, say, a footer at the bottom of the page, the location of which is calculated from the screen height? It would also be nice to insert a footer on all store pages. The "footers" across my site are actually simple Markdown boxes with "<h4>©DANCING ASTRONAUT DESIGNS 2022, ALL RIGHTS RESERVED</h4>" in them.

4 hours ago, sdinsmore said:

The script also adds some basic text (which you can see at the original link I posted).

Note that you'll need to disable Ajax Page Loading (in Site Styles) if you want this text to appear for all users - or @creedon will need to update his code. To see this issue, click open the site by clicking on this Accessories link (whilst not logged on) and then click on the Headcovers category. 

Thank you Paul, good catch. I disabled Ajax.

I have updated my cited code in my April 1, 2021 post.

It now supports Ajax being enabled.

13 hours ago, sdinsmore said:

would it be possible, instead of just inserting text, to also insert spacers and, say, a footer at the bottom of the page, the location of which is calculated from the screen height? It would also be nice to insert a footer on all store pages.

The text variable can contain HTML if you wish. However it wasn't written with the idea of using complex HTML in the area that the text is being stuffed into. My code doesn't allow for the use of spacers as in the sense of space blocks as provided in the SS interface. My code also doesn't do anything with the footer.

One technique folks use for having a footer appear on only some pages is to add it to the site wide footer and then use CSS to hide it for most pages and then turn it on for those you want it on.

hi @creedon - I've implemented your code but I see no message on empty categories.

Would you be able to check to see what's up with just front-end access?

Password is: golfballs

Category page is https://encore-refresh.squarespace.com/shop/all-grades/mint

thanks in advance

@ColinB

From the quick install instructions.

• Add code from file store product list empty text add.html to Store Settings > Advanced > Page Header Code Injection for the store page.

thanks @creedon but I'd already done that but have redone it in case it was wrong. But it's still not working. Perhaps some other code is clashing with it?

On 1/29/2022 at 1:12 AM, ColinB said:

But it's still not working.

I have updated my cited code in my April 1, 2021 post.

I fixed an initialization bug.

Please reinstall the code.

Let us know how it goes.

@creedon I know the code says that only the listed templates are supported, is there any chance of new templates being added in the future to support this code? 

I attempted to inject the code into store page: https://www.studio-lawrence.co.uk/artwork/available-paintings (Password 1234) but this didn't work. 

Any ideas or alternatives I can try to display a message on the empty category?

5 hours ago, ellisb1 said:

I know the code says that only the listed templates are supported

v7.1 is supported by the code but you need to install all the code in the instructions. You have not installed twcsl.

Hi @creedon, amazing code, thank you! 

Is that a way to add a link to the text on an empty category page?

Or a way to link a category to another page?

I'm trying to link https://themodernu.com/shop > Category "All DMK Products" to https://themodernu.com/dmk-shop (password-protected items).

Appreciate your help.

9 minutes ago, ianeaf said:

Is that a way to add a link to the text on an empty category page?

If you include <a href="/dmk-shop">my link</a> in the text it should be rendered as a link.