Drupal is a registered trademark of Dries Buytaert
cms 2.1.3 Update released for Drupal core (2.1.3)! drupal 10.5.11 Update released for Drupal core (10.5.11)! drupal 11.3.11 Update released for Drupal core (11.3.11)! drupal 11.2.13 Update released for Drupal core (11.2.13)! drupal 10.6.10 Update released for Drupal core (10.6.10)! cms 2.1.2 Update released for Drupal core (2.1.2)! drupal 11.1.10 Update released for Drupal core (11.1.10)! drupal 10.5.10 Update released for Drupal core (10.5.10)! drupal 10.4.10 Update released for Drupal core (10.4.10)! drupal 11.2.12 Update released for Drupal core (11.2.12)! drupal 11.3.10 Update released for Drupal core (11.3.10)! drupal 10.6.9 Update released for Drupal core (10.6.9)! drupal 10.6.8 Update released for Drupal core (10.6.8)! drupal 11.3.9 Update released for Drupal core (11.3.9)! drupal 11.3.8 Update released for Drupal core (11.3.8)! drupal 11.3.7 Update released for Drupal core (11.3.7)! drupal 11.2.11 Update released for Drupal core (11.2.11)! drupal 10.6.7 Update released for Drupal core (10.6.7)! drupal 10.5.9 Update released for Drupal core (10.5.9)! cms 2.1.1 Update released for Drupal core (2.1.1)!

bg_image_formatter

18,317 sites Security covered
View on drupal.org

This module provides an image formatter that allows you to set an image in background of a tag.
The images are from a field of an entity and not from a configuration page or a custom entity or something else, so it's very easy to setup and manage.

It contains a submodule to handle responsive images as well.

Use cases

  1. You want to display a image on the back of a div when viewing a particular node.
  2. You want to display a random image on the back of a div on the frontpage only. This can be done using Views. Create a block, select the "Background Image" formatter for your image field, save, place the block, boom, you're done.

Dependencies

  1. bg_image (required only in 1.x versions): It's using the API of this module to do it's magic.
  2. Token
  3. Entity for the Entity Token submodule. (optional)
  4. Views (optional): When using in Views, it can create very nice landing pages using random images.

Why use Views with it ?

You can use use the module Views to create a block, just like the second screenshot.
You have to select the image field, then, choose the "Background image" formatter.
The output of this block is null, so, it won't be displayed but the block will be executed and will set the background image correctly.

This is great if you need to set a random wallpaper on your site, add a sort criteria, choose "Global: random" and you're done.
Every time the page load, it will execute the View, choose a random node, extract the image field and set it as background.
You can have a more fine grained control of the "Global: Random" criteria by using Views Random Seed.

Help

You should check the screenshots, it's quite self-explanitory or use the issue queue !

Others related modules

Activity

Total releases
1
First release
Feb 2025
Latest release
1 year ago
Release cadence
Stability
100% stable

Releases

Version Type Release date
8.x-1.18 Stable Feb 14, 2025