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
  • Replies 2
  • Views 3.2k
  • Created
  • Last Reply

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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • 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.