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. Site URL: https://rcaarc2021.squarespace.com/ Hi there, I am creating a multilingual site (English, French) and have read that having 2 different footers is possible using CSS and maybe Javascript to hide Lang 1 when user is on Lang 2. I am using Brine and on 7.0. Can someone help me out here? Site pw rcaarc2021 Thank you!
  2. Hello, I'm hoping that someone out there may be able to assist me with getting this configured and working properly. I have a form with a couple of form fields that I have hidden and are coded to only appear based on certain answers from the previous question. For example: "Lifetime Member?" Yes = No Follow Up No = Follow Up My problem is that all of the information that we are asking requires an answer. I have Jquery installed and running but if I leave the required tag on the hidden fields then people will not be able to submit their answers. So I need to remove the required field from Squarespace but keep it required through Javascript and Jquery only if the questions are showing, if not then they would not be required and folks could submit their answers. I'm not sure if what I am trying to do is possible giving the limitations, but I'm hoping that someone out there may be able to assist me. Below is a copy of the code that I am using: <script> $('#radio-yui_3_17_2_1_1618750827688_273431 input').click(function() { selection = $(this).val(); if (selection == 'No') { $('#date-yui_3_17_2_1_1618750827688_222457').show(); } else { $('#date-yui_3_17_2_1_1618750827688_222457').hide(); } }); $('#radio-yui_3_17_2_1_1618755633959_63568 input').click(function() { selection = $(this).val(); if (selection == 'Yes') { $('#date-yui_3_17_2_1_1618755633959_64259').show(); } else { $('#date-yui_3_17_2_1_1618755633959_64259').hide(); } }); </script>
  3. Hello. I'm trying to have my intro text on my homepage be able to auto translate to Farsi every 5 seconds. My intro: Hello! I’m Name, a user experience researcher. Check me out below. The translate: سلام! من شان هستم ، یک محقق تجربه کاربر. در زیر من را بررسی کنید I'd like these to swap automatically in a fade transition every 5 seconds. What would my CSS look like? For reference, I've attached an image. Thanks!
  4. Hello I have a Calendly Integration on a webpage that doesn't load properly unless I disable AJAX loading. The thing is that I want AJAX loading enabled, so I would like to paste some code in the heading of the page using Page Injection that disable AJAX loading for this single page. Can anyone help me with the exact code needed to do this? Thanks in advance
  5. Site URL: https://mouse-trout-epjy.squarespace.com/shop-all/p/thomas-wilson-cello-sonata-download OK, this is the problem I have: I have 300+ products on this site and I would like to add an accordion dropdown showing delivery info to all product pages. I have this code already working on other pages using JS and a markdown block: <script> $(document).ready(function(){ $('.markdown-block .sqs-block-content h3').css('cursor','pointer'); $(".markdown-block .sqs-block-content h3").nextUntil("h3").slideToggle(); $(".markdown-block .sqs-block-content h3").click(function() {$(this).nextUntil("h3").slideToggle();}); }); </script> I know that I can do this via the additional info section on products but obviously would need to do that 300+ times which is a pain. So I'm trying to figure out if there's a way I can add a markdown/code block class to all product pages so that every product page will automatically have it. It also means that my client will not have to add the code block when they add products. Any ideas? Thanks in advance 🙂 site pw: spong123
  6. Site URL: https://www.divinecompasshealing.com/playlists I used a code block to add this GetResponse form. I selected HTML and unchecked display source. In production, the form works. However, when I click Edit on that page, nothing happens. I cannot edit it. If I do an incognito window with /safe on my url (so scripts disabled), then I can edit the page. Is this normal? Or what am I doing wrong? <script type="text/javascript" src="https://app.getresponse.com/view_webform_v2.js?u=xxxxx&webforms_id=xxxxx" data-webform-id="xxxxx"></script> And any plans for squarespace to have a formal integration with getresponse?
  7. Site URL: https://www.kawprairie.org I'm looking to have a section only show up on Sundays. I work at a church and there is a portion of the site that people use to check in on Sundays. I was curious if there was a way using Javascript to have it hidden on Monday-Saturday without having to do it manually?
  8. Site URL: https://wasteland.site/ Hi all, I am new to Squarespace but have experience with Javascript and am looking for some advice. As the site I am working on features photo submissions from different locations, I want to allow visitors to use a dial to see more submissions from that same location. The dial will be composed of thumbnails of photos from those different locations with an arrow pointing at the center top to show which one is selected. The selected thumbnail will set a label in the center of the dial displaying the location. When the user clicks on the selected thumbnail, it will link them to another page in the site hosting all the photos from that location. Would you guys know if this is possible to implement and if so, any good starting points? You may assume that I have local access to all the photos and their locations and that the other pages featuring the photos from each location are already built and referenceable within the site. Thank you very much! Josh
  9. Site URL: https://gregorylassale.com/ Site URL: After double checking all the code on my site, I am left with a few lines of code in the header whose purpose I can't remember. <script> window.oldSetTimeout = window.setTimeout; window.setTimeout = function(code, delay) { if (delay == 5000) { delay = 5500; } var retval = window.oldSetTimeout(code, delay); return retval; }; window.oldSetInterval = window.setInterval; window.setInterval = function(code, delay) { if (delay == 5000) { delay = 5500; } var retval = window.oldSetInterval(code, delay); return retval; }; </script> Could a dev please interpret the code above for me and describe what it does? I want to make sure it belongs to an old plugin/feature I no longer use and that it's safe to delete. Thanks!
  10. Site URL: http://mimiceramics.com Hello, trying this again now that I have looked up more info and figured out better how to ask what I'm looking for. On Brine, the default seems to be that the navigation dropdown appears on hover. However I would like to change hover to onclick. I'm not seeing a lot of CSS options, so I'm guessing I might need javascript? Are there any resources on where to find the coding I need for this? Thank you!
  11. Site URL: https://geckovacations.squarespace.com/ Password: 12345 on the Home Page there is some code for a property search widget. It doesn't show up when the site is live nor in edit mode in Squarespace 7.0 but works fine when I tested it on a 7.1 template. Attached is the error shown. Can anybody please tell me exactly what to do? I am not a coding expert.
  12. Site URL: https://www.athlytic.io I'm having an issue with a client site where I am attempting to change the placeholder text on a newsletter block. I have added the following script to my code injection footer, however, it is not changing: <script> if (document.querySelector("#block-yui_3_17_2_1_1616980347389_14059")) { document.querySelector('.newsletter-form-field-element[name="fname"]').placeholder = 'Name'; document.querySelector('.newsletter-form-field-element[name="lname"]').placeholder = 'Phone Number'; document.querySelector('.newsletter-form-field-element[name="email"]').placeholder='Email Address'; } </script> I'm assuming, it's because there is an embedded script within a section on the homepage that is being ran, which hides a portion of content within that section until a button is clicked. The following code has been applied to the code injection for the home page specifically to get the button to toggle the content on and off <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script> <style> .button-section{text-align:center;border-radius:6px;width:350px;display:flex;flex-flow:row wrap;align-items:center;margin:auto;box-sizing:border-box;padding-bottom:35px} .button-single{text-transform:uppercase;font-size:.7em;text-align:center;letter-spacing:.2em;vertical-align:middle;box-sizing:border-box;width:50%} .button-left{border-top-left-radius:10px 10px;border-bottom-left-radius:10px 10px} .button-right{border-top-right-radius:10px 10px;border-bottom-right-radius:10px 10px} </style> I need both scripts to work but my knowledge of Javascript is extremely limited and I am struggling getting the newsletter block to display the correct placeholder text for the client. Any and all help is extremely appreciated.
  13. Site URL: https://www.topawardsasia.com/en/topawards-winners Hello everyone, I need your help to see what is wrong with the search bar in my code. It is working find if you look it up in mobile. But suddenly the desktop version doesn't not show the icon that we can click to show the search bar. It is the black bar that has category besides it Link
  14. I added a <script> tag to my site using the code block. The script was automatically generated by Caspio DataPages to display portions of my database. The content displays just fine and functions as needed. The site works and navigates fine. However, I cannot edit the pages that have the Javascript on them. When I go to those pages, there is no edit button to click to enter editing mode. Pages without the code block added can be edited, but not the pages with the Javascript added via a code block. Not sure if it is important, but I am currently in a free trial (want to make sure this will work before purchasing) and after entering the code it prompted me to enter Safe Mode. Any help is much appreciated.
  15. Site URL: https://www.prescribinglife.com/thubs I am attempting to include a custom Google map via Google Maps Javascript API. My code block (containing my HTML code) works in Save Preview Mode. However, when viewing the live page (https://www.prescribinglife.com/thubs) there is no map. Any ideas what I am doing wrong? Could it be a DIV height / width size issue? Thanks in advance for any help on this issue. Here is the code in my code block: <!DOCTYPE html> <html> <head> <title>Simple Map LER</title> <script src="https://polyfill.io/v3/polyfill.min.js?features=default"></script> <style type="text/css"> /* Always set the map height explicitly to define the size of the div * element that contains the map. */ #map { height: 100%; } /* Optional: Makes the sample page fill the window. */ html, body { height: 100%; margin: 0; padding: 0; } </style> <script> let map; function initMap() { map = new google.maps.Map(document.getElementById("map"), { center: { lat: -34.397, lng: 150.644 }, zoom: 8, }); } </script> </head> <body> <div id="map" style="width:100%; height:100%"></div> <!-- Async script executes immediately and must be after any DOM elements used in callback. --> <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyA3ywKcIzCvF9etVLjmV4eirtvltibvi_k&callback=initMap&libraries=&v=weekly" async ></script> </body> </html>
  16. Site URL: http://www.lerligisa.com Hi, I created a multilingual website (French, English), and I would like the notification to clients email to appear in the language of the website they are navigating on, and making their order from. For example, if a French user is ordering on the French version of the website, I would like his confirmation email order to be in French, and not in English. Same thing for the confirmation shipping order email, the payment declined email, and the confirmation of subscription to the newsletter etc... Squarespace only allows me to use one language at a time for now. So all my notification to clients are in English. How can I add a language tag on my website? Thanks in advance! Eva
  17. Site URL: https://orbitcoffee.squarespace.com/ Hi, On my site, the nav consists of "Beans, Roasters, About Us" and the cart which is not coupled with the nav. Just wanted to know if this was possible, I am trying to replace the "stock" cart icon and " other available cart icons offered by the template with my very own icon that I have a url to. I am using: Version 7.0-Brine family(Brine Timeplate) I have uploaded my custom icon/image into Design > Custom CSS > Manage Custom Files which gives me a url, lets say this is https://examplepic.png I have tried setting custom CSS but it does not work: .Header .Cart .Cart-label { background-image: "https://examplepic.png" } I was wondering if I could maybe perhaps use the "Inject Code" functionality and target the .Cart-label class or the appropriate class and replace with something like <img src="https://examplepic.png" /> Other documentation I have looked into: https://support.squarespace.com/hc/en-us/articles/212838128#toc-header https://insidethesquare.co/carticon Expectation: To be able to use my custom cart icon and still preserve the cart counter and all cart functionalities Please help if this is possible, or whether this is a limitation to this customizing this template. Thank you in advance!
  18. Site URL: https://www.scunci.com/ HI everyone, I add custom form for my product and I want show that form under title, but that form loading in lightbox after click on "add to cart" button. How can I load that form after title ?
  19. Site URL: https://mayellre.squarespace.com/rentals Howdy SQSP forum! I'm looking for a way to redirect or change the link of my products on my products page from the automatic product pages they link to, to other individual pages I have already created. I'm using products for the rentals because I will be using them with the "Advanced Map Block" plugin & "Universal Filter" from Michael at squarewebsites. These are not totally integrated yet though. I've done a lot of reading on the forum and I think it will require javascript?? 😅 Any and all help will be greatly appreciated!
  20. Hi, I am injecting a js script using a code block. The block draws a canvas and displays stuff on it. The problem I am having is that the canvas I draw appears in a totally wrong place. For reference, I want the canvas to appear where the red box is, but it appears all the way down close to the page's footer. What am I doing wrong? The html code is super simple. it goes: <div> <script> // STUFF IN HERE </script> </div>
  21. Hi, I am trying to add a simulation to my website. I have everything running with javascript and an index.html on my local workspace, but am wondering how to place it in an online page. I have tried using code injection, but have failed miserably. I am using the p5.js library for visualization and a local script called Boids-2D . Does anyone know where and how to put this? Sorry if it is super easy, but I am very new to web development. Thanks! This is my local index.html code <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>2D Boids</title> <script src="https://cdn.jsdelivr.net/npm/p5@1.1.9/lib/p5.js"></script> <script type="text/javascript" src="Boids-2D.js"></script> </head> <body></body> </html>
  22. Site URL: http://www.studiofurks.com Under the portfolio title, I've added a brief description of the project. I've done that bit but I don't know how to style it / change font and size. I heard it would have to be javascript I believe. This is the code that I've used to put into the footer injection: <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.0/jquery.min.js"></script> <script> $(document).ready(function() { var title = document.querySelectorAll('h3.portfolio-title'); for (var ss = 0; ss < title.length; ++ss) { var item = title[ss]; item.innerHTML = item.innerText.replace(/#/g, '<br/>'); } }); </script> On the actual post of the image I've used: Title#Description I just need help how to style this. I believe it's Javascript, if someone could help then I'd be grateful. Thanks.
  23. Site URL: https://talusandolsek.com/work/outdoors-t2cgl I was able to add captions to my gallery in light box following another forum, but I want the captions to be aligned to the left of the image. My issue is that the images use Content-fill: contain so the image is dynamically resized so I don't know how to align the caption with the end of the photo and not the padding on the side. Any help with would be appreciated!
  24. Site URL: https://wolf-kumquat-dpgn.squarespace.com/ Hi all: Looking for a solution to add a second/additional logo to the top left of the header. See university logo on the left in the mock-up for what I am trying to achieve. Ideally this logo would click through the the university website: https://www.kuleuven.be/english/ Site: https://wolf-kumquat-dpgn.squarespace.com/
  25. Site URL: https://desireeeast.com/ready-to-zen-out Hello - are there any genius coders that could help steer me in the right direction? I'm having trouble with one of my pop-up forms when I embed them onto my Squarespace site. They have worked in the past and now they are not working.I inserted this code in the advanced settings in Squarespace:<script async id="_simplero_landing_page_js_75511" src="https://desireeeast.simplero.com/page/75511.js"></script>I added the manual trigger to the BUTTON that would make the form pop up:<a href="#simplero-landing-page-75511">Show the form</a>PLEASE NOTE: I only addedsimplero-landing-page-75511to the button, because that is what worked successfully in the past.I expected the form to pop-up, but it no longer does that.Here is the website where the form should pop up when you press the button "Grab Your Free Video Lesson Now!":https://desireeeast.com/ready-to-zen-out Thanks in advance for your help and guidance, Desiree
  • Create New...