Ссылка на определенное место страницы: Как скопировать ссылку на определенное место на странице? — Хабр Q&A – Ссылка на определенное место страницы сайта

Ссылка на определенное место страницы сайта

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

Пример использования: Запрет вывода на определенной странице

Опубликованный ниже код подходит для использования на любых сайтах, в том числе и на сайтах WordPress. Разумеется, в WordPress это нужно делать в режиме html. Для того, чтобы иметь возможность установки ссылки на определенное место любой страницы сайта, необходимо обозначить это место специальной меткой, сделать это можно при помощи следующего кода:

<a>место для вашей метки</a>

<a>место для вашей метки</a>

После этого, нужно правильно установить саму ссылку, код ссылки будет выглядеть следующим образом:

<a href="http://Ваш-Сайт.ru/Страница-сайта/#metka " target="_blank">Анкор вашей ссылки</a>

<a href=»http://Ваш-Сайт.ru/Страница-сайта/#metka » target=»_blank»>Анкор вашей ссылки</a>

target=»_blank» говорит о том, что страница будет открыта на новой вкладке!

В том случае, если нужно установить несколько ссылок на разные места одной страницы, вам, соответственно, придется задать необходимое число разных меток, например:

<a>место для вашей метки</a>

<a>место для вашей метки</a>

<a>место для вашей метки</a>

<a>место для вашей метки</a>

И так далее…

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

Это полезно знать:

на Ваш сайт.

Как сделать ссылку на определенную часть страницы — Полезные советы

Все пользователи, которые так или иначе связаны с сайтами, их созданием или редактированием ежедневно встречаются с созданием ссылок на различные материалы. И наверняка каждых из них знает, как и при помощи какого html-тега сделать ссылку на какой-либо материал в интернете.

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

Что бы понять, что мы имеем ввиду, посмотрите оформление нашей недавней инструкции про то, как включить сохранение вкладок при закрытии разных браузеров. Вверху страницы как раз реализовано такое меню, в котором сделаны ссылки на определенное место страницы.

1. Присвойте якорь части страницы

Первым пунктом вам нужно присвоить так называемый «якорь» (anchor) той части страницы, на которую пользователя должно перекидывать при нажатии на ссылку. Для этого перед текстом в этой части страницы вставьте следующий код

где вместо «anchor» вставьте любое слово, желательно подходящее по смыслу к абзацу, на который ссылаетесь.

2. Сделайте ссылку на «якорь»

Вторым делом вам нужно сделать ссылку на установленный в первом пункте «якорь» в том месте страницы, откуда пользователь, по вашему мнению, может захотеть перейти к части текста, на которую вы ссылаетесь. Например, это может быть оглавление в начале статьи. Ссылка на «якорь» выглядит следующим образом

где «anchor» замените на то слово, которое выбрали в первом пункте статьи.

2. Сделайте ссылку на anchor другой страницы

Как и в предыдущем случае, вам нужно просто поставить ссылку на созданный ранее «якорь». Разница лишь в том, что ссылаясь на часть другой страницы вам нужно добавить её URL в код, который в резу

Как сделать ссылку на определенное место текущей страницы

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

1. Присвойте якорь части страницы

Первым пунктом вам нужно присвоить так называемый «якорь» (anchor) той части страницы, на которую пользователя должно перекидывать при нажатии на ссылку. Для этого перед текстом в этой части страницы вставьте следующий код

<a id=“anchor”></a> Текст страницы…

где вместо «anchor» вставьте любое слово, желательно подходящее по смыслу к абзацу, на который ссылаетесь.

2. Сделайте ссылку на «якорь»

Вторым делом вам нужно сделать ссылку на установленный в первом пункте «якорь» в том месте страницы, откуда пользователь, по вашему мнению, может захотеть перейти к части текста, на которую вы ссылаетесь. Например, это может быть оглавление в начале статьи. Ссылка на «якорь» выглядит следующим образом

<a href=“#anchor”>Текст ссылки</a>

где «anchor» замените на то слово, которое выбрали в первом пункте статьи.

Как сделать ссылку на определенную часть другой страницы

Таким же способом, который мы рассмотрели выше, можно ставить ссылки не только на часть текста на той же странице, но и на определенное место любой другой страницы. Главное, что бы у вас была возможность разместить там «якорь». Делается это следующим образом:

1. Присвойте «якорь» странице-реципиенту

Как и в предыдущем пункте, присвойте «якорь» нужной части той страницы, на которую пользователь должен переходить при нажатии на ссылку, выглядит это все так же:

<a id=“anchor”></a> Текст страницы…

где вместо «anchor» вы так должны вставить любое слово по вашему желанию.

2. Сделайте ссылку на anchor другой страницы

Как и в предыдущем случае, вам нужно просто поставить ссылку на созданный ранее «якорь». Разница лишь в том, что ссылаясь на часть другой страницы вам нужно добавить её URL в код, который в результате будет выглядеть следующим образом

<a href=“http://адрес#anchor”>Текст ссылки</a>

где вместо «адрес страницы» вам нужно подставить, соответственно, URL страницы, на которую ссылаетесь, а вместо «anchor» текст, выбранный вами при создании «якоря».

Пример ссылки на часть страницы

Для примера, нажав на эту ссылку вы перейдете к началу статьи. Соответственно, в самом начале статьи мы вставили код

<a id=“top”>

а код ссылки выглядит вот так

<a href=“#top”>эту ссылку</a>

Если бы эта ссылка на начало статьи была размещена на другой странице или другом сайте, то её код выглядел бы следующим образом

<a href=“http://ochprosto.com/sdelat-ssylku-na-opredelennuyu-chast-stranicy#top”>Текст ссылки</a>

https://ochprosto.com/sdelat-ssylku-na-opredelennuyu-chast-stranicy/#top

Поделиться:

• Click to share on Facebook (Открывается в новом окне)
• Нажмите, чтобы поделиться на Twitter (Открывается в новом окне)
• Нажмите, чтобы поделиться на LinkedIn (Открывается в новом окне)
• Нажмите, чтобы поделиться в Telegram (Открывается в новом окне)
• Нажмите, чтобы поделиться записями на Pinterest (Открывается в новом окне)
• Нажмите, чтобы поделиться записями на Tumblr (Открывается в новом окне)
• Нажмите, чтобы поделиться в Одноклассники (Открывается в новом окне)
• Нажмите, чтобы поделиться на Reddit (Открывается в новом окне)
• Click to share on Skype (Открывается в новом окне)
• Нажмите, чтобы поделиться в Вконтакте (Открывается в новом окне)
• Нажмите, чтобы поделиться в StumbleUpon (Открывается в новом окне)
• Нажмите, чтобы поделиться в WhatsApp (Открывается в новом окне)
• Нажмите, чтобы поделиться записями на Pocket (Открывается в новом окне)
• Послать это другу (Открывается в новом окне)
• Нажмите для печати (Открывается в новом окне)

Понравилось это:

Нравится Загрузка…

Похожее

Mediawiki ссылка внутри страницы на определенное место, а не на раздел

1. Вопрос

Если я кодирую, как показано ниже, то у меня есть ссылка внутри страницы на конкретный «section»

[[#SectionTitle|displayed text]]

Но что, если я хочу иметь ссылку на странице на место, я имею в виду любое место?

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

Я пробовал что-то вроде этого

[[#Foo|displayed text]]
{{anchor|Foo}}

Это, казалось, попросило меня сделать страницу Template:Anchor

Поэтому я скопировал страницу Template:Anchor Википедии.

Но Template:Anchor снова, казалось, попросил сделать какую-то новую страницу, потому что Template:Anchor только говорит

{{#invoke:anchor|main}}

Так что моя попытка не сработала.

Поделиться Источник user1849133     14 мая 2014 в 13:43

2 Ответа

12

Используйте следующее Для создания якоря:

<div>optional text</div>

на которые можно ссылаться как:

[[#NameOfAnchorHere| test]]

Более подробную информацию о связывании в MediaWiki можно найти здесь

<span>optional text</span>