Как добавить FAVICON (иконку) к сайту на Тильде

🗓️ Обновлено: 14.01.2021
💬Комментариев: 0
👁️Просмотров: 918

Для начала, давайте разберемся, что такое фавикон и для чего он нужен.

Что такое Фавикон (favicon)

Фавикон — это иконка/значок сайта в браузере. Он отображается на вкладке слева от названия:

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

По умолчанию, на всех сайтах Тильды в фавиконе отображается логотип Тильды:

Как сделать Фавикон

Рекомендую воспользоваться сервисом xiconeditor.com, который полностью позволит вам создать полноценный фавикон.

  1. Переходим на сайт и нажимаем кнопку «Import»:
  1. В открывшемся окне снова жмем «Upload»:
  1. Загрузите картинку, из которой вы хотите сделать фавикон. Допустим, это будет ваш логотип. Загружайте и растяните видимую область фавикона так, как вы хотите, чтоб он отображался. Оставьте галочку только на размере 64х64 и нажмите кнопку «Ok»:
  1. Нажмите «Export»:
  1. Нажмите «Export your icon», чтоб скачать файл фавикона:

После этого начнется загрузка файла favicon.ico, который вам и нужно будет загрузить в Тильду.

Подключение Фавикона к Тильде

Вариант №1

Вам необходимо перейти в настройки вашего сайта на Тильде:

В левой панели ищите вкладку «SEO»:

Переходите на страницу и ищите раздел «РЕДАКТИРОВАНИЕ ИКОНОК (FAVICONS)»:

Нажимайте кнопку «Редактировать» и вы увидите следующую страницу:

На ней можно загрузить подготовленный вами файл Фавикона, кликнув на кнопке «Upload file».

Кроме того, вы сможете отдельно загрузить иконку для закладок в браузере SAFARI.

Еще вы можете загрузить иконку для плиток в Windows 10 и подобрать цвет плитки:

Нажимайте сохранить и опубликуйте все странницы сайта, чтоб все изменения вступили в силу.

Вариант №2

Идем в настройки вашего сайта:

Дальше внизу слева вы увидите вкладку «Еще». Переходите:

В открывшейся странице перед вашими глазами сразу возникнет раздел «Favicon» с кнопкой «Upload file»:

Нажимайте и загружайте свой подготовленный файл Фавикона.

Нажимайте «Сохранить изменения» и опубликуйте все страницы сайта, чтоб все изменения вступили в силу.

В итоге

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

Если остались еще какие-то вопросы, то посмотрите видео на нашем канале WEB-головоломки. На этом канале еще много интересного

Статья была полезной?
👍
Да - 2
👎
Нет - 0
💬 Комментарии:

CSS Головоломки в Telegram
Подписывайся и не пропускай:
Актуальные новости
Интересные задачки
Полезные подборки
Вступай в клуб
🧑‍💻Присоединяйся к сообществу!
Patreon
Наш рейтинг
🏆Лучший хостинг для сайта
9/10
8/10
8/10
4
8/10
Где учиться
🧑‍🎓Рекомендуемые курсы
Javascript-разработчик
Введение в программирование
SEO-специалист
Проверка знаний
🤔Хорошо ли вы знаете CSS?
Есть два блочных элемента, которые идут друг за другом в html. Какой будет оступ (margin) между ними, если задать им такие стили:

.top {
  height: 30px;
  background-color: blue;
  margin-bottom: 10px;
}
.bottom {
  height: 30px;
  background-color: red;
  margin-top: 20px;
}
    
10px
20px
30px
Very Peri
🤔Цвет 2022 года
Институт цвета Pantone объявил цвет 2022 года. Это сиреневый оттенок под названием 17-3938 Very Peri.
#6667ab