How to add an image to the tiles by customizing the CSS

To customize the CSS to set an image to be displayed in a tile, follow these steps:

  1. Make sure you set an ID on the topic that you want the tile include an image.
  2. Create a new CSS file that contains a rule that associates an image with a specific tile. The CSS file should have content that is similar to this:
    .wh_tile[data-id='growing-flowers']> div {
        background-image:url('resources/flower.png');
    }
  3. Reference the CSS file in a WebHelp Responsive transformation using an oXygen Publishing Template or the args.css parameter.