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

Search the Community

Showing results for tags 'javascript'.

More search options

  • 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
    • Feedback on Your Site
    • Images and Videos
    • Pages and Content
    • SEO and Marketing
    • Site Design and Styles

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



About Me



Found 95 results

  1. Hello! I have basic knowledge of web desing, started one month ago, but ive learnt enough HTML CSS and JavaScript to make my own code with the following function: 1.- There is a play button to reproduce 5 (or any number) tracks simultaneously or pause them simultaneously 2.- There is 5 (or any number equal to the number or tracks of step 1) range sliders controlling the volume, the result is an online mixer of a track divided in drums, guitars, bass, etc... or a soundscape track divided by bass, mids, treble... I just made a trial version on a free website (i dont know if i am allowed to post links but here it is): https://pitibo.000webhostapp.com/ You can see the code i wrote inspecting that link. I just wanna know if would be possible to implement that specific function of JavasScript on SquareSpace, thank you!
  2. Hello! This might be a hard thing to get help with and maybe I should not be asking this question here but I decided to give it a shot anyways. Feel free to answer, all answers are appreciated. I visited a website which had a very cool animation of letters being typed. The website is: https://brusewitzstudios.com/ I wanted to make something similar one my homepage which is https://www.mediaqmarketing.com/ I was wondering if there are any talented coders out here who already have made something similar and could possibly share a code. Thanks a lot! Kind regards Dhruv
  3. I'm trying to create a 'download your free copy...' form for a PDF, with a 'Download' button that both stores the data in a Google spreadsheet (done) and downloads the document. I can add a simple download link in the post-submit HTML, but this is an extra click for the user and potentially confusing after they've already clicked 'Download'. So, I'd like the PDF to be automatically downloaded when the form is submitted. I've tried adding some Javascript, e.g. as per this thread, but nothing has worked. Is there some way to achieve this? Thanks!
  4. I have a password box that is working but the user has to enter the password in twice in order for it to connect to the corresponding page. I'll post the javascript below. I would like for the user to only have to enter the password in once. I have no idea why this is happening. // JavaScript Document /* * Change the passwords and urls here * Make sure the passwords and urls are in the same order */ const passwords = ["7654", "6243", "video", "locked", "house", "road", "crescenthotel", "three", "sudoku", "seven", "book", "pig", "before", "photographs"]; const urls = [ "house-end", "locked-end", "video", "link-to-locked-game", "link-to-house-game", "composites-to-road-to-page-number", "crescent-hotel-page-number", "sudoku-answer-to-page-number", "sudoku-page", "video-page-number", "new-page", "list-of-page-numbers", "photographs-page-number", "photographs-puzzle" ]; // Get submit element const submit = document.getElementById("submit"); // When form is submitted, run passwordinput function submit.onclick = passwordinput; // Function that handles form action function passwordinput(e) { e.preventDefault(); // Value in password input let password = document.getElementById("pass").value; // Makes password lowercase in case of caps lock if (passwords.includes(password.toLowerCase())) { // Get the index of the password const index = passwords.indexOf(password.toLowerCase()); // Redirect to different page based on the index location.href = urls[index]; } else { // Display a message that the password was wrong let div = document.getElementById("text"); div.innerHTML = "<p>Try again!</p>"; } }
  5. Hi everyone, I bought a plugin from Squarestud.io and it appears that they dont respond to anyone's emails/facebook/instagram - I assume they have gone bust. Anyway, I need to tweak the plugin and I am not very good at .js and would appreciate some help. The plugin is a logo loading screen using the site's logo. I am wanting to replace the image source (the existing site logo) with a gif that is stored in the site's CSS stored files - URL below. Any help is really really really appreciated. Thank you, Rob working site: https://pepper-clarinet-ctnt.squarespace.com/ GIF: https://static1.squarespace.com/static/5d9db9630e0cb109b5331185/t/5db877bc05d8093cb6fbfe15/1572370384602/mrnice-smiley.gif Code Injection: <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <div class="logoload"></div> <script> $(function() { var loadLogo = $('header').find('img').attr('src'); $('.logoload').css('background-image', 'url(' + loadLogo + ')'); }); </script> <style> .logoload { /* SET BACKGROUND COLOR */ background-color: #fff; /* SET BACKGROUND SIZE */ background-size: 90px; position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background-position: center; background-repeat: no-repeat; } </style> <script type="text/javascript"> $(window).load(function() { $(".logoload").delay(500).fadeOut("slow"); }) </script>
  6. Hi guys, I have a problem with my calendar widget from booking. com. I integrated the widget and it’s working just fine on most of the browsers and mobile but not on safari. I can’t select any dates on safari. I customized the widget with CSS but I cant make it work for safari. I updated my Mac now just in case the problem might be from there if not I don’t know how to fix it. Please help www.camayaan.com the widget is just on home page .bb-calendar-widget input[type="date"] { appearance: none; -webkit-appearance: none; position: relative; clip-path: inset(0 17px 0 0); }
  7. hi, Is it possible to alter the behaviour of Forte's slideshow through custom javascript? Right now the slideshow's autoplay doesn't work very well in combination with the arrows: clicking an arrow right before the transition doesn't reset the slideshow's timer, resulting in 2 transition with almost no delay. All of the template's javascript is compressed, which makes it hard to try and 'override' this with custom javascript. kind regards, Staf
  8. Hello, I'm new to squarespace. I'm trying to use the code block feature to run some very simple Javascript, but I'm not able to. The script is like this: <script> alert('hello'); </script> This is supposed to display a popup with 'hello' in it. But it doesn't. Reading the article on code blocks: https://support.squarespace.com/hc/en-us/articles/206543167-Code-Blocks ...tells me that Javascript in code blocks is a premium feature only. This *might* explain why it's not working for me, but I'm also wondering if I'm misunderstanding the point of code blocks. The article describes the point of code blocks as "rendering code". So I'm wondering if it is only meant to display code on the screen, NOT for running code. (This would explain why my Javascript is always displayed on the screen and I don't have the option to hide it). Thanks.
  9. 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.
  10. Anyone know how to do an animation like the one in the website header here? https://timtigner.com/
  11. Does anyone know how I could go about adding a input field on the header of the page? I am trying to integrate squarespace with another site for our company, and one of the first steps is this.
  12. Hello, I am attempting to add a custom background to my squarespace site. Specifically a valnajs background that can be found here: https://www.vantajs.com/?effect=net#(backgroundAlpha:1,backgroundColor:13223885,color:7370174,maxDistance:24,points:6,showDots:!t,spacing:17) I can successfully add this javascript and get the resulting image when I use a code block and the following code: <script src="three.r92.min.js"></script> <script src="vanta.net.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/100/three.min.js"></script> <script src="https://www.vantajs.com/dist/vanta.birds.min.js"></script> <div id=vantajs></div> <script> VANTA.BIRDS({ el: "#vantajs", }); </script> However, this just inserts the image in that block and does not actually make the image the background of my page. I have tried many ways through the page code-injection feature to add this to my website, specifically the section-background html element, but nothing has worked. Here is an example of one of the methods I am trying when using the page code injection: <script src="three.r92.min.js"></script> <script src="vanta.net.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/100/three.min.js"></script> <script src="https://www.vantajs.com/dist/vanta.birds.min.js"></script> <script> (function(){var x = document.getElementByClassName("section-background"); x.setAttribute("id", "vantajs")})(); </script> <script> VANTA.BIRDS({ el: "#vantajs", }); </script> Any help here would be greatly appreciated.
  13. I am using source code (not iframes or scripts) from Jotform to place forms in code blocks on my page, but whenever I do this on Squarespace 7.1 (not a problem in earlier versions), I now see a litany of console errors when I load the page, and I lose the ability to edit the page, forcing me to delete the page to redo my work. It also removes images from the page, though the div remains. I have jQuery placed in the global site header so I have access to its selectors. When I try to use jquery selectors on the console on jotform pages, they also break. Below are the errors I see in console: Any advice anyone might have to solve this would really help me out. I appreciate any guidance I can receive.
  14. Could you share the process of customizing page, the Cart and order page, using JavaScript . Could I write JS scripts on the ORDER and CART pages.
  15. 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?
  16. Hello, I would like to edit the following Javascript code to start automatically, when somebody lands on my page. The code is for a simple counter from https://styleddigital.com/blog/2017/5/10/how-to-add-an-animated-counter-in-squarespace. Unfortunately this question has not yet been answered there. Maybe you can help?
  17. I am looking to customize an order email - specifically order confirmed & fulfilled, based on which product my customer has purchased. I have a client who is selling a subscription based package. Once the customer orders, they are to receive an email with a link to an instructional video on how to use the package. I am hoping that I can save her a step in having to manually email her customers this link by being able to add the link directly to the order confirmed and order fulfilled email. Something like: {.if hasPhysicalProductId=xxxxx} You will find your instructional video tutorial for {ProductName} here: www.linktopagewithvideo.com {.end} {.if hasPhysicalProductId=ccccc} You will find your instructional video tutorial for {ProductName} here: www.linktopagewithvideo.com {.end} There is obviously the chance that someone could buy multiple products so I need to be able to repeat the statement multiple times and would prefer to put the product name within the sentence so they know which link is specific to which product. Any help would be very appreciated! Thanks, Kaila
  18. I'm trying to add a JavaScript to a button to bring up a BackerKit pre-order store. An example of what I'm trying to do (though I don't think it's a Squarespace site): top right corner of https://lynqme.com/ With the code provided below from BackerKit in a code block I was able to get things to work with clickable "Pre-order Now" text... <script> (function() { var script = document.createElement('script'); script.src = 'https://backerkit.com/assets/preorders.js'; script.async = true; var entry = document.getElementsByTagName('script')[0]; entry.parentNode.insertBefore(script, entry); })(); </script> <a href="#" data-bk-preorders="https://virtueathletic.backerkit.com/overlay_preorders">Pre-order Now</a> ...and with my own fumbling through additional code I was able to get the text to kind of be a button. <script> (function() { var script = document.createElement('script'); script.src = 'https://backerkit.com/assets/preorders.js'; script.async = true; var entry = document.getElementsByTagName('script')[0]; entry.parentNode.insertBefore(script, entry); })(); </script> <div align="right" class="sqs-block button-block sqs-block-button"> <a href="#" data-bk-preorders="https://virtueathletic.backerkit.com/overlay_preorders" class="sqs-block-button-element—small sqs-block-button-element">Pre-order now</a> </div> Unfortunately I can't get the button to look, function, and align like my regular button blocks (blue/white & white/black on hover) as seen in the attached image (blue button block on top - black JavaScript "button" on bottom.)
  19. I added a bit of matrix text to my homepage. But, I want to slow it down a little. Does anyone know how to do this?
  20. I have a weird issue whenever I try to use the innerHTML function in an embedded block. The function does not seem to work properly when multiple blocks are embedded on the same page. Multiple blocks all display the same image even if the code is different. I don't believe this is a coding issue on my end because if I replace innerHTML with textContent, the data pulls correctly. Anyone else have this issue? Images have been attached for clarity. This is the exact same JS, but one uses getElementByID('element').textContent, and the other uses getElementByID('element').innerHTML You can see that the textcontent pull has different data while the innerHTML returns identical data.
  21. Does anybody know how to do a header like the one on this website? https://timtigner.com/
  22. I am looking for a blog post counter for my website. The blog on my website focuses on cigar reviews and each new post is a new cigar review. I would visitors to know how many cigars have been reviewed on my website in total using a blog post counter or the likes. Is this possible?
  23. Anybody have any idea how to add h2 matrix text to a single page (home page)? Thanks!
  24. Hello. First time here on the forum. I looked through plenty of previous threads, but didn't find the answer to my specific challenge. I built a site recently, and all was fine until today, when I added custom code to have a booking window open within the same frame. It worked fine on the testing page, but as soon as I added it to the other pages (confirmed clean/accurate copy and paste), it stopped working AND now I can no long add links within text fields. I've used the required <style></style>, and have tested by html in a w3schools.com test window. Here is a link to the test page: https://trout-lilac-h8f3.squarespace.com/home2. The navigation works, so other pages can be visited. Can anyone see what I've missed or done wrong? Thanks, in advance.
  25. Dear Community, I am in the process of making my website Multilingual. For the moment I have set up a test Squarespace website to experiment on, though the implementation on my live website will be the same. Website: http://lychee-sheep-23gt.squarespace.com/ Password: 123456789 Template: Brine I have followed the guide found here https://www.bradgood.net/articles/multi-language-content-on-any-squarespace-template with great success. However, I am stuck on the following: On the mobile / tablet view I would like the Language switcher to appear on the bottom of the mobile menu and not in the header... For reference here is the code I have used so far. CODE INJECTION FOOTER: CUSTOM CSS: Please take note: I am not a coder. I can understand instructions on code and modify them so they work for me.... If somebody could please help me with this, it would honestly make my day! Thanks Max
  • Create New...