Tilda

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

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

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

Что такое Фавикон (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-головоломки. На этом канале еще много интересного

Статья была полезной?
👍
Да - 4
👎
Нет - 0
Рекомендуем к прочтению
Как восстановить удаленный блок в Тильде
Как подключить платежную систему LiqPay к Тильде (Tilda)
Как скопировать страницу в Тильде
💬Комментарии:

CSS Головоломки в Telegram
Подписывайся и не пропускай:
Актуальные новости
Интересные задачки
Полезные подборки
Перейти в Telegram
Наш рейтинг
🏆Лучший хостинг для сайта
1
Ukraine
9/10
2
HostPro
8/10
3
TutHost
8/10
4
Hostiq
8/10
5
Cityhost
8/10
6
Freehost
7/10
7
UAhosting
7/10
Что читают?
🏆Популярные записи
Как сделать гамбургер (бургер) меню — готовый код и подробное объяснение
Просмотров: 56410
Как сделать плавное увеличение картинки при наведении — эффект на чистом CSS
Просмотров: 42571
Появление элементов при скролле
Просмотров: 41854
Как выровнять картинку по центру с помощью CSS
Просмотров: 29195
Как изменить цвет SVG в CSS
Просмотров: 29079
Проверка знаний
🤔Хорошо ли вы знаете CSS?
Есть два блочных элемента, которые идут друг за другом в html. Какой будет оступ (margin) между ними, если задать им такие стили: 

.top {
  height: 30px;
  background-color: blue;
  margin-bottom: 10px;
}
.bottom {
  height: 30px;
  background-color: red;
  margin-top: 20px;
}
10px
20px
30px
Viva Magenta
🤔Цвет 2023 года
Исследовательский институт Pantone выбрал главный цвет 2023 года. Им стал карминово-красный оттенок с фиолетовым подтоном, который назвали Viva Magenta.
#bb2649