Как правильно добавить изображения на страницы GitHub?

Question

Отказ от ответственности: я искал SO и нашел похожие вопросы (например: URL ), в основном предлагая обратить внимание на различия в именах в верхнем / нижнем регистре, но они не решили мою проблему.

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

<img src="./images/equation-1.gif" style="display: block; margin: auto;" />

Однако таким образом изображения отображались только внутри репозитория GitHub, но не на странице GitHub.Поэтому я заменил их прямыми ссылками, на которые ссылаются изображения в репозитории GitHub, как показано ниже:

<img src="https://github.com/KubaMichalczyk/kubamichalczyk.github.io/raw/master/_posts/images/equation-1.gif" style="display: block; margin: auto;" />

И это сработало.Однако только на первый взгляд, так как через несколько дней все ссылки обвалились.С тех пор эти изображения отображаются большую часть времени, но иногда ссылки не работают.К сожалению, я понятия не имею, почему это так, и я хотел бы отремонтировать его раз и навсегда.Поэтому мой вопрос: как правильно добавить изображения на страницу GitHub?Почему относительные ссылки на самом деле не работают?Имеет ли значение, является ли хранилище частным или общедоступным?

Адрес моей страницы здесь , а хранилище находится здесь .

Answer 1

В зависимости от вашего домена kubamichalczyk.github.io, вы используете Сайты пользователей и страниц организации .

Правильный способ сделать это включает добавление конфигурации url к _config.yml сваша продукция url и использование этого ключа в ваших шаблонах при загрузке изображений.

Использование gemub pages gem

Убедитесь, что вы используете гем Github pages для синхронизации с вашимпроизводственная среда и не зависит от вашей локальной конфигурации

     $ bundle init

В Gemfile:

source 'https://rubygems.org'
gem 'github-pages', group: :jekyll_plugins

Установите правильную версию Jekyll:

$ bundle install

Затем всегда выполняйтеjekyll с bundle:

$ bundle exec jekyll serve

Добавление URL

В _config.yml:

url: https://kubamichalczyk.github.io/

Папка изображений

Изображения не должны бытьвнутри папки _posts они должны находиться в корневом каталоге:

/images

Ссылаясь на изображения

В сообщениях используйте вышеуказанный конфиг url, поэтому он будет заменен на localhost при разработкеи с вашим сайтом страниц Github в производстве {{site.url}}/images/equation-1.gif:

<img src="{{site.url}}/images/equation-1.gif" style="display: block; margin: auto;" />