Jump to content

Can't Edit Linked Product Page

Go to solution Solved by creedon,

Recommended Posts

Site URL: https://www.carolynkdesigns.com/shop/?tag=SALE

I have created a page just for Sale items using the tag SALE.  I find that I am unable to edit the page.  The page includes the title SHOP plus a repeat of some of the navigation below it.  The page is built using a tag, no category. Check out the link to the page.  It is out there, but it won't appear as a part of the navigation until it is fixed.  I want to do two things:

  • Change where it says Shop to For Sale
  • Remove the navigation below the word shop.  The page already has navigation on the top of the page.

I've been stuck for the last few weeks. I've used the link page because there are more than 30 items. Any ideas?

For Sale Page.png

Edited by Skor
Link to comment
  • Replies 13
  • Created
  • Last Reply

Top Posters In This Topic

Quote

Change where it says Shop to For Sale

Add the following to Settings > Advanced > Code Injection > HEADER.

<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.

<!--

  begin change tag page title
  
  SS Version : 7.1
  
  the code is comprised of a several tags. all are needed for the full effect to
  work
  
  -->
  
  <style>
  
    .nested-category-title {
    
      --opacity-transition-duration : 0.5s;
      
      }
      
    </style>
    
  <script>
  
      const tag = 'SALE';
      
      const title = 'For Sale';
      
    </script>
    
  <!-- do not change anything below, there be the borg here -->
  
  <style>
  
    .nested-category-title {
    
      opacity : 0;
      transition : opacity var( --opacity-transition-duration );
      
      }
      
    </style>
    
  <script>
  
    $( ( ) => {
    
      const getSearchParameter = ( key ) => {
      
        let data = {
        
          hasKey : false,
          value : null
          
          }
          
        if ( location.search ) {
        
          const searchParams = new URLSearchParams ( location.search );
          
          data.value = searchParams.get ( key );
          
          if ( data.value !== null ) data.hasKey = true;
          
          }
          
        return data;
        
        }
        
      const tagSearchParameter = getSearchParameter ( 'tag' );
      
      if ( ! tagSearchParameter.hasKey ) return;
      
      if ( tagSearchParameter.value != tag ) return;
      
      $( '.nested-category-title' )
      
        .text ( title )
        
        .css ( 'opacity', 1 );
        
      } );
      
    </script>
    
  <!-- end change tag page title -->

This is for v7.1

Let us know how it goes.

Edited by creedon
version 2

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment
Quote

Remove the navigation below the word shop.  The page already has navigation on the top of the page.

If you've not already done so, add the following to Settings > Advanced > Code Injection > HEADER.

<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. This will be in addition to the code from the previous post.

<script>

  $( ( ) => {
  
    /*
    
      begin hide tag page categories
      
      SS Version : 7.1
      
      */
      
    const tag = 'SALE';
    
    // do not change anything below, there be the borg here
    
    const getSearchParameter = ( key ) => {
    
      let data = {
      
        hasKey : false,
        value : null
        
        }
        
      if ( location.search ) {
      
        const searchParams = new URLSearchParams ( location.search );
        
        data.value = searchParams.get ( key );
        
        if ( data.value !== null ) data.hasKey = true;
        
        }
        
      return data;
      
      }
      
    const tagSearchParameter = getSearchParameter ( 'tag' );
    
    if ( ! tagSearchParameter.hasKey ) return;
    
    if ( tagSearchParameter.value != tag ) return;
    
    $( '.nested-category-children' ).css ( 'display', 'none' );
    
    $( '.products.collection-content-wrapper .nested-category-title' )
    
      .css ( 'margin-bottom', '37px' );
      
    /* end hide tag page categories */
    
    } );
    
  </script>

This is for v7.1.

Yep. It's virtually the same code as in the previous post. The question in my mind was to do it like this? Or, post user code with a callback function in it? I opted for the more verbose but hopefully more understandable code from the user perspective.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment

Thank you so much @creedon.  Great instructions. I didn't know that was a place where code could be injected.  I made the changes at the store level and got an error when I tried to save so I cancelled. Here's what displayed:

Couldn't Update Collection
These items cannot be set as category ordered item IDs because they do not belong to this category.  There was then a list of over 30 IDs.  It had an OK button to continue but I bailed.  Yeah, didn't expect that.  

Have you seen this error before?

 

Link to comment
Quote

Have you seen this error before?

I don't recall that specific error. But I've had and others have reported errors when trying to save now and then. There were reports earlier today about other editing errors so perhaps SS is having an issue currently. When this happens I usually wait some amount of time and try again. I know it is annoying. I usually choose to take a break! 🙂 If it happens again then I wait a little longer. If the problem is persistent then report to customer support.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment

Thanks for the guidance.  It's getting a little late here to make changes anyway.  All you have to mention custom code to the support folks and they don't want to talk to you. Of course there are hooks all over the platform to do just that.  Ha.  I'll see how things behave tomorrow.  Thanks again.

Link to comment

Just got a chance to check again this morning.  I still got the error and didn't officially "save" the changes, but the code is still there and it worked and that's good enough for me.  Thank you so much @creedon. I really appreciate your assistance and answering my question.

 

Link to comment

I did notice that you can see "Shop" for a split-second before On Sale appears on the title.  I can certainly live with that unless you know of a quick fix for that.  For the sale page, which will be a shorter term thing, it's fine. Again, many thanks.

Link to comment
  • Solution
Quote

I did notice that you can see "Shop" for a split-second before On Sale appears on the title.

Yeah it takes a second or so for the code to make the title change. So what we can do is make the opacity of the title zero (hidden) at first, change the text, then bring the opacity up to 1 (visible).

I have updated my change tag page title code post.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.