InstantMonsters
-
Posts
7 -
Joined
-
Last visited
Content Type
Forums
Gallery
Blogs
Events
Store
Downloads
Profiles
Posts posted by InstantMonsters
-
-
Gotcha, I figured I was doing something dumb. It works now with your image, but when I replace it with the location for the one I want (http://www.chrispaynemakeup.com/colors-1.jpg) it fails to load, just a blank space.
Also is there a way to modify this so that it works across all of the products, or do I need to modify and re-enter the code for each one?
-
Thank you for this! I'm afraid I'm a luddite with CSS, my web knowledge ends at HTML from the mid-2000s. When I entered the code I got this:
Here is the exact text as it appears in the "manage form fields" for the form, cut and pasted:
QuoteIf ordering a pre-painted prosthetic, please enter the skin tone you would like from the following options. All other highlights, shadows and detail work will be based on the skin tone chosen.
If ordering an unpainted prosthetic, leave this field blank.
/* Beaky lightbox img */
body#item-5f4db8566c67441473286aeb .lightbox-inner .description:after {
content: "";
background-image: url(http://www.chrispaynemakeup.com/colors-1.jpg);
background-size: cover;
background-repeat: no-repeat;
width: 100%;
height: 200px;
display: block;
}I assume I probably have one character out of place or I was meant to change something other than the image URL?
-
Almost all of the products use the same form, but the one in the screenshot is here: https://www.instantmonsters.com/shop/p/beaky
-
Site URL: http://www.instantmonsters.com
On my website I offer the option of pre-painting the prosthetics that customers order. When they add an item to the cart, a form pops up with color choices. Originally I had linked an image from an outside source since I couldn't figure out how to do it within Squarespace. It worked fine for a long while, but now I'm finding that image doesn't display.
Here's the original text I inputted to the form:
QuoteIf ordering a pre-painted prosthetic, please enter the skin tone you would like from the following options. All other highlights, shadows and detail work will be based on the skin tone chosen.
If ordering an unpainted prosthetic, leave this field blank.
<img src="http://www.chrispaynemakeup.com/colors-1.jpg">
It used to display the image just fine, but now it just shows a broken image icon (see attached screenshot).
How can I fix this? Squarespace offered no help other than a link to this forum. If I have to I can add the same color sample jpg to each product's photo gallery, but I'd rather not have to go that route. Every time I add a new color I'd have to update every item I have in stock.
Adding an image to a form
in Customize with code
Posted · Edited by InstantMonsters
Actually I figured out a workaround. I added the image into the FAQ entry about pre-painting prosthetics, then used THAT image URL within the form. It displays a Squarespace image just fine, no custom CSS required.
Thank you so much for your help!