Product Quick View Observe Changes

Product Quick View Observe Changes

License

Synopsis

Observe changes to the modal lightbox product quick view and call custom callbacks as nodes are added to the DOM.

Version

• 0.1.0

SS Versions

• 7.1

• 7.0

v7.1 Fluid Engine Compatible

• Not Applicable

Dependencies

• Squarespace plan that supports JavaScript.

• Modal Lightbox Observe Changes

---

Install

• Install Modal Lightbox Observe Changes. After you install the code be sure to continue on with the rest of the steps.

• Options

  • Page Specific

    • This option will be the one most will want to use if you have only a single page you want to have this effect.

    • Add code from file product quick view observe changes.html to Page Settings > Advanced > Page Header Code Injection for the page, before the modal lightbox observe changes code. Please see Per-page code injection.

  • Site-wide

    • This option is the one you want to use if you have multiple elements such as a store page and product blocks where you want to have this effect.

    • Add code from file product quick view observe changes.html to Website > Pages > Website Tools > Code Injection > FOOTER, before the modal lightbox observe changes code. Please see Add code to code injection.

• Add the twcPqvoc callback name to the modal lightbox observe changes code code per that codes install instructions.

• If you need installation help or customization please contact me for paid consulting.

Callbacks

Your callbacks must accept a node as a parameter.

Following is a very generalized example of a callback. The callback(s) must be defined before the code of this effect. Note the use of var.

<script>

  var pqvocNodeAddedLog = ( node ) => {
  
    console.log ( 'pqvocNodeAddedLog : ', node );
    
    };
    
  </script>

Note

This code is a base for other effects.

Make a Donation

Please consider making a donation.

Changes

• 2024-05-23

  • initial version