Energy class icons

How to add EU energy efficiency class icons (e.g. A+++ to D) to a Studio template using your product feed's energy attributes and a public icon URL.

Updated July 1, 2026

Regulations mandate that advertising for some categories of products includes an energy efficiency label, for example:

Example energy class arrow icon showing classes from A+++ to D

Renable hosts a set of these icons that render the right arrow, scale, and highlighted class automatically once you point them at your product's energy attributes. Here's how to add one to a template:

  1. Make sure your product feed contains the 3 energy class attributes described in the Google Merchant feed format.

  2. Add an Image element to your template (see Elements).

  3. Select it, open Properties → Binding, and press + to create a placeholder.

  4. Paste this URL into the placeholder's expression:

    https://cdn.renable.com/static/energy-class-icons/Class_Arrows_MAXMIN_CLASS.png

  5. Replace MAX in the expression with a Product attributes placeholder chip, then click the chip and set "Only product attribute" to max_energy_efficiency_class.

  6. Replace MIN with another Product attributes chip, set to min_energy_efficiency_class.

  7. Replace CLASS with another Product attributes chip, set to energy_efficiency_class.

  8. Each of those energy-class values can contain a + character (e.g. "A+++"), which needs to be URL-encoded. Click each chip, click the Add text transform icon, choose Replace, and set "Search for" to + and "And replace with" to %2B.

  9. Add an empty fallback on the placeholder and leave it blank — this prevents a "missing content" warning for products that don't have energy class attributes.

Once set up, the image element automatically renders the correct energy label for every product that has these attributes, and stays empty (no warning) for products that don't.

Next steps#