Menu du compte de l'utilisateur

  • Log in

Navigation principale

  • Home Page
  • All CMS
  • Tutorials
  • White Paper
Home
Guide CMS

Breadcrumb

  • Home
  • Tutorials
  • Drupal User Guide
  • Chapter 6. Setting Up Content Structure
  • 6.12. Concept: Image Styles

Language selector

  • Français
  • English

Main navigation

  • Home Page
  • All CMS
  • Tutorials
  • White Paper

User login

CAPTCHA
This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.
  • Create new account
  • Reset your password

Book navigation

  • Tutorials
    • Drupal User Guide
      • Preface
      • Chapter 1. Understanding Drupal
      • Chapter 2. Planning Your Site
      • Chapter 3. Installation
      • Chapter 4. Basic Site Configuration
      • Chapter 5. Basic Page Management
      • Chapter 6. Setting Up Content Structure
        • 6.1. Adding a Content Type
        • 6.2. Deleting a Content Type
        • 6.3. Adding Basic Fields to a Content Type
        • 6.4. Concept: Reference Fields
        • 6.5. Concept: Taxonomy
        • 6.6. Setting Up a Taxonomy
        • 6.7. Adding a Reference Field
        • 6.8. Concept: Forms and Widgets
        • 6.9. Changing Content Entry Forms
        • 6.10. Concept: View Modes and Formatters
        • 6.11. Changing Content Display
        • 6.12. Concept: Image Styles
        • 6.13. Setting Up an Image Style
        • 6.14. Concept: Responsive Image Styles
        • 6.15. Concept: Text Formats and Editors
        • 6.16. Configuring Text Formats and Editors
      • Chapter 7. Managing User Accounts
      • Chapter 8. Blocks
      • Chapter 9. Creating Listings with Views

Guy Vigneault

6.12. Concept: Image Styles

By Guy Vigneault | 11:11 PM EDT, Thu March 12, 2026

Prerequisite knowledge

Section 6.3, “Adding Basic Fields to a Content Type”

What are image styles?

Image styles allow you to upload a single image but display it in several ways; each display variation, or image style, is the result of applying one or more effects to the original image.

As an example, you might upload a high-resolution image with a 4:3 aspect ratio, and display it scaled down, square cropped, or black-and-white (or any combination of these effects). The core software provides a way to do this efficiently:

  1. Configure an image style with the desired effects on the Image styles page (admin/config/media/image-styles).
  2. The effects will be applied the first time a particular image is requested in that style.
  3. The resulting image is saved.
  4. The next time that same style is requested, the saved image is retrieved without the need to recalculate the effects.

The core software provides several effects that you can use to define styles; others may be provided by contributed modules.

Visit the Image styles page via the Manage administrative menu, navigate to Configuration > Media > Image styles (admin/config/media/image-styles) to see the image styles that are defined by default.

Related topics

  • Section 6.13, “Setting Up an Image Style”
  • Section 6.14, “Concept: Responsive Image Styles”
  • Section 6.3, “Adding Basic Fields to a Content Type”

Additional resources

Drupal.org community documentation page "Working with images"

Attributions

Adapted and edited by Boris Doesborg, and Jojy Alphonso at Red Crackle, from "Working with images" copyright 2000-2025 by the individual contributors to the Drupal Community Documentation

 

Book traversal links for Tutorials

  • ‹ 6.11. Changing Content Display
  • Up
  • 6.13. Setting Up an Image Style ›
CMS

 

All CMS

 

Tuto

 

Tutorials

 

White Paper

 

White Paper

Powered by Drupal

Privacy Policy

Privacy Policy

 

Recent content

  • 9.3. Creating a Content List View
    5 days 7 hours ago
  • 9.2. Concept: The Parts of a View
    5 days 7 hours ago
  • 9.1. Concept: Uses of Views
    5 days 7 hours ago
  • Chapter 9. Creating Listings with Views
    5 days 7 hours ago
  • 8.3. Placing a Block in a Region
    1 month 2 weeks ago

Copyright

Creative Commons

Sauf mention contraire, Guide CMS © 2025 par Guy Vigneault est sous licence Creative Commons Attribution - Utilisation non commerciale - Partage dans les mêmes conditions 4.0 International

 

Creative Commons

Unless otherwise stated, Guide CMS © 2025 by Guy Vigneault is licensed under Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International Public License

eGV Web