Markdown IMG doesn't show in Azure Repos README

Question

can't seem to get a hold on this. I'm using Markdown to make my README. When I'm using a relative address, I can see the image in my README in the editor, but when I push the code, the image link is broken inside of Azure Repos.

<p align="center">
    <img width="100" height="100" src="docs/assets/images/LicenseManagerLogo_v10071.png" alt="Logo of License Manager" />
</p>

All I can get is the ALT text inside of Azure:

Maybe there's some special address I need to put when using Azure?

Here's what the image path looks like when I view the image in its folder on Azure Repos:

This is what is in the browser URL box when viewing the image in its folder on Azure Repos (company name removed):

https://[removed].visualstudio.com/[removed]/_git/paradox?path=%2Fdocs%2Fassets%2Fimages%2FLicenseManagerLogo_v10071.png

If I right-click on that image and view, here is the address in the browser (company name removed): https://[removed].visualstudio.com/02450a3a-db08-42c8-ba46-bad060be67f6/_apis/git/repositories/45759807-73d7-4dc5-9cb6-efaf3f06d3ce/items?path=%2Fdocs%2Fassets%2Fimages%2FLicenseManagerLogo_v10071.png&versionDescriptor%5BversionOptions%5D=0&versionDescriptor%5BversionType%5D=0&versionDescriptor%5Bversion%5D=_gg_Backlog7231&resolveLfs=true&%24format=octetStream&api-version=5.0

It doesn't make much sense to me that I can see the image in the editor but not the repo. Did Microsoft really make it to where images won't load in the README?

Thanks for the help!

@BhargaviAnnadevara It's at the same level as the "docs" folder. — midoriha_senpai, Feb 18 '21 at 22:03

score 0 · Answer 1 · answered Feb 07 '21 at 17:51

0

I ran into a similar issue while publishing my Wiki. After playing around with file paths a bit, I could get it to work using the images' relative paths to that of the Wiki.

For example, if your repo's folder structure is:

src
└── Repos
    └── XYZ
        └── README.md
        └── .attachments
            └── A.png
            └── B.png
            └── C.png

Your markdown can then reference these images as:

![Image alt text](/.attachments/A.png)
![Image alt text](/.attachments/B.png)
![Image alt text](/.attachments/C.png)

answered Feb 07 '21 at 17:51

Bhargavi Annadevara

4,923
2
13
30

Thanks for the reply, I'm already using relative paths – midoriha_senpai Feb 18 '21 at 22:05
@midoriha_senpai Please try [publishing the readme to a wiki](https://learn.microsoft.com/en-us/azure/devops/project/wiki/publish-repo-to-wiki?view=azure-devops&tabs=browser#publish-a-git-repository-to-a-wiki-1). The images render correctly post the publish for me. – Bhargavi Annadevara Feb 19 '21 at 05:05
@midoriha_senpai Any luck here? – Bhargavi Annadevara Feb 23 '21 at 16:52
My organization is using a different repo for the wiki, I can't merge my Markdown into that to use the wiki feature. – midoriha_senpai Feb 24 '21 at 17:37
It seems like the solution would be for my organization to either 1) move code to GitHub where the images will render properly, 2) restructure repos into their own project so a wiki can be set up for each one, or 3) create a web page or something that pulls from the repo and builds something like a wiki. It would also be helpful if Azure DevOps would allow for more than one wiki per team project - I found this suggestion to vote on: https://developercommunity.visualstudio.com/t/allow-creation-of-multiple-wikis-per-team-project/379600 – midoriha_senpai Feb 24 '21 at 17:46

Markdown IMG doesn't show in Azure Repos README

1 Answers1