Existe uma maneira de adicionar um gif a um arquivo Markdown?

Respostas:

485

Mostrar gifs precisa de duas coisas

1- Use esta sintaxe como nos exemplos

![Alt Text](https://media.giphy.com/media/vFKqnCdLPNOKc/giphy.gif)

Rendimentos:

Texto alternativo

2- O URL da imagem deve terminar com gif

3- Para a posteridade: se o link .gif acima ficar ruim, você não verá a imagem e verá o texto alternativo e o URL, desta forma:

Texto alternativo

4- para redimensionar o gif, você pode usar esta sintaxe como neste link de tutorial do Github

<img src="https://media.giphy.com/media/vFKqnCdLPNOKc/giphy.gif" width="40" height="40" />

Rendimentos:

Khaled Annajar
fonte
3
@NikKov for real !! Esta é uma questão técnica.
Khaled Annajar
6
Aquele garoto realmente bateu na cabeça dele, com força. Muito forte no piso de ladrilhos e provavelmente recebeu dano cerebral ou pelo menos uma concussão séria. De fato, vou removê-lo quando julgar ofensivo e substituí-lo por algo melhor.
precisa saber é o seguinte
3
Observe que, se o seu gif for muito grande, você verá uma caixa de imagem ruim. Gifs menores funcionarão perfeitamente.
Shubham Chaudhary
1
Eu apenas votei na resposta não apenas porque está correto, mas porque todo mundo adora gatinho! :)
MilitelloVinx
2
@ Gati eu não sei. Eu acho que você precisa criar uma nova pergunta para isso.
21418 Khaled Annajar
102

No Cheatsheet Markdown :

Você pode adicioná-lo ao seu repositório e referenciá-lo com uma tag de imagem:

Inline-style: 
![alt text](https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png "Logo Title Text 1")

Reference-style: 
![alt text][logo]

[logo]: https://github.com/adam-p/markdown-here/raw/master/src/common/images/icon48.png "Logo Title Text 2"

Estilo embutido: texto alternativo

Estilo de referência: texto alternativo

Como alternativa, você pode usar o URL diretamente :

![](http://www.reactiongifs.us/wp-content/uploads/2013/10/nuh_uh_conan_obrien.gif)
erip
fonte
@erip como usar gifs de Giphy?
precisa
1
@AbhimanyuAryan Você pode encontrar o endereço desses gifs clicando com o botão direito do mouse e obtendo o endereço. Por exemplo: media.giphy.com/media/MoYC1N4nv7Fcs/giphy.gif
erip
Os gifs (e outras imagens que eu acredito) vinculadas a arquivos de remarcação no github são servidos por camo com um limite de 5 MB.
0xcaff
11
  1. tem arquivo gif.
  2. envie o arquivo gif para o seu repositório do github
  3. clique nesse arquivo no repositório do github para obter o endereço do gif do github
  4. no seu arquivo LEIA-ME: ![alt-text](link)

exemplo abaixo: ![grab-landing-page](https://github.com/winnie1312/grab/blob/master/grab-landingpage-winnie.gif)

Winnie Phan
fonte
7
É mais fácil para colocá-lo em um diretório repo como /imge, em seguida, usar![alt text](img/my-image.png)
Braden Melhor
7

Giphy Gotcha

Depois de seguir os 2 requisitos listados acima (deve terminar .gife usar a sintaxe da imagem), se você estiver tendo problemas com um gif do giphy:

Certifique-se de ter o URL giphy correto! Você não pode simplesmente adicionar .gifao final deste e fazê-lo funcionar.

Se você apenas copiar o URL de um navegador, obterá algo como:

https://giphy.com/gifs/gol-automaton-game-of-life-QfsvYoBSSpfbtFJIVo

Você precisa clicar em "Copiar link" e depois pegar o "GIF Link" especificamente. Observe o correto aponta para em media.giphy.comvez de apenas giphy.com:

https://media.giphy.com/media/QfsvYoBSSpfbtFJIVo/giphy.gif

Jordan Arnesen
fonte
3

basta enviar o .gifarquivo para a pasta base do GitHub e editar, README.mdbasta usar este código

![](name-of-giphy.gif)

Vishal Shelake
fonte
0

além de todas as respostas acima:

se você quiser usar um gif para o seu repositório github README.md e não quiser usá-lo a partir da sua raiz , não será suficiente se você apenas copiar o URL do seu navegador, por exemplo, o URL do seu navegador é sth como:

https://github.com/ashkan-nasirzadeh/simpleShell/blob/master/README%20assets/shell-gif.gif

mas você deve abrir o seu gif na sua conta do github e clicar com o botão direito nele e clicar copy image addressou sth como este:

https://github.com/ashkan-nasirzadeh/simpleShell/blob/master/README%20assets/shell-gif.gif?raw=true

ashkan nasirzadeh
fonte
0

Carregar do local:

  1. Adicione seu arquivo .gif à raiz do repositório do Github e faça a alteração.
  2. Vá para README.md
  3. Adicione isso ![Alt text](name-of-gif-file.gif) / ![](name-of-gif-file.gif)
  4. Confirmação e gif devem ser vistos.

Mostre o gif usando o URL:

  1. Vá para README.md
  2. Adicionar neste formato ![Alt text](https://sample/url/name-of-gif-file.gif)
  3. Confirmação e gif devem ser vistos.

Espero que isto ajude.

Sumit
fonte