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";}
В этой статье мы расскажем вам об использовании плагина Better Anchor Links для работы с HTML-якорями. Но давайте для начала разберемся, что такое HTML-якорь. На сайтах с большим содержанием статей в самый конец помещают ссылку, при нажатии на которую вы переходите в начало статьи. Это своего рода лифт, поднимающий вас на требуемый этаж. Этажи в данном случае это строки.
Якорь можно настроить на любую строку, таким образом, при нажатии на ссылку пользователь переходит в определённое место статьи. Это облегчает жизнь пользователю, которому в противном случае придется долго прокручивать страницу, это улучшает поведенческие факторы.
Обычно, для создания оглавления, напротив строки, на которую должен будет перейти пользователь, задают ее id, которое в дальнейшем прописывают в коде ссылки в самом содержании. Выглядит это примерно так:
<a id=”title”></a> (добавление id)
<a href=”#title “>ссылка на якорь</a>
Однако такой способ занимает больше времени и требует от пользователя хоть какого-то понимания html кода. Подходит он в том случае, если сайт ваш маленький или оглавление используются редко.
Содержание для сайта можно реализовать и без работы с кодом, для этого нужен плагин Batter Anchor Links.
Скачайте плагин и проведите его стандартную установку и активируйте его. Модуль позволяет автоматически добавлять якоря в заголовки записей. Определение заголовков осуществляется по тегам <h>, о которых речь шла тут.
Особенности и достоинства плагина:
Плагин прост и примитивен в работе. Его удобно использовать, если вы делаете якорь на одинаковые заголовки. Если же в каждой статье якоря располагаются на разных позициях, то такой плагин подходит меньше.
Также советуем обратить внимание на плагин TinyMCE Advanced. В нем больше настроек и вы можете создавать якоря в произвольных позициях. Кроме этого этот плагин представляет собой продвинутый редактор текста.
После установки плагина в настройках добавьте кнопку «Anchor» в инструментарий редактора. Теперь в любом нужном месте, нажимая на эту кнопку, будет создаваться якорь. Id якоря лучше прописывать латинскими буквами.
После добавления якоря перед якорной строкой появится значок якоря. Это говорит о том, что элемент добавлен успешно. Теперь можно создать ссылку на якорь.
В целом плагин также прост и удобен в работе.
Отказы на сайте - это процент посетителей, которые покидают сайт после просмотра только одной страницы.…
Инфопродукт - это любой продукт, который содержит информацию, полезную для потенциальных клиентов. Это может быть…
Ведение сайта - это не только подержание его работоспособности и наполнение контентом. В последние годы…
WordPress - это популярная система управления контентом (CMS), которая позволяет создавать и управлять веб-сайтами различной…
Сертификат Let’s Encrypt - это бесплатный и открытый сертификат SSL/TLS, который позволяет защитить веб-сайт от…
WordPress - это одна из самых популярных систем управления контентом в мире, которая используется миллионами…
View Comments
Довольно интересная информация.