We are hoping to use Looker to hold our documentation for data models using markdown files and to be able to link out to the specific documentation for each model from within Looker homepages. This is working quite well with one exception: we can’t get images to load.
They load fine when we are developing them in VS Code and on the PR/repo in Github, but they do not display in Looker when we try and view the page (changing files to documents in the developer URL).
We are currently using the following line of markdown:
The whole file path is documentation\mart_finance\images\fact__dcp_carer_visit_transaction_summary.png, however, we can’t get any variation of using the full file path or “../” to work at all.
I also use markdown pages for documentation. I save all the images in a GCS bucket, and then use either markdown / an <img> html tag to reference the full URL of the image.
Sorry, I know this doesn’t directly answer your question, but it is how my current company and my previous company have handled storing and referring to images in Looker e.g. when using dynamic images or icons in LookML field definitions, or adding screenshots to user guides in markdown pages.
The issue is likely related to how the image path is being referenced in the context where the markdown is being displayed. If the image is not loading, it may be because the file path is not correctly resolved by the system or the environment where the markdown is being rendered. Ensure that:1. The image file actually exists at the specified path: documentation\mart_finance\images\fact__dcp_carer_visit_transaction_summary.png.2. The file extension (.png) is correct and matches the actual file.3. The directory structure is accurate, and there are no typos in the path.4. The markdown is being rendered in an environment that supports relative or absolute paths for images (e.g., a static site generator, a web server, or a markdown viewer).If the path is correct and the image still isn’t loading, try using an absolute URL if the image is hosted online, or ensure that the image is properly uploaded to the correct location in your project.
I’m afraid the img html tag isn’t working for me either. But I think I will have to try and see if I can host the image elsewhere and refer to it from there, as you say with GCS bucket.
Thanks for your pointers. Given the image loads ok in VS Code/Github the file path must be correct, and I have tried a load of different ways to use the file path that all aren’t working. The image has been uploaded to our github repo, so that’s the path we’re using. I may try and see if we can host the image elsewhere, but it’s pretty annoying Looker doesn’t seem to support this given it works on Github.
Is the repo public? Remember that the image needs to be hosted somewhere where it is publicly available (to your end users). If the repo is private, the image will only load for people who are logged into GitHub and have explicit permission to view the repo. Also, I’d try using an absolute path rather than a relative path in your markdown, just to see if that helps.