Hi Mark,
I’d be a bit worried that the client may break the page layout if they uploaded an image that was either too large or small for the design. Rather than expect them to upload a new image, scale and crop it to fit the design I wonder if you can use a set CSS style on the box to display the image as a background to the box?
The idea is that your letterbox shaped image box will be a div (a layer) containing nothing but a clear gif image. A CSS style applied to the box will define the background image and position. This allows the image to be bigger than the box and flow under the edges of the box as needed.
As long as the new image uploaded by the client is roughly the right size and uses the same name as the older one then the effect should work perfectly. Maybe.
Regards,
Tim.
On 7 Oct 2011, at 10:59, Mark wrote:
Trouble is the website has an image at the top of the page, a set width and height. Letter box format: wide and not very high.
Can the client use Web Yep to change the image, scale it, crop it and position it within the set width and height?
Two options, either teach the client how to crop images prior to uploading or
Create a div with a fixed hight and place the WebYep image inside this box, then use CSS to make sure the image is cropped. You can make WebYep fit a set width easily to deal with the hight use CSS overflow: hidden; That will just see the top of the image then you could add to the div img
position: relative;
top: -30%;
To vertically centre the image in the div
I’ve done something similar here in the WebYep gallery to Centre the thumbnails in WebYepGalleryImage div
The idea is that your letterbox shaped image box will be a div (a layer) containing nothing but a clear gif image. A CSS style applied to the box will define the background image and position. This allows the image to be bigger than the box and flow under the edges of the box as needed.
After having a good look at several CMS I’ve decided to tell the client that they will have to come back to me if they want to change one of the images with a set width and height.
Images within a side bar, with a set width, but no set height they will be able to change via WebYep. This appears to be the easiest CMS for me to set up and for the client to use.