Как добавить значок на бесплатный сайт Weebly?

Favicon (сокращенная форма значка избранного) – это небольшой значок, отображаемый в браузере, который помогает посетителям запомнить ваш бренд. Некоторые браузеры показывают значок в адресной строке ближе к URL-адресу, а некоторые отображаются на вкладке ближе к заголовку вашей страницы. Это профессиональная функция Weebly, и выполните следующие шаги, чтобы легко добавить значок на бесплатный сайт Weebly без обновления до учетной записи Pro.

Как добавить значок в Weebly?

В этой статье мы обсудим следующие темы:

  • Использование файла .ico для значка без создания дополнительной страницы.
  • Использование PNG или JPEG или любого графического файла с дополнительной страницей.
  • Фавикон для профессиональных пользователей Weebly.

Предлагает: Размещайте свои сайты Weebly и WordPress на Bluehost за 2,95 доллара в месяц.

1. Использование файла ICO

Шаг 1. Подготовьте свой Favicon

Перед добавлением значка на сайт вам необходимо иметь изображение логотипа. Ваш логотип может быть в любом стандартном формате изображения, например JPEG и PNG. Когда ваш логотип будет готов, вы можете использовать любой из бесплатных генераторов значков, доступных в Интернете, чтобы преобразовать его в файл .ico.

Один из таких генераторов значков – «freefavicon.com«. Перейдите на сайт и выберите свое изображение, чтобы преобразовать его в файл .ico. Вы также можете создать анимированную версию, добавив к значку прокручиваемый текст. Как только вы будете удовлетворены предварительным просмотром вашего значка, загрузите файл «favicon.ico» на свой локальный компьютер.

Шаг 2. Загрузите значок на свой сайт Weebly

После того, как у вас есть файл .ico, перейдите в свою учетную запись Weebly и отредактируйте сайт, на котором хотите добавить значок. Выберите «Редактировать HTML / CSS» на вкладке «Тема» в редакторе Weebly.

Редактировать HTML CSS в Weebly

Щелкните значок «+» рядом с «Assets», выберите опцию «Upload File (s)» из раскрывающегося списка и загрузите свой файл favicon.ico.

Загрузка значка на бесплатный сайт Weebly
Загрузка значка на бесплатный сайт Weebly

Вы можете видеть, что имя вашего файла указано в разделе «Активы» после того, как вы его загрузили.

Просмотр загруженного файла значка в редакторе тем Weebly
Просмотр загруженного файла значка в редакторе тем Weebly

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

http: // <Имя вашего сайта> .weebly.com / files / theme / <Имя изображения> .ico

Замените «Имя вашего сайта» и «Имя изображения» URL-адресом вашего сайта и именем файла значка. Убедитесь, что вы можете открыть этот URL-адрес значка в браузере. Если этот URL-адрес не работает, щелкните изображение правой кнопкой мыши и скопируйте URL-адрес. Это должно выглядеть так:

https://www.weebly.com/editor/uploads/4/8/5/3/4853992/custom_themes/xxxxx/files/favicon.ico

Шаг 3. Связывание вашего фавикона

Перейдите в раздел «Настройки> SEO> Код заголовка» и вставьте следующий код:

Замените «Your Favicon Link» URL-адресом вашего значка.

Добавить ссылку на значок в разделе кода заголовка Weebly
Добавить ссылку на значок в разделе кода заголовка Weebly

Сохраните свои настройки и опубликуйте свой сайт.

Заметка: Вместо добавления кода на уровне сайта вы также можете вставить код в раздел «Код заголовка» каждой страницы в разделе «Страницы> Выбрать страницу> Настройки SEO> Код заголовка». Таким образом вы можете загрузить несколько значков и связать разные значки с разными страницами вашего сайта Weebly.

Шаг 4. Протестируйте его в различных браузерах

Последний шаг – протестировать ваш значок, открыв свой сайт в различных веб-браузерах, таких как Firefox, Chrome и Edge. Проверьте четкость и посмотрите в различных браузерах и при необходимости отрегулируйте размер своего значка.

Проверьте Favicon в браузере
Проверьте значок в браузере

Иногда для отображения значка в браузере может потребоваться больше времени, вы можете попробовать обновить, очистить кеш или закрыть и открыть браузер.

2. Использование файла изображения PNG или JPEG

В настоящее время Weebly заменяет файл .ico изображением своего значка. Таким образом, описанный выше метод может работать не во всех случаях. В таком случае попробуйте этот метод. Кроме того, если вы не можете создать файл .ico или не хотите изменять тему, этот метод будет полезен.

Следуйте приведенным ниже инструкциям:

  • Создайте новую страницу на вкладке «Страницы» и назовите ее как хотите, например, «favicon».
  • Перетащите элемент «Изображение» на эту страницу и загрузите свое изображение значка. Изображение должно быть .png, .jpg или любым другим стандартным форматом изображения.
  • Помните, что вы не можете загрузить файл .ICO с помощью элемента изображения. Вы увидите сообщение об ошибке, показывающее недопустимый тип файла, и файл должен быть в формате JPEG, GIF или PNG.
  • Опубликуйте свой сайт и скопируйте ссылку на изображение, она должна выглядеть примерно так:

http: // <Имя вашего сайта> .weebly.com / uploads / 1/3/4/0/13404245 / 541135_orig.png

  • Перейдите в «Настройки> SEO> Код заголовка» и вставьте приведенный ниже код:

  • Опубликуйте свой сайт, и теперь значок появится в браузере !!!

2.1. Скрытие страницы Favicon

Любой может увидеть вашу страницу значка, на которой будет одно крошечное изображение. Значит, необходимо скрыть эту страницу от пользователей и поисковых систем.

  • Перейдите на вкладку «Страницы» и установите флажок «Скрыть в навигации», чтобы удалить страницу значка из меню.
  • Перейдите в «Настройки SEO» на странице и выберите «Скрыть эту страницу от поисковых систем», чтобы скрыть страницу от поисковых роботов.
  • Установите «Видимость» страницы с паролем сайта, чтобы даже пользователи, знающие URL-адрес, не могли получить доступ.

3. Вариант Weebly Favicon для премиум-пользователей

Пользователи премиум-плана могут загрузить значок, чтобы их сайт выглядел профессионально. Weebly не предоставляет вам никаких инструментов для создания вашего значка и не предлагает изображения для него. Вам необходимо подготовить собственный файл изображения значка .ico подходящего размера.

3.1. Как загрузить?

  • Войдите в свою учетную запись Weebly Pro и отредактируйте сайт, на который хотите загрузить значок.
  • Перейдите в раздел «Общие», доступный на вкладке «Настройки» сайта.
  • Загрузите свой значок, как показано на рисунке ниже.
  • Опубликуйте свой сайт и проверьте его в браузере (может потребоваться некоторое время, чтобы значок отобразился в браузере)
Фавикон для пользователей Weebly Pro
Фавикон для пользователей Weebly Pro

Предлагает: Размещайте свои сайты Weebly на SiteGround со скидкой 60%.

3.2. Особенности Weebly Favicon Option

  • Просто загрузите файл изображения фавикона.
  • Weebly автоматически активирует значок для вашего сайта в ближайшее время.
  • Поддерживается во всех браузерах, таких как Chrome, Firefox, Edge и Safari.

Важный: При копировании кода кавычки могут быть в фигурном формате. Обязательно используйте прямые кавычки при вставке кодов в редактор кода Weebly.

Похожие записи

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *