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

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?

 

 

Share this post


Link to post

I suggest you do this with images that are uploaded as files on Squarespace not onto a page, then use the file URLs. The sample you are showing, the images are on a photo hosting site with simple urls. Might make it easier to put it together. 

 

Edited by derricksrandomviews

Share this post


Link to post

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

 


COVID-19: Free priority support for all users (29/03 - 30/04).

You can tag me (@tuanphan) or send to my email.

 

Share this post


Link to post

Create an account or sign in to comment

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


×
×
  • Create New...