Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Adding button throughout the website?


CCE

Question

Site URL: https://cliftoncreativeevents.com

I have multiple shop pages but I don't want anyone to be able to purchase anything directly. So I hid the add to cart button and want to add a contact button which links to the form page. But is there a way to have that button pop up on all product pages without having to individually add it in?

Link to comment

11 answers to this question

Recommended Posts

  • 0
46 minutes ago, CCE said:

Site URL: https://cliftoncreativeevents.com

I have multiple shop pages but I don't want anyone to be able to purchase anything directly. So I hid the add to cart button and want to add a contact button which links to the form page. But is there a way to have that button pop up on all product pages without having to individually add it in?

What is the site wide password

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
14 minutes ago, creedon said:

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.


<script>

  $( ( ) => {
  
    /*
    
      add button after add to cart button of product detail page
      
      SS Versions : 7.0, 7.1
      
      */
      
    const text = 'View Shopping Bag';
    
    const url = '/cart';
    
    const targetAtttributeValue = ''; /* use _self (default, if left empty) |
                                         _blank | _parent | _top | framename */
    
    // do not change anything below, there be the borg here
    
    const $addToCartButton = $( '.sqs-add-to-cart-button-wrapper' );
    
    if ( ! $addToCartButton.length ) return;
    
    const buttonSelector = '.sqs-add-to-cart-button';
    
    let $additionalCartButton = $addToCartButton
    
      .clone ( )
      
      .removeAttr ( 'id' );
      
    let $e = $( buttonSelector, $additionalCartButton )
    
      .attr ( 'href', url )
      
      .removeAttr ( 'id ' +
      
        'data-collection-id ' +
        
        'data-item-id ' +
        
        'data-original-label ' +
        
        'data-product-type ' +
        
        'data-use-custom-label' )
        
      .find ( '.sqs-add-to-cart-button-inner' )
      
        .html ( text )
        
        .end ( );
        
    if ( targetAtttributeValue )
    
      $e.attr ( 'target', targetAtttributeValue );
      
    let $anchorTag = $( '<a>' );
    
    $.each ( $e.prop ( 'attributes' ), function ( ) {
    
      $anchorTag.attr ( this.name, this.value );
      
      } );
      
    $e
    
      .children ( )
      
      .appendTo ( $anchorTag );
      
    $e.replaceWith ( $anchorTag )
    
    $additionalCartButton.insertAfter ( $addToCartButton );
    
    } );
    
  </script>

This is for v7.0 and v7.1.

Let us know how it goes.

I put it in, it works great but it only works when I remove the code I put in to hide the add to cart and quantity options. Once I put my code back in, it also removes the new button. 

 

.product-quantity-input {
 display:none !important;
}

.sqs-add-to-cart-button-wrapper, {
 display:none !important;
}

 

Link to comment
  • 0
Just now, creedon said:

That password doesn't work. I can take a look when the password works.

Sorry, I didn't realize I wasn't case sensitive. Password is "clifton"

Link to comment
  • 0
On 4/6/2021 at 10:30 AM, CCE said:

It worked! Just had to deactivate and reactive my css for some reason but then your new code worked!

 

Thank you so much!

I see your site has some small problems. If you need to fix any problems, just comment here, we will give the code

Site URL: https://cliftoncreativeevents.com/

1. (Mobile-White bar)

cliftoncreativeevents.com-mobile-white-b

2. (Mobile-Footer) Change order of newsletter – Follow social links?

cliftoncreativeevents.com-mobile-footer-

3. (Tablet-Footer) Footer doesn’t look good.

cliftoncreativeevents.com-tablet-footer-

4. (Tablet-Homepage)

cliftoncreativeevents.com-tablet-homepag

5. (All devices) Want to change link icon to tiktok?

cliftoncreativeevents.com-all-device-min

6. (Mobile-Portfolio sub pages) Huge space top/bottom slideshow

cliftoncreativeevents.com-mobile-portfol

7. (Supply Rentals) Browser tab name still shows “Store 2”

cliftoncreativeevents.com-supply-retals-

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0

I have updated my code post. If your current code is working then no need to update. The new feature is support for a guard processor. This means you can write a custom script that can help decide if the code to add the button should run. Useful if you want the code to only run on certain pages. For example if your product has a certain tag or if the product has a particular sku. It's really up to you! 😀

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