Jump to content

How to create a library/folder of images?

Recommended Posts

This is truly a stupid question, but I searched and searched and I cannot find a simple answer. The question is this: I'd like to upload a bunch of images not via the image block editor. I want to do some custom coding (which is ironic because I can't even figure out the most basic of things, like uploading images to a folder), which will have me pointing to various images.

Currently, the only way I can figure how to do this is to upload images to a page (just for the sake of getting them online), navigating to that page outside of the editor, and then right clicking and finding the image URL, which is some horrendously long URL made up of a billion random characters, and then copying that and going back to the editor.

FOR EXAMPLE. 

I am trying to create a simple thing where an image is displayed. You mouse over it, and the image "flips" to another image. You move the mouse and it moves back to the original image.

I searched the Forums for this and found another Squarespace user who has a simple code for this exact thing. Notice his very clean image filenames in this very simple code:

<img src="https://agiphoto.com/_team_portraits/jpegs/BW/Chris.jpg"

onmouseover="this.src='https://agiphoto.com/_team_portraits/gifs/Chris.gif'"

onmouseout="this.src='https://agiphoto.com/_team_portraits/jpegs/BW/Chris.jpg'">

Now, here's me trying the same thing but with my (placeholder) images:

<img src="https://images.squarespace-cdn.com/content/v1/5872b0ea46c3c4c349f4cd05/1584999684943-20H8L9NGGJJX295OB6O7/ke17ZwdGBToddI8pDm48kP1tQSNpMG7kWETQe-RWJBZZw-zPPgdn4jUwVcJE1ZvWhcwhEtWJXoshNdA9f1qD7Xj1nVWs2aaTtWBneO2WM-vR5pUyDysrzG5BR2keipYDf7mXfb9-btHQuiwbAleQMQ/EXPERTISETEST.jpg" 
onmouseover="this.src='https://images.squarespace-cdn.com/content/v1/5872b0ea46c3c4c349f4cd05/1584999712681-HD3QQJKYET5LCC0GIJHT/ke17ZwdGBToddI8pDm48kP1tQSNpMG7kWETQe-RWJBZZw-zPPgdn4jUwVcJE1ZvWhcwhEtWJXoshNdA9f1qD7Xj1nVWs2aaTtWBneO2WM-vR5pUyDysrzG5BR2keipYDf7mXfb9-btHQuiwbAleQMQ/EXPERTISETEST-FLIP.jpg'"
onmouseout=this.src"https://images.squarespace-cdn.com/content/v1/5872b0ea46c3c4c349f4cd05/1584999684943-20H8L9NGGJJX295OB6O7/ke17ZwdGBToddI8pDm48kP1tQSNpMG7kWETQe-RWJBZZw-zPPgdn4jUwVcJE1ZvWhcwhEtWJXoshNdA9f1qD7Xj1nVWs2aaTtWBneO2WM-vR5pUyDysrzG5BR2keipYDf7mXfb9-btHQuiwbAleQMQ/EXPERTISETEST.jpg'">

The process doesn't work and the image file thing is just a mess. So, there must be a way for me to simply create a folder called "flips" and then drop my images in there, right?

 

 

Link to comment

You can upload images to your site with this guide. https://support.squarespace.com/hc/en-us/articles/205813928-Uploading-and-managing-files

then the image has url: yoursite.com/s/image-name

eg: beaverhero.com/s/beach.png

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.