amp-web-push-widget button.amp-subscribe { display: inline-flex; align-items: center; border-radius: 5px; border: 0; box-sizing: border-box; margin: 0; padding: 10px 15px; cursor: pointer; outline: none; font-size: 15px; font-weight: 500; background: #4A90E2; margin-top: 7px; color: white; box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.5); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .amp-logo amp-img{width:190px} .amp-menu input{display:none;}.amp-menu li.menu-item-has-children ul{display:none;}.amp-menu li{position:relative;display:block;}.amp-menu > li a{display:block;} .icon-widgets:before {content: "\e1bd";}.icon-search:before {content: "\e8b6";}.icon-shopping-cart:after {content: "\e8cc";}
Categories: Плагины

Как сделать содержание для сайта на WordPress или плагин для оглавления

В этой статье мы расскажем вам об использовании плагина Better Anchor Links для работы с HTML-якорями. Но давайте для начала разберемся, что такое HTML-якорь. На сайтах с большим содержанием статей в самый конец помещают ссылку, при нажатии на которую вы переходите в начало статьи. Это своего рода лифт, поднимающий вас на требуемый этаж. Этажи в данном случае это строки.

Якорь можно настроить на любую строку, таким образом, при нажатии на ссылку пользователь переходит в определённое место статьи. Это облегчает жизнь пользователю, которому в противном случае придется долго прокручивать страницу, это улучшает поведенческие факторы.

Как сделать оглавление без плагина

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

<a id=”title”></a> (добавление id)

 

<a href=”#title “>ссылка на якорь</a>

Однако такой способ занимает больше времени и требует от пользователя хоть какого-то понимания html кода. Подходит он в том случае, если сайт ваш маленький или оглавление используются редко.

Содержание для сайта можно реализовать и без работы с кодом, для этого нужен плагин Batter Anchor Links.

Содержание для сайта с помощью плагина Batter Anchor Links

Скачайте плагин и проведите его стандартную установку и активируйте его. Модуль позволяет автоматически добавлять якоря в заголовки записей. Определение заголовков осуществляется по тегам <h>, о которых речь шла тут.

Особенности и достоинства плагина:

  • Якоря создаются автоматически в заголовках.
  • Можно заменить стили CSS на пользовательские. Для этого потребуется знание CSS.
  • Возможность указания конкретного заголовка для создания якоря.
  • Возможность создания ссылки для возвращения к оглавлению.

Плагин прост и примитивен в работе. Его удобно использовать, если вы делаете якорь на одинаковые заголовки. Если же в каждой статье якоря располагаются на разных позициях, то такой плагин подходит меньше.

Содержание для сайта с плагином TinyMCE Advanced

Также советуем обратить внимание на плагин TinyMCE Advanced. В нем больше настроек и вы можете создавать якоря в произвольных позициях. Кроме этого этот плагин представляет собой продвинутый редактор текста.

После установки плагина в настройках добавьте кнопку «Anchor» в инструментарий редактора. Теперь в любом нужном месте, нажимая на эту кнопку, будет создаваться якорь. Id якоря лучше прописывать латинскими буквами.

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

В целом плагин также прост и удобен в работе.

Адель Гадельшин

View Comments

Recent Posts

Что такое отказы на сайте, почему они происходят, как их уменьшить

Отказы на сайте - это процент посетителей, которые покидают сайт после просмотра только одной страницы.…

9 месяцев ago

Как сделать запуск инфопродукта

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

9 месяцев ago

Как вебмастеру юридически обезопасить себя

Ведение сайта - это не только подержание его работоспособности и наполнение контентом. В последние годы…

9 месяцев ago

Папки WordPress: значение папок /wp-admin, /wp-includes и /wp-content

WordPress - это популярная система управления контентом (CMS), которая позволяет создавать и управлять веб-сайтами различной…

10 месяцев ago

Что такое сертификат Let’s Encrypt и стоит ли его устанавливать

Сертификат Let’s Encrypt - это бесплатный и открытый сертификат SSL/TLS, который позволяет защитить веб-сайт от…

10 месяцев ago

Защита WordPress от вирусов

WordPress - это одна из самых популярных систем управления контентом в мире, которая используется миллионами…

10 месяцев ago