TechBlogSD - Все для WordPress и WEB разработки
WEB и WordPress инструкции, новости, обзоры тем и плагинов

Как добавить панировочные сухари на сайт Weebly?

21

Внутренняя структура сайта – один из важных факторов SEO, который помогает Google и другим поисковым системам легко понять ваш сайт. Помимо ссылки на другие страницы вашего сайта, добавление хлебных крошек может помочь пользователям переходить к различным разделам. Если вы не знаете о хлебных крошках, это дополнительные навигационные ссылки, обычно отображаемые в верхней части веб-страницы, содержащей структуру. Это помогает пользователям легко переходить к категориям или разделам верхнего уровня с текущей страницы.

По теме: Как добавить хлебные крошки на сайт WordPress?

Примеры панировочных сухарей

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

Как добавить панировочные сухари на сайт Weebly?

Примеры панировочных сухарей

Как видите, он обеспечивает относительное положение текущей страницы среди всего сайта, что-то вроде доски с выводами «Вы здесь!» На карте.

Weebly и Breadcrumb

Weebly не предлагает по умолчанию строки навигации элемента, чтобы добавить его на своем сайте. Однако вы можете использовать собственный CSS / HTML и вручную вставлять хлебные крошки на каждую страницу. Здесь мы покажем вам шесть различных хлебных крошек стилей CSS, которые вы можете добавить на свой сайт Weebly.

Примечание. Помните, что это простые панировочные сухари, выполняемые вручную. Это не часть схемы, и, следовательно, поисковые системы не будут отображать их в результатах поиска, как веб-сайты WordPress.

Прежде чем мы начнем, предварительным условием для создания хлебных крошек является структурированность ваших страниц. Хотя нет необходимости располагать страницы в соответствии с навигационной цепочкой, мы настоятельно рекомендуем поддерживать необходимую иерархию на вкладке «Страницы» и соответствующим образом выстраивать навигацию. Мы объясним это на примере структуры: «Домашняя страница> Создание сайта> Weebly> Советы и рекомендации Weebly> Эта страница». Для создания навигационной цепочки требуется пять блоков с соответствующими ссылками.

В хлебных крошках используется простой код CSS и HTML, поэтому код CSS должен быть добавлен в таблицу стилей, а код HTML должен быть встроен на требуемую страницу. Поскольку вам может потребоваться разместить хлебные крошки на нескольких страницах, рекомендуется добавить код CSS в «Тема> Редактировать HTML / CSS > Стили> main.less», как показано ниже:

Как добавить панировочные сухари на сайт Weebly?

Редактирование основного файла CSS в Weebly

HTML-код должен быть вставлен на страницу с помощью элемента «Вставить код» над содержимым.

Стиль 1 и 2

Ниже панировочные сухари для стилей 1 и 2 имеют общий класс CSS с незначительным добавлением кода для второго стиля.

CSS Breadcrumb Style 1

CSS Breadcrumb Style 2

Стиль 3, 4, 5 и бонус 6

CSS Breadcrumb Style 3

CSS Breadcrumb Style 4

CSS Breadcrumb Style 5

Бонусный стиль CSS Breadcrumb 6

Нажмите кнопку ниже, чтобы получить код CSS / HTML для всех вышеупомянутых хлебных крошек, и код CSS выделен для каждого стиля.

Для этих хлебных крошек требуется четыре изображения, которые вы можете скачать ниже и загрузить на свой сайт Weebly. Не забудьте заменить URL-адреса изображений внутри CSS своими собственными URL-адресами.

Примечание: стили 1, 2, 3 и 4 хлебных крошек в загруженном CSS представляют собой примеры 3, 4, 5 и 6 соответственно, как показано выше. Не забудьте заменить ссылки на изображения своими собственными URL-адресами.

Источник записи: www.webnots.com
Leave A Reply

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