Адреса страниц и ссылки на другие страницы
При работе в редакторе отображается системный (не публичный) адрес страницы. Он не видим никому, кроме вас. Этот адрес нельзя отправить другому человеку или использовать в качестве ссылки на опубликованном сайте.
Чтобы получить публичную ссылку на страницу, опубликуйте её. После этого вы сможете использовать её для добавления на элементы вашего сайта, размещать в социальных сетях и т.д.
Якоря и ссылки внутри страницы
Поставить ссылку, которая ведет внутрь страницы к конкретному блоку (разделу), можно двумя способами:
1. Добавьте в нужное место специальный блок — T173 Якорная ссылка из категории Другое. В Контенте T173 пропишите желаемое название для якоря, например: «contacts». И можно теперь переходить к этому месту, в котором находится блок T173, указывая ссылку вида «#contacts» на кнопках или в меню. Сам блок невидимый.
2. Поставить ссылку на любой блок: Для этого вам нужно в адресе ссылки прописать «#rec129000». Этот уникальный номер есть у каждого блока. Его можно найти в контекстной панели Settings блока (в самом низу). Обратите внимание, что если вы скопируете страницу, то номера блоков поменяются и вам нужно будет поставить ссылки заново.
Чтобы по ссылке посетитель сайта переходил к конкретному месту на другой странице, поставьте ссылку вида: /pagename#anchorname , где pagename — это адрес страницы, на которую нужно перейти, а anchorname — название якоря, который обозначает место, куда должен быть отправлен посетитель.
Если вы хотите, чтобы переход к назначенному блоку был плавным, «скользящим», добавьте на страницу блок T178 (Библиотека блоков → Другое → Плавный скролл до локальной ссылки).
Обращаем внимание, что на странице достаточно одного такого модификатора — использование нескольких на одной странице может привести к ошибкам.
Как сделать кликабельные email и номер телефона
Чтобы при клике на номер телефона начинался звонок или при клике на email открывался почтовый клиент, нужно навесить на них ссылки.
1. Ссылка, которую нужно задать тексту с номером телефона: tel:+71234567890 (все без пробела). Будет работать при просмотре сайта на мобильном телефоне, в случае открытия на компьютере откроет приложение, которое используется для звонков, если оно есть.
2. Пропишите в поле для ссылки ваш email, например, yourmail@mysite.com. При клике будет открываться приложение почты, которое установлено на устройстве посетителя.
Для кнопки укажите ваш email, начиная с mailto: , например, mailto:yourmail@mysite.com. При клике будет открываться приложение почты, которое установлено на устройстве посетителя.
Как создать HTML кнопку, которая действует как ссылка
Есть много способов создания HTML кнопки, которая действует как ссылка, т.е., когда вы нажимаете на эту кнопку, она перенаправляется на указанный URL-адрес.
Вы можете выбрать один из следующих методов добавления ссылки на HTML кнопку.
Добавьте строчный onclick event
Пример
html> html> head> title>Заголовок документа title> head> body> button onclick="window.location.href = 'https://w3docs.com';">Click Here button> body> html>Этот пример может не работать, если кнопка находится внутри тега .
Пример
html> html> head> title>Заголовок документа title> head> body> form> input type="button" onclick="window.location.href = 'https://www.w3docs.com';" value="w3docs"/> form> body> html>Ссылки не будут работать, если JavaScript не используется, а поисковая система может проигнорировать такие ссылки.
Используйте атрибут action или formaction внутри элемента .
- атрибут action
Пример
html> html> head> title>Заголовок документа title> head> body> form action="https://www.w3docs.com/"> button type="submit">Click me button> form> body> html>Для того, чтобы открыть ссылку в новой вкладке, добавьте атрибут target=»_blank» .
Пример
html> html> head> title>Заголовок документа title> head> body> form action="https://www.w3docs.com/" method="get" target="_blank"> button type="submit">Click me button> form> body> html>Так как нет форм и данных, этот пример семантически не будет иметь смысла. Но данная разметка допустима.
- б. атрибут HTML5 formaction .
Пример
html> html> head> title>Заголовок документа title> head> body> form> button type="submit" formaction="https://www.w3docs.com">Click me button> form> body> html>Атрибут formaction используется только для кнопок с type=”submit”. Так как этот атрибут является HTML5-specific, он может слабо поддерживаться в старых браузерах.
Добавьте ссылку в стиле HTML кнопки (используя CSS)
Пример
html> html> head> title>Заголовок документа title> style> .button < background-color: #FF4500; border: none; color: white; padding: 20px 34px; text-align: center; text-decoration: none; display: inline-block; font-size: 20px; margin: 4px 2px; cursor: pointer; > style> head> body> a href="https://www.w3docs.com/" class="button">Click Here a> body> html>Так как требуется сложное стилевое оформление, этот метод может не работать в некоторых браузерах.