I am creating a custom Drupal 8 theme, and I want to change the image style of the indexed article content of the frontpage - only the article content type.

To do that properly - avoiding using CSS hack - I have to *change the image style the image field of the display mode Teaser of the article content type**, the display mode "teaser" is used by the native view "frontpage" to index content. And I have to do that modification at the theme installation and thus configure the theme properly to do that modification at installation. It's not working with conf file because the configuration already exist. i am asking here advice on how to do that.

In details: I need to change the image style of the field "field_image" of the mode display "teaser" of the content type "article".

By default it use the image style "large" and I want it to use a new image style "hp_wide" that the theme import - successfully - at theme installation.

From my research, I've found that I've to create a PHP function in MyThEme.theme with \Drupal::configFactory()->getEditable($name), it is the correct way? If yes how can I target that specific field settings, how can I know the "path" of that settings?

  • Welcome to Drupal Answers! 👋 Speaking for me I find it really difficult to understand what you are actually trying to accomplish. Could you maybe edit your question and try to make this a reproducible problem somehow by providing more information? Like, how is it now, what's wrong with it, and how you want it to have, and when exactly? Many thanks
    – leymannx
    Commented Apr 23, 2020 at 12:47

1 Answer 1


i've found a solution: define the style of the image directly into the twig template. As a theme can define new style of image when it is installed it's possible to use a non native style of image. In the example below i use the style "wide", created at the theme installation, instead of the native style "medium" used in the indexed content in the homepage.

 {% for item in content.field_image['#items'] %}
  {% set image = {
    '#theme':      'image_style',
    '#style_name': 'wide',
    '#uri':        item.entity.uri.value,
    '#alt':        item.alt,
    '#width':      item.width,
    '#height':     item.height
  } %}
  {{ image }}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.