Image appearance

To edit the spacing between photos you have inserted as center alignment and full size, you can follow these steps:

1. Edit your layout and click to edit settings for your WordPress content module .
2. In the popup, click the Content styles side tab.
3. Click the Image appearance view for image settings.
4. Drag the sliders for Margin above post images or Margin below post images to achieve the spacing you want.

As mentioned above, this setting only applies to images that are aligned center within posts/pages.
If your images are aligned left, right or none, you may see additional spacing (more on this below).

Trouble removing gap?

Additional space between images can come from unseen HTML markup in your page editor in WordPress, such as <div> or <p> tags surrounding your images. And if your images are not using center image alignment, you may also notice different spacing – such as when photos are inserted with none, left, or right alignment. Since images with left or right alignment must allow text to ‘wrap’ near the photo, they will have added margin to the side and below the photo so text does not come right along the photo edge.

See our tutorial about Set image size and alignment if you notice unexpected spacing between photos inserted into posts and pages in WordPress.

To edit the border applied around photos you have inserted, you can follow these steps:

1. Edit your layout and click to edit settings for your WordPress content module .
2. In the popup, click the Content styles side tab.
3. Click the Image appearance view for image settings.
4. Adjust the different border settings to achieve the border appearance you want, including:
   • Post image border width
   • Post image border color
   • Post image border style

Images which appear in the content of your posts at full size will scale to fill the width of your content area.

Tall photos in portrait orientation may not always fit the height of the screen without appearing outside the window, so you can turn on image height constraint to prevent photos from growing taller than your device can show at one time.

To edit the border applied around photos you have inserted, you can follow these steps:

1. Edit your layout and click to edit settings for your WordPress content module .
2. In the popup, click the Content styles side tab.
3. Click the Image appearance view for image settings.
4. At the bottom of the screen, click to toggle the option for Constrain post image height and find the adjustments below.

Click to view an example of tall photos being limited to a percentage of the screen height in this video clip:

When height constraint is enabled, you can set the image height constraint to be a percentage of the window height or window width.

To apply rounded corners to photos you have inserted, you can follow these steps:

1. Edit your layout and click to edit settings for your WordPress content module .
2. In the popup, click the Content styles side tab.
3. Click the Image appearance view for image settings.
4. Near the bottom of the settings area, adjust the slider to add rounding to corners.

Click to view a demonstration in this video clip: