Куда я положу свой значок с Хьюго?

Я использую Хьюго для создания статического сайта. Где я должен положить свой favicon.ico файл?

5 ответов

Решение

Поместите значок внутри статического каталога. Статический каталог находится в корне вашего сайта hugo. Когда вы создаете свой сайт, значок будет скопирован в publicкорень сгенерированного сайта.

Структура каталогов

Поместить ваши иконки в статическую папку - это правильно. Он будет опубликован в общей папке после создания страницы.

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

Когда вы используете этот код в своей голове:

      <link rel="shortcut icon" type="image/png" href="/img/icon-192x192.png">
<link rel="shortcut icon" sizes="192x192" href="/img/icon-192x192.png">
<link rel="apple-touch-icon" href="/img/icon-192x192.png">

... вы можете поставить свой сингл icon-192x192.png в папке 'img' в статическом каталоге (или в любом другом месте, которое вам нравится, если вы правильно укажете путь).

Просто столкнулся с этим и обнаружил, что комментарий @mathtick «это зависит» был самым точным ответом здесь, поэтому я решил сделать этот пост.

Ответ, кажется, зависит от того, какую тему вы используете. Я попытался обобщить свое объяснение, чтобы другим было полезно понять, как заставить его работать в их сценарии, даже если оно не совсем такое же, как у меня.

Это то, что сработало для меня, когда я создал пробный концептуальный сайт, используя Hugo с темой docsy:

Определите 3 самых ценных ресурса:
1. Репозиторий Git сайта-примера вашей темы:
Пример:
https://github.com/google/docsy-example .

2. Git-репозиторий вашей темы:
Пример:
https://github.com/google/docsy

3. Страница документации вашей темы:
Пример:
https://www.docsy.dev/docs/

Вот логический рабочий процесс, через который я прошел, чтобы заставить его работать:

  1. Слышал, люди говорят, посмотрите в папку /static/. Я посмотрел на сайт docsy-example и увидел, что на нем нет папки с именем static. (в моей кодовой базе была пустая папка /static/, созданная логикой инициализации Hugo cli.)
  2. Именно тогда я вспомнил, что когда речь заходит о темах, существует отношение родительского наследования, поскольку docsy-example не имеет папки /static/, он должен использовать папку /static/ своего родителя, репозиторий темы docsy.
    https://github.com/google/docsy/tree/main/static/favicons
  3. Затем я создал /static/favicons/ в своей кодовой базе
    https://myrepo.com/my_hugo_site_that_uses_docsy_theme/static/favicons
    С осознанием того, что если я создам файлы в этой папке, которые совпадают с именами файлов в соответствующей теме docsy /static/ favicons/ моя копия папки будет объединена с копией папки темы, и моя копия переопределит копию темы.
  4. Тогда я был как дерьмо, здесь около 15 файлов, поэтому я RTFM'ировал и нашел эту страницу:
    https://www.docsy.dev/docs/adding-content/iconsimages/#add-your-favicons
    На которой был совет по как использовать http://cthedot.de/icongen для создания этих файлов.

Затем я обнаружил кое-что, не написанное в документах, во время тестирования с использованием цикла быстрой обратной связи Hugo для разработки localhost и проверки качества, что изменение дало желаемый эффект. Если вы обновляете значок, иногда одного режима инкогнито недостаточно, чтобы отразить обновленное изменение. Мне пришлось загрузить запасной браузер и использовать его в режиме инкогнито, чтобы успешно увидеть изменения. Затем в моем обычном браузере мне пришлось очистить кеш / файлы cookie, полностью закрыть все процессы браузера и снова открыть браузер, а затем использовать режим инкогнито, чтобы изменения правильно отражались в браузере, который я обычно использую.

Статические файлы (например, изображение логотипа или значок) помещаются в «статическую» папку. Если вы используете:

  • загруженный шаблон, поместите его в / static / * вашего проекта hugo (чтобы не стереть его при обновлении)
  • ваш собственный темпальте, поместите его в / themes / themeName / static / *

Оба будут доступны по пути вроде: / *

Пример: "/static/ico/myico.ico" и "/themes/themeName/static/ico/myico.ico" будут доступны для бота с "/ico/myico.ico"

Другие вопросы по тегам