Hello everybody,
I am using RW8 with Foundation.
I need your help to put a image I downloaded from AdobeStockPhotos into one of my webpages as a banner image.
The original size of the image is 5760 × 3840. When I put the image inside my Impact stack it gets cropped like this:
I have Photoshop, so I tried to change the size, but with no success. I tried 2000 x 1030 for example, but still it came out very much cropped as the original size.
Any ideas on this?
Thanks for your help.
Try setting Impact setup size to Proportional and edit your image to one of the proportional size in the drop down box.
Hello Bill,
Thanks for your advice.
I set-up the Impact stack to Proportional and then I tried to literally edit the picture with PP according to all the size options listed in the stack itself.
I then tried each and every different size, but none of them is showing full picture. 
What are the image dimensions? Choose OTHER in the stack settings and put in those dimensions, that should make it fully seen.
Here what mine look like https://www.agwm.org/
The very top first image are the impact images. All the images size are at 1200 x 515 which is 21:9 ratio and attached is a screenshot of my impact settings.
Thank both of you for your precious suggestions.
I did exactly the same as you both suggested. But with no success. My image is not showing well. Is it possible that there are some CSS that are on the way here?
Your original image (5760 x 3840) is a 1.5:1 ratio, have you tried putting that in your Impact settings (select custom)?
Hi Jason,
thanks for your help. Yes, I have tried this before, but the max custom Aspect Ratio is 3.000 x 3.000 on the stack settings.
Well, using a 1.5:1 ratio you could use say, 3000 x 2000 (or 2000 x 1333, as 3000px is likely overdoing it for a web image)
I have to agree with other on the original image size 5760 × 3840. it way too big. You need to scale it down to around 1400 px width preserving the same ratio if you don’t want to chop off any part of the image.
I keep all my hero or impact images at 1400 width or smaller. You can take the same image you have and scale it down but still keep every detail in the image also it will have a lot less page weight (smaller file size) which mean fast page loading time for the visitors.
Thank you everyone for your support.
I went down with a really bad cold and fever on Sunday evening and didn’t have the strength to work on the project!. Now I am finally up and running again!.
I am happy to share with you how I managed the sizing for your reference.
First off I changed pictures.
Then I re-seized them to 1200 x 515 (21:1).
Even doing so and setting the stack appropriately, Impact was cutting it anyway on the top. I didn’t give up and out of the blue, almost by mistake I think, I though why not doing like this?
Like some of you suggested with custom settings it showed the full picture, but still cutting minimally on the top; I decided to go with 21:1 ratio, so I get a nice modern look throughout the site.
Thanks to everyone, once again for your encouragement and support.
Happy Weaving
Good morning all,
I noticed over the weekend that the Impact Header is scaling my images on mobile device… you can have a look at my site here
I prefer to have the image 1200 x 515 able to show fully on mobile as well. I know it’s possible to create such a responsive header as @TechBill’ site clearly show.
Any help on this one would be great guys!
First, I think you have your aspect ratio set wrong. When I go to this page:
https://andrew.hedges.name/experiments/aspect_ratio/
and enter 1200x515, I get an aspect ratio of 240:103, not 21:1, so I am not sure where you got that.
This is probably is why the issues you are seeing are happening. Where did you get the aspect ratio of 21:1??
Hi Robert,
Thanks for pointing this out. I set the aspect ratio to 21:9 which works out to about 1200 x 515.
I was wondering if there is a way my images stay as they are without being cut boldly if on a mobile…
Not sure, I would set my aspect ratio to 1200:515, it does not have to be a small number. If you have it set on proportional it should not change on mobile, what do you have set for minimum size setting?? Make that smaller and see if it helps.
Hi Robert,
The stack is set on proportional. I have now changed the image size to 1280 x 550 still a 21:9 aspect ratio. The minimum size setting were set on 300px, so I changed them to 10px: when I have done so, changes were visible on mobile, now the pictures are not zooming in cutting way too much, rather they show almost the whole picture, but the height of the picture is literally so thin. Definitely not a big impression on my images for the site on mobile at this point. To be honest I don’t know what to do. I just want pictures to show correctly, but I don’t seem to make it work…
If you want to ensure that the entire image is displayed, then impact is not what you want. Use MovingBox, Cycler, Orbit or any plethora of regular slider stacks that are out there.
As I said in the FAQ above and in the video, impact does things differently.
Did you put a white bar on top of your image for navigation menu background? Is that where it messing up for you?
I noticed when your navigation menu jump to next line, your impact image container shrink down, did you place your impact stack inside another stack? Try taking it out and set it as a stand alone stack.
