You love the hero image you have chosen, but there is a huge problem; when you switch to either the tablet or phone mode it gets cropped at the wrong place. Ugh!

Take a breath the fix is unbelievably simple and requires no CSS or any other coding. Yeah!

Part One

Open your image in whatever photo editing software you use, and do the following:

For tablet

Crop your image to 780 pixels wide. The hardest part may be what part of the image you want to use.

For phone

Again, figure out what part of the image you want to use and crop it to 420 pixels wide.

Part Two

Open the Section and click on the Background tab. Once the background is open click on the image icon. With the image icon open, click on the black phone icon next to the word Background and then click on the tablet icon.

Delete the image and upload the image you sized for the tablet.

Next click on the phone icon. If your tablet image doesn’t work, the delete it and upload the image you sized for the phone.

Save and that’s it.