Where do I upload JavaScript files?

I contacted Squarespace Support and they provided a helpful answer, which I expanded open by organizing my scripts onto a single page:

1. Add a new page called 'JavaScript Files' [optional]
2. Go to Page Settings and Disable the page [optional]
3. Add a Text Block
4. Add some text, preferably the name of your JavaScript file, like Sample JavaScript
5. Select the ‘Sample JavaScript’ text and make it into a Link
6. Click Files on the Link menu
7. Click in the white space and select the file from your hard drive (or drag it onto the space from your hard drive) - I’ll use javascriptfile.js for this example
   
8. Click in the Text Block again, and click on the Link Text – Squarespace automatically displays the URL it points to when you click on it, which should be /s/javascriptfile.js [whatever the name of the file your uploaded is]
9. You can right click and ‘Copy Link Address’ to make sure you have the correct URL
10. Go to your Code Injection (either the Page’s Code Injection or your site-wide Page Injection) and insert the code:

    <script src="/s/javascriptfile.js"></script>

    Using the name of the file you just uploaded instead of javascriptfile.js of course.

You can keep adding JavaScript files, and it appears Squarespace automatically adds them to a javascriptfile.js directory.

No need to link scripts via Dropbox or include the entire script in the Code Injection.

You can use this to upload any file as well, but most other things have a place (CSS files and image get uploaded in the CSS Upload File area, etc.).

Source: Creating a Text Link

this is a ridiculous workflow to simply upload files

I don't disagree with you. Squarespace 6 is trying to streamline each file upload type to be more natural, but in the end you need a guidebook just to find out where to upload everything. Squarespace 5 was folder based which was not as 'cool' but definitely more usable.

I consider this method a hack until Squarespace 6 gets updated with a more useful file upload system. I think they can have various 'upload points' but it should all be easy. Folders work well, and we use them for a reason.

@CedricLor Do any of your uploaded files have more than one '.' in the filename?

If so, there is a file renaming bug in Squarespace that strips out all but the last '.'

eg. myscriptname.min.js gets uploaded to /s/myscriptnamemin.js

@silvabokis

Just had to wait one night and the files are now correctly referenced and accessible. Weird squarespace.

Thanks for your help!

Not sure why, even though this makes perfect sense it didn't work for me. Copy and paste the js file content into code injection area works perfectly.

Neither of these worked

Upon looking at the source in Firebug when I expanded my

There should be my script as far as I am concerned. Any ideas?

Hi Rsimko

Having the same issue as you, but more messie. Some of my files appear to have been uploaded and load on call. Other don't load, even they seem to have be uploaded. Very messy.

Mario Campos, did you ever manage to have Waypoint up and running on Squarespace? I am desperately fighting but can't seem to find a way out.

Thanks

Hi @silvabokis, I noticed the bug, but this does not change anything.

Half of my uploaded files are loaded and the other half appears to have been uploaded on their servers but does not load with the pages.

From what I see, the files that are loaded are the no-framework Waypoints files while the JQuery Waypoints files do not load. They probably do not load because they cannot load the JQuery file, even this one is loaded...

So feed up with Squarespace...

Anyone know if this will work on a product page in the product description? I need to inject JavaScript and be able to call that JavaScript from within a product description.

Thanks

@thisisben I see no reason why it shouldn't work.

However, be careful of the bug mentionned by @silvabokis and give squarespace some time (one night in my case as mentionned in my earlier post) for the files to be correctly uploaded and, more important, loaded.

This works, I was having issues getting a muse parallax page with svg files working and for some reason uploading the styles and scripts via developer mode was not working so I tried this method and it actually works. So Happy.

when i follow these steps, the file name is 's/fgojojouerpepw' (or something like that). However, when i try to reference it in my header by page-header-code-injection, like such, ', it doesn't find the file. What am I doing wrong?

Just realized the sftp command line issue was I didn't include the site folder (as is mentioned in the page I referred to)

So, setup... I used a ssh config file since I couldn't quickly figure out how to provide a username with an ampersand in it to sftp command line program.

This example is good for GNU Linux, BSD etc will vary slightly for Windows.

# ~/.ssh/config

Host SQUARESPACE

HostName dev.squarespace.com

Port 2030

User your-user-name

And then at the command line just run the following sftp command

> sftp SQUARESPACE:/your-site-name

Didn't see it mentioned here, see details about Developer Mode on http://developers.squarespace.com/initial-setup/. Don't know when it was first made available so it may be a recent addition.

In short, squarespace offers SFTP access to the template code for your site. It also provides a GIT repo of the template code, nice!

Note: I successfully used FileZilla to establish the SFTP connection, using sftp at command line would connect but was then immediately disconnected... didn't bother investigating further to figure out what was going on.

thank you so much for this IT WORKED!!! You made my night!

Yes! This was the problem for me - (an hour wasted). Thanks!!

Using this method, I am getting

Do you know how to resolve this error? Thank you.

I am hoping that the @Mario Campos answer from November 30, 2012 is still valid.  If it is valid, I would love to hear some input from @SQUARESPACE about whether users should still expect to wait 24 hours for uploaded files to be accessible/run when referenced on other pages, as observed by @CedricLor.  

My goal is to upload files to an unlinked and disabled page so that I can reference API keys securely rather than write those keys directly into a code block.  Would disabling a page interfere with file references?  Toggling it enabled/disabled does not seem to make a difference.