xindzju
xindzju

Reputation: 55

Why image can't show up in the VS Code extension gallery when I used HTML tag in the README file?

I want to show a demonstration gif in my Awesome Snippets Visual Studio Code Extension gallery. In order to change the image size, I have to use the HTML tag rather than the regular Markdown syntax in README, yet it seems not to work. So is there anything wrong and how can I implement this in some useful way?

The HTML tag code is here:

 <img src="https://github.com/xindzju/vscode-cppsnippets/blob/master/images/vscdemo.gif" width="650" height="500" alt="demo"/>

Upvotes: 2

Views: 3994

Answers (2)

Tyler McGinn
Tyler McGinn

Reputation: 56

I had this problem too.

  1. Make sure the repo is public.
  2. Go into your repo where your .gif is located.
  3. The .gif should be playing.
  4. right click on the .gif and select copy image address.
  5. paste into your README.md

all done :)

Upvotes: 4

Mike Lischke
Mike Lischke

Reputation: 53347

Images must come from trusted sites only (e.g. Github). It took me a few rounds to ensure images are shown on the marketplace. What I ended up with was full paths to Github. For example:

<p style="float:right;">
  <img src="https://raw.githubusercontent.com/mike-lischke/vscode-antlr4/master/misc/antlr-logo.png" alt="logo" width="64">
</p>

Make sure you use the direct link to the image, not the normal web link (which would return a webpage, not an image).

Upvotes: 1

Related Questions