Can I adjust how my photos are cropped on my home page?
If you’re using full-bleed images on your home page, there’s a chance your photos may get cropped in an unfavorable way, depending on their composition.
This is simply due to the nature of full bleed images when used on a web page. Computer monitors and browser windows vary in size and proportion, and in order for the image to span the entire width and height of the screen, the image is almost certainly going to bleed off the screen somewhere.
The default alignment is to keep the home page image at the top center of the screen, cropping both the right/left and bottom of the image.
If you’re image has a composition that would be better off being cropped an another way, you can paste this code into your “Body” field on your “Settings > Edit custom code” page:
<script> crop_align = "top left"; </script>
This will “lock” the image to top left of the browser window and crop the bottom and right side of the image.
Other possible alignments:
This is the default, and usually the best for photos of people. It will crop both sides evenly, and the bottom, keeping the top locked to the top of the window.
This will lock the top right edge, cropping the left and bottom sides.
Lock the left edge, and crop the top, bottom and right sides.
Crop all sides evenly, keeping the image centered at all times.
Lock the right edge, and crop the top, bottom and left sides.
Lock the bottom and left edges to the screen, and crop the top and right sides.
Lock the bottom edge and crop the left, right, and top sides.
Lock the bottom and right edges to the screen, and crop the top and left sides.
crop, trim, home, page, cut, adjust, hidden