Есть ли способ добавить gif в файл Markdown?


229

Я хочу добавить этот GIF- файл в GitHub ароматизированный файл уценки. Если это не может быть сделано в GitHub, возможно ли сделать это в другой версии уценки?


Ответы:


486

Показывать картинки нужно две вещи

1- Используйте этот синтаксис, как в этих примерах

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

Урожайность:

Alt Text

2- URL изображения должен заканчиваться GIF

3- Для потомков: если приведенная выше ссылка .gif испортится, вы не увидите изображение, а вместо этого увидите альтернативный текст и URL, например:

Alt Text

4 - для изменения размера GIF вы можете использовать этот синтаксис, как в этой ссылке учебника Github

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

Урожайность:


3
@NikKov по-настоящему! Это технический вопрос.
Халед Аннажар

6
Этот парень действительно сильно ударился головой. Слишком сильно на плиточном полу и, скорее всего, получил повреждение мозга или, по крайней мере, серьезное сотрясение мозга. Фактически, я собираюсь удалить это, поскольку я считаю это оскорбительным, и заменю это чем-то более хорошим.
eduncan911

3
Обратите внимание, что если ваш GIF слишком большой, вы увидите окно с плохим изображением. Маленькие картинки будут работать просто отлично.
Шубхам Чаудхари

1
Я просто проголосовал за ответ не только потому, что он правильный, но и потому, что все любят котенка! :)
MilitelloVinx

2
@ Гати, я не знаю. Я думаю, вам нужно создать новый вопрос для этого.
Халед Аннажар

102

Из Markdown Cheats :

Вы можете добавить его в репозиторий и сослаться на него с тегом изображения:

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"

Инлайн-стиль: альтернативный текст

Референс-стиль: альтернативный текст


В качестве альтернативы вы можете использовать URL-адрес напрямую :

![](http://www.reactiongifs.us/wp-content/uploads/2013/10/nuh_uh_conan_obrien.gif)

@erip, как использовать картинки из Giphy?
АбхиманьюАрян

1
@AbhimanyuAryan Вы можете найти адрес этих картинок, щелкнув их правой кнопкой мыши и получив адрес. Например: media.giphy.com/media/MoYC1N4nv7Fcs/giphy.gif
erip

Гифки (и другие изображения, которые я считаю), связанные с файлами уценки на github, обслуживаются камуфляжем с ограничением файла 5 МБ.
0xcaff

11
  1. есть GIF-файл.
  2. отправить файл GIF в репозиторий GitHub
  3. нажмите на этот файл на репозитории GitHub, чтобы получить GIF-адрес GIF
  4. в вашем файле README: ![alt-text](link)

пример ниже: ![grab-landing-page](https://github.com/winnie1312/grab/blob/master/grab-landingpage-winnie.gif)


7
Проще поместить его в каталог репо, например, /imgа затем использовать![alt text](img/my-image.png)
Braden Best

7

Giphy Gotcha

После выполнения 2 требований, перечисленных выше (должны заканчиваться .gifи использовать синтаксис изображения), если у вас возникли проблемы с GIF из giphy:

Убедитесь, что у вас есть правильный Giphy URL! Вы не можете просто добавить .gifв конец этого и заставить его работать.

Если вы просто скопируете URL из браузера, вы получите что-то вроде:

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

Вместо этого вам нужно нажать на «Копировать ссылку», а затем специально взять «Ссылку GIF». Обратите внимание на правильное значение, media.giphy.comа не просто giphy.com:

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


3

просто загрузите .gifфайл в вашу базовую папку GitHub и отредактируйте его, README.mdиспользуя этот код

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


0

в дополнение ко всем ответам выше:

если вы хотите использовать gif для своего репозитория github README.md и не хотите использовать его из своего корня , недостаточно просто скопировать URL-адрес вашего браузера, например, URL вашего браузера выглядит так:

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

но вы должны открыть свой GIF в вашей учетной записи GitHub и Rhgt нажмите на него и нажмите copy image addressили что-то вроде этого, что-то вроде этого:

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


0

Загрузить с местного:

  1. Добавьте ваш файл .gif в корень репозитория Github и нажмите на изменения.
  2. Перейти на README.md
  3. Добавь это ![Alt text](name-of-gif-file.gif) / ![](name-of-gif-file.gif)
  4. Коммит и гиф должны быть видны.

Показать GIF с помощью URL:

  1. Перейти на README.md
  2. Добавить в этом формате ![Alt text](https://sample/url/name-of-gif-file.gif)
  3. Коммит и гиф должны быть видны.

Надеюсь это поможет.

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.