Jump to content

Add button to individual physical product pages

Recommended Posts

Site URL: https://www.ornointeriors.com.au/shop-categories

I would like to change some text linked to a /contact page to a button.

Using the code found here https://forum.squarespace.com/topic/192022-adding-button-throughout-the-website/#comment-456355 (thanks Creedon) works for all products on that page.

eg: https://www.ornointeriors.com.au/chest-of-drawers-dressers

However I would like to add a button for individual physical product pages that are POA.

eg: https://www.ornointeriors.com.au/dining-chairs/paloma-side-chair

Does anyone have any suggestions, is this possible using tags with CSS linked to code?

 

Link to comment
  • 2 weeks later...

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

<script>

  /*
  
    is product detail page tagged with poa
    
    Version         : 0.1d0
    
    SS Versions     : 7.0, 7.1
    
    v7.0 Templates  : Brine ( Aria, Blend, Cacao, Clay, Fairfield, Feed,
                      Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact,
                      Jaunt, Juke, Keene, Kin, Lincoln, Maple, Margot, Marta,
                      Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva,
                      Pedro, Pursuit, Rally, Rover, Royce, Sofia, Sonora,
                      Stella, Thorne, Vow, Wav, West )
                      
                      your template is not listed? then it is not currently
                      supported
                      
    Dependancies    : jQuery
                      
                      add button after add to cart button of product detail page
                      v0.2d0
                      
    By              : Thomas Creedon < http://www.tomsWeb.consulting/ >
    
    */
    
    const isTaggedPoa = ( ) => {
    
      return $( '.ProductItem' ).hasClass ( 'tag-poa' );
      
      };
      
  </script>

I have updated my code in the post you cited. In the code change the following line from...

    const guardProcessor = undefined;

...to...

    const guardProcessor = isTaggedPoa;

Follow the install instructions from the cited post.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
  • 2 weeks later...

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.