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

Search the Community

Showing results for tags 'javascript'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • Forum
    • News and Announcements
    • Getting Started With Squarespace
    • Coding and Customization
    • Commerce
    • Selling & Scheduling Your Services
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles
  • Colorado Designers's Topics
  • Squarespace Forum Club Guidelines's Topics
  • Austin, TX Designers's Club Discussion
  • New York City Designers's Club Discussion
  • Berlin Designers's Club Discussion
  • SEO Experts's Club Discussion
  • Photographers's Club Discussion
  • Graphic Designers's Topics
  • London Designers's Topics
  • Podcasters's Club Discussion
  • Custom Coding Help's Club Discussion
  • Atlanta, GA Designers's Topics
  • Seattle, WA Designers's Topics
  • San Diego, CA Designers's Topics
  • Dallas, TX Designers's Topics
  • Australia Designers's Club Discussion
  • Minnesota Designers's Topics
  • Minnesota Designers's Topics
  • Copywriters's Topics
  • France Designers 🇫🇷's Topics
  • France Designers 🇫🇷's Topics
  • Portland, OR Designers's Topics
  • Canadian Website Designers's Club Discussion
  • Los Angeles Designers & Devs's Club Discussion
  • South African Designers's Club Discussion
  • Brazil Designers's Club Discussion
  • Developers's Club Discussion
  • German Circle Members's Topics

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



About Me




Expert ID

  1. I've set up a website where content is sold through Amazon Affiliate links. I have set up Amazon OneLink to enable me to sell in US, Canada and UK where the user will be sent to their local Amazon store upon clicking my links. I embedded the javascript below into my Squarespace footer (Settings; Advanced; Code Injection; Footer) as instructed on both the Amazon and Squarespace websites but everyone still only sees the US Amazon store. I've contacted Amazon and they've confirmed that everything looks set up fine from their end. Any idea what I should be doing on the Squarespace side to make this work? I'm signed up as a Business customer on an annual contract, based in US. www.winterplaybook.com <div id="amzn-assoc-ad-8435f65a-7439-47fb-bb97-5bf6a677d528"></div><script async src="//z-na.amazon-adsystem.com/widgets/onejs?MarketPlace=US&adInstanceId=8435f65a-7439-47fb-bb97-5bf6a677d528"></script> Anyone else had the same issue?
  2. Hi! I'm working on adding this neat particles.js animation to my client's website: https://codepen.io/VincentGarreau/pen/pnlso Everything is going well but I hit a roadblock. I want the animation to be a background for a page section, almost like a banner for an index page, but the animation is very small and narrow. Is there a fix for this? Also, there's this annoying minus symbol thing in the middle of the animation. Anyone know how to remove this?
  3. Site URL: https://www.era-label.com/ Hi, Just wanted to know if this was possible, I would like to replace the cart icon on desktop and mobile.I am using: Version 7.0 (Marta Template) Can i put an SVG file of my customized bag ? or a png image with an url ? Expectation: To be able to use my custom cart icon and still preserve the cart counter and all cart functionalities
  4. Hi, is it possible to run a threejs / webgl animation inside SquareSpace via custom JS? If so are there any docs? thanks! - Felix Turner
  5. Site URL: https://www.mylastbraincell.org I'm putting together an educational website (yet to be relased, but www.mylastbraincell.org with password beta-test), but after chatting to a freelance developer it is seeming like I can't produce what I want on SquareSpace. A major capability that I need on my site is interactivity with JavaScript modules, stuff where a student can move things around and observe how the system changes. I've attached a very rough idea of where I wanted to begin with the developer, and I would be so unbelievably appreciative to anyone who can tell me how to achieve this on Squarespace or if I need to start over on a different platform which you build up from nothing. I am in the process of learning JS/CSS/HTML but wanted to begin with general templates to get the interface out of the way while I just did the JS function attached to each button.
  6. Site URL: https://www.kevinwalton.ca Hi There! Finally got the chance to publish my redesigned website! See what you think, I am always looking to improve my skills! - Kevin W
  7. Site URL: https://www.ome.design Hello all. I've seen a few threads regarding this sort of subject already, and that often the conclusion is that there's nought to be done regarding the slow loading times related to 'unused javascript' on SS sites. Just as a preface, I'm a noob when it comes to coding so forgive my ignorance. Now, when assessing my site's speed on PageInsights (and various other tools), unused javascript files are cited as my main issue. Diving into this deeper, I see there are a bunch of facebook javascript files that seem to be slowing down my website??? Now, I have taken away my FB pixel.. and besides that I can't really imagine what's happening to cause this. Is it because I've social sharing icons and links to FB? Do FB links somehow insert their own javascript that could slow my website? (again, noob) These are the links provided by Google when referencing the unused java files: https://www.facebook.com/rsrc.php/v3/yR/r/zhfi1Uz36LI.js?_nc_x=Ij3Wp8lg5Kzhttps://www.facebook.com/rsrc.php/v3i7244/yK/l/en_GB/VptwldEJoUK.js?_nc_x=Ij3Wp8lg5Kz https://connect.facebook.net/en_GB/sdk/xfbml.customerchat.js https://www.facebook.com/rsrc.php/v3/y8/r/iCh0DOEOa3B.js?_nc_x=Ij3Wp8lg5Kz https://www.facebook.com/rsrc.php/v3/yp/r/xkDDtbnRaGa.js?_nc_x=Ij3Wp8lg5Kz https://www.facebook.com/rsrc.php/v3/ya/r/qAy9zK9-1J6.js?_nc_x=Ij3Wp8lg5Kz https://www.facebook.com/rsrc.php/v3iyOI4/yT/l/en_GB/UEpn9DfESuo.js?_nc_x=Ij3Wp8lg5Kz https://www.facebook.com/rsrc.php/v3iEpO4/ym/l/en_US/9JZFuMYprNT.js?_nc_x=Ij3Wp8lg5Kz https://www.facebook.com/rsrc.php/v3iRBQ4/y9/l/en_GB/jUUf_meG9yB.js?_nc_x=Ij3Wp8lg5Kz Any help would be most appreciated.
  8. Site URL: https://andy-rantell.squarespace.com/ Hi, I seem to be having an issue with the testimonial carousel. I added a Jquery package called slick slider to add some animation to the slider which works until I try to append the arrows that are currently there into the package or use the arrows that come with the package. The only other way I was thinking of getting around this issue was create a custom HTML block and inject the JS in but I am not sure how to access the collections I am looking for. Would anyone be able to help point me in the right direction please. Kind Regards.
  9. Site URL: https://www.kevinwalton.ca Hi, I was wondering if someone can help me with slowing down scrolling like they use on Webflow. I want my site to scroll like this: https://ceremonycoffee.com/ Researching what kind of scroll technique is used, I found that it is called "Luxy" javascript. I can't seem to figure out why it is not working on my site. <!-- before <body/> tag --> <!-- Smooth scrolling --> <script src="https://min30327.github.io/luxy.js/dist/js/luxy.js"></script> <script charset="utf-8"> var isMobile = /iPhone|iPad|Android/i.test(navigator.userAgent); if (!isMobile) { luxy.init({ wrapper: '#luxy', wrapperSpeed: 0.065, }); } </script> Can someone help? Thanks, Kevin
  10. Hey everyone! I'm currently trying to add an HTML/JavaScript code block that allows a page to make API calls/HTTP requests. I've attached a simple HTML file screenshot with all the code I'm trying to add to the code block. This HTML file, when opened on chrome, successfully queries the API using JavaScript 'fetch' and receives a response which is added to a table and displayed in HTML. Unfortunately when copied on the Squarespace code block, I get a script disabled message on the editing page and then a fetch failed when viewing the page normally. Any help would be greatly appreciated, let me know if any further clarification is needed! Thank you!
  11. Hi folks, in Squarespace 7.1 they've added a feature which loads the background image of a section only once you've scrolled to it. Generally, I really praise this move from Squarespace in order to make sites faster, but it is annoying when you reload a page you've already scrolled half-way down, and when you scroll up the images don't appear until the top of the screen is about 20% from the top of the image, so you're left with a blank area for the majority of the time scrolling through that section. I used to be able to manipulate the imagesLoaded function in 7.0, but I don't know how to trigger Squarespace getting the image src in 7.1. Anyone know how to do this? Thanks, Andrew
  12. Site URL: https://codepen.io/sarahwfox/pen/pNrYGb Hey all! I was wondering if it was possible to add custom cursors like this (see URL) to my website? I see some tutorials online for single images, but would something like this work as well? I haven’t done any JaavScript code injection into this squarespace website yet, and would be thankful for any tips and help! Thanks for your time!
  13. Site URL: https://idmdiscovery.com password idm. Hey! so i need some script that can redirect links to another link, for instance i want to change all the links in my cart so that they link to blog posts. I was using this code: <script> $( ( ) => { /* map cart item title urls */ const urlMappings = { '/saved/p/analogical-force' : '/labels/analogical-force' /* last or only item doesn't get a comma */ } const urlError = '/x'; /* page to go to in case a url mapping isn't found */ // do not change anything below, there be the borg here if ( location.pathname != '/cart' ) return; $( '.CartTableRow-itemTitle-1MDgZ' ).each ( function ( ) { let $this = $( this ); let href = $this.attr ( 'href' ); if ( href in urlMappings ) { href = urlMappings [ href ]; } else { href = urlError; } $this.attr ( 'href', href ); } ); } ); </script> and it worked until i installed the customcartdrawer plugin from squarewebsites.org, now the link redirect doesnt work with the cart drawer, i think i need to change the location pathname in the above script so its sitewide but i cant figure that out, i dont want anyone seeing the product pages, they are supposed to just hold data for the cart. If i can change the links sitewide instead of just the cart that might make it work again, can anyone help me out please? thanks so much.
  14. Site URL: https://www.ssteart.com/presets/p/essential-preset-pack-by-ssteart I would like to remove the scrollbar that appears next to the previews in a product slideshow. Right now I have used this code on the product page, though that also removes the main page scrollbar. Is there a way to specifically target the product item?
  15. Hello, I am trying to combine squarespace images with custom javascript and CSS. Specifically I am trying to have a certain picture display when the corresponding tab is "active" or clicked" the tabs portion of the section is custom built but the images need to be through squarespace and can not be custom built out. I need the first image to be set to display: block and the second and third images to be default to display: hidden to start and change to an "active" class in the css when their tab is clicked. I am having a lot of trouble targeting the images through the squarespace made CSS as I was not the one who wrote the custom code. I will provide screenshots of all relevant information. I am not sure if i can provide a link because the site is not live and its a copy. I only have the address with the name.squarespace/jejejkd-1. Is that safe to put up publicly? Sorry for new questions.
  16. Site URL: http://scunci.com/ Hi everyone, When I add ?format=json after page url on collection item page I see item object but when I in template try get item data that not exist , instead of him I see items, why ? please help Thanks.
  17. Sorry if this is a stupid question but I couldn't find an answer anywhere. I'm setting up a website and I'm experimenting with a Google map with Javascript. I know that I need a Business plan or higher in order for Javascript to run on the public site, but I'm wondering if that's also required for it to run on the private demo (obviously can't share a link)? The initial setup page said that I could build the site with the features I needed and then purchase whatever plan allowed for everything I'd included, so that makes me think the script should work in the preview. I just want to know whether my code isn't showing up because of a problem with the code or because I don't have a Business plan yet. (I'm creating it for a client and I don't want to have him purchase the plan until I know for sure that we need it, and I don't know if this is how I'll ultimately end up doing the map or not.)
  18. I like to use WSIWYG from Squarespace to format my text and for each text, i like to add a hyperlink like this: See video with this as URL -> href="javascript:videoPlay(5)" I prefer not to use a code block so that I can use SS's WSIWYG features. I have declared videoPlay in the code injection section. I have the business plan. Is this possible?
  19. Hi there, anyone knows if it's possible to use Autoprefixer in Squarespace 7.1 (possibly without an external editor)? It would be really useful since it will automatically adjust the code in order that it functions well on all browsers. Autoprefixer link: https://github.com/postcss/autoprefixer If not, is there another way to have the same result without manually going through all the code? Thanks!
  20. Hi all! I'm new to SquareSpace and I'm currently trying to edit the header text on the homepage of my portfolio. Someone else posted a related question and they referred to the animation at the top of this website: https://www.innovativeink.ca/ which is exactly what I'm going for. I found this animation code: https://codepen.io/arbak/details/MWaqPJK which is perfect! However, after adding in all the HTML, CSS, and Javascript, I still don't see the typing-text animation. All I see is the non-typing text portion (the first half of the sentence). I'd love some advice on what I can do to make this work! This is the entire code here: HTML (Insert into code block on page) HTML CSS JSResult <div class="container"> <h1> &samhoud | <!-- The words that we want to have typerwriter effect --> <span class="txt-type" data-wait="3000" data-words='["consultancy", "food", "creative tech", "ranj"]'></span> </h1> </div> Resources1×0.5×0.25×Rerun CSS (Insert into Custom CSS) /* CSS RESET */ * { margin: 0; padding: 0; /* Set background and text color */ background-color: #424242; color: #fff; font-family:Helvetica; font-weight:normal } /* ALIGN CONTENT */ .container { width: 100vw; height: 100vh; display: flex; /* Remove horizontal 'justify-content' center if you want the base text not to move */ justify-content: center; align-items: center; } /* ADD CURSOR */ .txt-type > .txt { border-right: 0.08rem solid #fff; padding-right: 2px; /* Animating the cursor */ animation: blink 0.6s infinite; } /* ANIMATION */ @keyframes blink { 0% { border-right: 0.08rem solid rgba(255, 255, 255, 1); } 100% { border-right: 0.08rem solid rgba(255, 255, 255, 0.2); } } JavaScript (Insert into Code Injection) class TypeWriter { constructor(txtElement, words, wait = 3000) { this.txtElement = txtElement; this.words = words; this.txt = ""; this.wordIndex = 0; this.wait = parseInt(wait, 10); this.type(); this.isDeleting = false; } type() { // Current index of word const current = this.wordIndex % this.words.length; // Get full text of current word const fullTxt = this.words[current]; // Check if deleting if (this.isDeleting) { // Remove characters this.txt = fullTxt.substring(0, this.txt.length - 1); } else { // Add charaters this.txt = fullTxt.substring(0, this.txt.length + 1); } // Insert txt into element this.txtElement.innerHTML = `<span class="txt">${this.txt}</span>`; // Initial Type Speed let typeSpeed = 50; if (this.isDeleting) { // Increase speed by half when deleting typeSpeed /= 2; } // If word is complete if (!this.isDeleting && this.txt === fullTxt) { // Make pause at end typeSpeed = this.wait; // Set delete to true this.isDeleting = true; } else if (this.isDeleting && this.txt === "") { this.isDeleting = false; // Move to next word this.wordIndex++; // Pause before start typing typeSpeed = 500; } setTimeout(() => this.type(), typeSpeed); } } // Init On DOM Load document.addEventListener("DOMContentLoaded", init); // Init App function init() { const txtElement = document.querySelector(".txt-type"); const words = JSON.parse(txtElement.getAttribute("data-words")); const wait = txtElement.getAttribute("data-wait"); // Init TypeWriter new TypeWriter(txtElement, words, wait); }
  21. Hello I would like to create a split section and so one side sticks as I scroll, does anyone have any idea how to create this? Example: https://nayatraveler.squarespace.com/journeys-peru-walking Thank you
  22. Site URL: https://www.arlo.squarespace.com Hey crew, I've been looking at wanting to do particles.js in the header of a homepage I'm creating. Just a template play around at the moment - not for a client. arlo.squarespace.com PW: enter I plan on the header being a "blob" colour shape that blends into the section below. Some particles I've looked at; https://codepen.io/Tollo/pen/YzKEqGm https://codepen.io/VincentGarreau/pen/pnlso https://codepen.io/samarkandiy/pen/xGEOLN Just wondering if anyone has success stories, examples and how to implement feeds.
  23. Site URL: https://www.willkonitzer.com Hi, I have a button on my website "Listen now" where I'd like the target url to change pending on the time of day. Every Friday from 6pm-7pm CST I want it to point to website B, while at all other times I want it to point to website A. What is the best way to achieve this? I was thinking some javascript code, but I'm not sure how to apply it within the squarespace design framework. If someone is able to provide some pointers, that would be much appreciated. -Will
  24. Site URL: https://lily-oboe-g479.squarespace.com/ Password is "1" Hi, I have no idea how to install Rolly.js to my site. I want to have smooth scrolling but I know nothing of javascript. Here is the website where you install it: https://rolly.maj.digital/ Here is where you install it: https://mickaelchanrion.github.io/rolly/guide/ Someone please help me Thanks, - Kevin
  25. I've been trying to embed my Convertkit form into Squarespace. I do have a Squarespace business account and have followed the steps of embedding a form using both the javascript and HTML. For some reason when I paste the code, neither is working. It is not even showing the "script disabled." It is just pasting the actual code into my code block. Does anyone know why this is happening? Anyone have a solution or workaround that does not involve Zapier? Appreciate any help!
  • Create New...