Once you've added images to your website, you can edit the images directly within the website editor. No need for Photoshop! Let's take a look at how to do this.

When you use images in any image widget on your website, you have the option to edit each image. This allows you to change the size of the image, rotate or flip the image, recolor the image, and more!

To open the image editor for an image first open the widget editor for that image. For more information about how to add image widgets and how to open them to edit the images see these sections in the article on adding and replacing images:

In the same place that you see options to "Replace" or "Delete" images, you will see the option to "Edit" the current image.

Clicking the "Edit" button will open the Image Editor for that image. Along the top of the Image Editor, you will see Undo/Redo buttons, the ability to Zoom in or out, and buttons to Save and Close, or Cancel edits. You'll see all of the editing options along the bottom of the Image Editor. We'll take a look at each option next.

To open the Transform options, click on "Transform" in the bottom row of the Image Editor.

You have options to:

Clicking on "Crop Size" allows you to choose from popular and standard social media image sizes. You can also set a custom image size. You'll also see the option to "Reset to Default" if you make many changes to your image and need to undo them.

Clicking the "Flip & Rotate" option will allow you to flip the image horizontally or vertically. You can rotate the image quickly by 90 degrees clockwise or counterclockwise. You can also rotate the image by a specific angle.

Finally, you have the option to keep the image resolution of the original image. If you select this option and return to "Crop Size", manually adjusting the size of the image width or height will automatically adjust the other dimension to maintain the original aspect ratio. Note that selecting a popular size or social media image size will ignore this setting.

To open the filter options, click on "Filters" in the bottom row of the Image Editor.

You will see a variety of filter categories that you can apply to your image.

Clicking on one of the filter categories will open all of the available filters in that category. You can also still see the other filter categories if you'd like the see other filters.

Clicking on one of the filters will apply it to your image, and give you the option to adjust the intensity of the filter, or remove the filter. Note that only one filter can be applied to an image.

To adjust an image, click on "Adjust" in the bottom row of the Image Editor.

You will see options to adjust the brightness, contrast, saturation, gamma, clarity, shadows, highlights, exposure, blacks, whites, temperature, and sharpness of the image.

Clicking on "Brightness" will open a brightness slider and you'll also see a button to "Reset Adjustment" if you want to return to the original brightness setting. Brightness refers to the overall lightness or darkness of the image

Clicking on "Contrast" will open a contrast slider and you'll also see a button to "Reset Adjustment" if you want to return to the original contrast setting. Contrast is the difference in brightness between light and dark areas of an image

Clicking on "Saturation" will open a saturation slider and you'll also see a button to "Reset Adjustment" if you want to return to the original saturation setting. Saturation describes the intensity of the color.

Clicking on "Gamma" will open a gamma slider and you'll also see a button to "Reset Adjustment" if you want to return to the original gamma setting. Gamma is a machine vision technique used to correct the difference between the digital image readout and the perception of the human eye. It can also be used to correct over-illuminated spots.

Clicking on "Clarity" will open a clarity slider and you'll also see a button to "Reset Adjustment" if you want to return to the original clarity setting. Clarity is most commonly used to enhance texture. By increasing clarity, you add more structure to middle tones to create a sharper image.

Clicking on "Shadows" will open a shadows slider and you'll also see a button to "Reset Adjustment" if you want to return to the original shadows setting. Adjusting the shadows enables you to increase or decrease how dark the shadows are in the image.

Clicking on "Highlights" will open a highlights slider and you'll also see a button to "Reset Adjustment" if you want to return to the original highlights setting. Adjusting the highlights enables you to increase or decrease how light the highlights are in the image.

Clicking on "Exposure" will open an exposure slider and you'll also see a button to "Reset Adjustment" if you want to return to the original exposure setting. Exposure is the amount of light that reaches your camera's sensor, creating visual data over a period of time. Overexposure leads to overexposed highlights and faded-looking images.

Clicking on "Blacks" will open a blacks slider and you'll also see a button to "Reset Adjustment" if you want to return to the original blacks setting. Adjusting the blacks enables you to increase or decrease how dark the dark areas are in the image.

Clicking on "Whites" will open a whites slider and you'll also see a button to "Reset Adjustment" if you want to return to the original whites setting. Adjusting the whites enables you to increase or decrease how light the light areas are in the image.

Clicking on "Temperature" will open a temperature slider and you'll also see a button to "Reset Adjustment" if you want to return to the original temperature setting. Color temperature, or light temperature, refers to the light source or light appearance in your photos and what kind of color cast it provides on a cool to warm scale

Clicking on "Sharpness" will open a sharpness slider and you'll also see a button to "Reset Adjustment" if you want to return to the original sharpness setting. Sharpness describes the clarity of detail in a photo, and can be a valuable creative tool for emphasizing texture.

To open the Focus options, click on "Focus" in the bottom row of the Image Editor.

You will see the option to add 4 different types of focus:

When you have selected a focus type, you will see options to increase or decrease the focus intensity or remove the focus. Depending on the type of focus, you will also see lines on the canvas to indicate where the focus is located. You can click and drag these lines to adjust the location of the focus in the image.

To open the Frame options, click on "Frame" in the bottom row of the Image Editor.

You'll see various frame options for your image. Clicking on a frame will add it to your image.

Once the frame has been added to your image, you will see a slider to adjust the opacity of the frame, and the option to remove the frame.

You can also click on "Size" to open a size slider to adjust the size of the frame on the image.

To open the Overlay options, click on "Overlays" in the bottom row of the Image Editor.

You will see a variety of overlays that can be added to the image. Note that there are a lot of overlays and you will have to scroll horizontally to see them all. Overlays are similar to filters, but add distinctive visual elements to your image. You can think of overlays as adding a separate image that is being combined with your image.

When you have added the overlay to your image, you will see the option to change the blend mode. This lets you set how much the overlay is combined with your original image.

You can also adjust the opacity of the overlay by clicking on "Opacity". This lets you adjust the visibility of the overlay on your original image.

To add text to your image, click on "Text" in the bottom row of the Image Editor.

Default text will automatically be added to your image. To edit what it says, you can either click the "Edit" button at the top left of the text box, or double click on the text box. You also have the option to "Duplicate" or "Delete" the text box. If you add multiple elements to your image (text, stickers, and drawings) you will also see the option to "Move to Front" enabled. This lets you move the text box in front of other elements so that it can be seen.

Below the image you will see the option to change the font of the text. Note that there are a lot of fonts and you will have to scroll horizontally to see them all. You'll also see a button to "Add Text" which lets you add an additional text box. You will also see the option to change the font size of the text.

Clicking on "Alignment" below the image will give you the option to change the alignment of the text. It can left, center, or right aligned.

Clicking on "Color" below the image will give you the option to change the color of the text.

Clicking on "Bg Color" below the image will give you the option to change the background color of the text.

Clicking on "Line Height" below the image will give you the option to change the line height of the text. This will increase or decrease the spacing between rows of text in the text box.

After you have added text to your image, you can easily return to editing it at any point by clicking on the text box in your image.

To add a sticker to your image, click on "Stickers" in the bottom row of the Image Editor.

You'll see the option to choose from either Emoticons or shapes. You also have the option to "Upload Sticker" which lets you upload an image from your device.

When you have clicked on a sticker category, you will see all the available stickers within that category. Note that there are a lot of stickers and you will have to scroll horizontally to see them all.

To select a sticker, click on it and it will be added to the center of your image. You'll then see the option to flip the sticker, duplicate it, or delete it. If you add multiple elements to your image (text, stickers, and drawings) you will also see the option to "Move to Front" enabled. This lets you move the sticker in front of other elements so that it can be seen.

Below the image, you'll see the option to adjust the opacity of the sticker, or how visible it is on your image.

To draw on your image, click on "Brush" in the bottom row of the Image Editor.

This will change your cursor to a circle when you hover over your image. You can click and drag to add a drawing over your image.

Below your image, you will see the option to change the color of your drawing. Once you have added a drawing to your image, you will also see the "Clear Brush" button enabled. This allows you to remove everything you have drawn from your image.

If you click on "Size" below the image, you will see the option to change the size of the drawing. This is similar to using a thicker or thinner marker tip.

If you click on "Hardness" below the image, you will see the option to change the hardness of the drawing. A softer drawing will be more transparent while a hard drawing is opaque.