Knowledgebase
How to add and edit image styles in Drupal
In Drupal you can use image styles to control the way in which images are displayed on the frontend of your site. The core Image module allows you to manage the image style settings. To manage the image styles, log in to the admin panel of your Drupal, click on the Configuration tab in the top navigation bar, and on the page that opens click on Image styles. On the next page there's a table with the image styles. Drupal comes with three default styles labeled thumbnail, medium and large.
To see the settings of a style or to edit them simply click on the edit button for the particular style. On the page that opens there's a table with the effects enabled for that image style. By default, the three preconfigured image styles come only with the Scale effect enabled, but it's set to different dimensions according to the style. Above the table with the effects there are preview images that will help you see how an original image is changed after the effect(s) of the style is applied to it.
If you haven't edited the style before (and it's one of the default ones), you have to click on the Override defaults button that's below the table with the effects. Once you do it a drop-down menu will appear from which you can select various effects. After you select the effect click on the Add button that's next to the drop-down menu. If there are any settings for that effect that have to be configured, they will be automatically shown. After you configure the settings for the effect click on the Add effect button and the effect will be added to the image style.
You can also add new image styles. To do this, click on the Add style button that's above the top left corner of the table listing the existing image styles. On the next page type a name for the style and click on the Create new style button. Then you can add effects.
To be able to add images to content items (nodes) you have to add an image field type to the content type to which the particular nodes belong. To do this, click on the Structure tab in the top navigation bar of your Drupal, on the next page click on Content types, and on the following page click on the manage fields button for the particular content type. On the page that opens you can add an image field type and configure the settings of the field.
You can also assign an image style to be used with a particular content type. To do this, go to Structure tab>Content types and click on the manage display button for the particular content type. On the page that opens there's a table with the fields that are visible (or hidden) on the frontend. Click on the small button that's in the row of the image field and use the respective drop-down menu that appears to assign an image style.
For more details and screenshots read the Drupal images tutorial.