Image not displaying on Overview Area Card

I’m tearing my hair out with this issue. Unless I don’t understand the functionality correctly. I have read the information on Cards and thought If I added an image it would display on the area card. Take this example
Area Study


I initially used the Upload feature which allowed me to browse to the current PC and seemed to insert the image which I cropped and saved, but the image does not appear on the area card even after a restart. Only icons chosen from HA library appear.

I read other posts and there seems to be conflicting information about where to save the image files. Many say /local/www/folder/study_icon.png others /config/www/folder/image.png(unless /local is same path as /config ??) but when I copy an image to this location it cannot be seen when using “Select from Media” option. This is because HA saves uploaded files to /config/image folder and can’t see the www folder from the UI.
I’ve changed the file name to lower case, inserted an underscore in the name. restarted HA several times but the image still will not display. I’m not sure what I am doing wrong

I’ve just had a thought. I am trying to edit the default Overview. Could this be the problem?
Do I have to create a new dashboard to use images on area cards option?

Does anyone know of a dashboard which just has area cards on which a full-size image can be displayed to represent a room or area? By clicking on the card it displays all the the entities within the room like the overview card. Can this be achieved by using a picture card.