Добавляем на гитхаб в файл описания  readme.md свое изображение.
  • 1657

Как добавить скриншот на github репозиторий в readme.md.

Автор: admin | 27 июня (Ср.) 2018г. в 21ч.31м.

Файл readme.md на github содержит краткое описание кода и тот, для чего он нужен и как пользоваться этим добром.
В этой статье я хочу рассказать как добавить скриншот в файл readme.md. Несомненно, картинка украсит ваше описание и сделает его более информативным.

Добавляем картинку в readme.md

Вставляем этот код в нужное место файла. Тут присутствует путь и описание картинки, которое появляется при наведении (по типу атрибута title в html):
![alt text](screenshots/filename.png "Описание будет тут")​

В данном случае screenshots/filename.png - это путь к картинке от корня репозитория. Если у вас нет директории для хранения картинок, которые будут выведены в readme.md, то можете создать ее и назвать как в примере - screenshots, и положить туда файл изображения.

Вот пример того как выглядет картинка, размещенная таким способом на одном из моих репозиториев.

Если вы не хотите хранить скриншотов в своем репозитории, вы можете загрузить его в другое место и ссылаться на нее по полному пути:
![alt tag](http://domain.com/path/to/img.png "Описание будет тут")​

.png является предпочтительным фарматом изображения для github.

Для того, чтобы загрузить картинку, можно воспользоваться штатным инструментом github 'upload files'. Для этого на гитхабе нужно перейти в папку для картинок в репозитории и кликнуть по ссылке над списком файлов 'upload files'.
Загружаем картинку

Далее нужно перетащить файл картинки в окно сайта и картинка будет загружена.

Перетаскиваем картинку.

Также можно загрузить скриншот на github вместе с очередным push запросом из локального git. Я предпочитаю второй вариант, чтобы файловая структура на гитхабе и на гите на локальной машине не отличались.

Приветствую!

Меня зовут Сергей. Я - автор этого блога.

Если Вам был полезен материал на моем сайте, поддержите пожалуйста мой проект, чтобы о нем узнали другие люди - кликните plizz :) на иконку в соц. сети, чтобы поделиться материалом с другими.