Image Backgrounds

User 2210468 Photo


Registered User
24 posts

I'm not happy with the white background around the images. How do I change them to solid black (or any other color for that matter?), or just get rid of the white?
Attachments:
User 103173 Photo


VP of Software Development
0 posts

The only way you can control this is in Designer Pro. You set the dimensions for all your images in there and then you have to re-add all images back to Shopping Cart Creator to match those dimensions. Any images that do not, will get the white back ground color.
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 2210468 Photo


Registered User
24 posts

See, I think I need some step-by-step here Scott. I've tried several things, but I am just not seeing how to re set JUST the photo dimensions. Everything I have tried seems to effect an entire cell, not just the image.
User 2114410 Photo


Registered User
383 posts

What Scott is saying is you need to resize in designer to match your image size.

You have a few options:

You can either resize the thumbnail size in Designer Pro to match your image size exactly, or at the very least, the dimensions of the image size (you could get image distortion if the image is large & compressed to a very small size).

Your images look like they would be, as an example, 150 x 200 rectangle, but the thumbnail is 200 x 200 square - so giving you the empty space on the sides. You need to make it a clean rectangle fit so you will fill out the entire thumbnail size.

Other option, which would take longer, is to resize your images to fit the thumbnail square.

Also another option would be to paste them onto a black background, saving them as a square 200 x 200, or whatever other square dimension you like.
User 629005 Photo


Ambassador
2,174 posts

Alfie - In SCD Pro, click on any/each picture that you want to resize, then click on "Advanced" tab on the right hand side of your screen. You should see options to change sizing, of picture or thumbnail depending on which you've selected.
Living the dream, stocking the cream :D
User 2210468 Photo


Registered User
24 posts

Thank you all for trying.

I cannot isolate the image alone. As close as I can get is the entire cell that includes the image, the price, etc. If I adjust the thumbnail with, the adjustments are global for all of the images on the entire page. Some of my client's images are not exactly the same size so I'd like to be able to adjust the photos individually (may be asking a lot!). AND, the adjustments change the width and height simultaneously. There is no control over left/right, top/bottom.

Bren, I may just try your option 3, OR tell my client, for now at least, that it is what it is.

Thanks again!

Alfie
User 2210468 Photo


Registered User
24 posts

I think I found a work-around...similar to your suggestion, Bren. I put the image on a 200x200 black background, but when I published it, the image still had a huge(r) white border. Then I created a black background to match the height of the image, and then made the width match the height, in the case of the attachment, 1070x1070. The end result filled the space with a fine white border; think the client will accept that.
Attachments:
User 2114410 Photo


Registered User
383 posts

Glad you found a workaround Alfie. :)

You do know you can adjust the settings for 1 template alone, and then save it under another template name, keeping it solely for this customers site? Just don't overwrite your existing template name. Although reading that again, you may mean you would like different thumbnail image sizes on the page, for the same customer. :D

Anyway, regardless, you could always remove the border, or make it black if you rather have a clean image without any white border/line. It does look much better now. :)

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.