Ростелеком

Добавить в избранное. Как сделать кнопку "добавить в избранное"

Тема очень популярная. Сервисы с созданием он-лайн закладок пользуются популярностью, но давайте попробуем решить задачу. Не будем использовать сторонний сервис, а решим данную проблему на сайте. В итоге посетитель, нажав на ссылку, сможет добавить сайт в закладки (аналогично Ctrl+D и тп).

Как добавить сайт в закладки (избранное)? Используем JavaScript Создаём файл с названием bookmark.js . В него вставляем указанный ниже код.

Код JavaScript (файл bookmark.js )

Function AddToBookmark(a)
{
var title = window.document.title; // запоминаем заголовок активной страницы/вкладки
var url = window.document.location; // адрес тоже запоминаем

If (window.sidebar) { // такой объект есть только в Gecko
window.sidebar.addPanel(title, url, ""); // используем его метод добавления закладки
}
else if (typeof(opera)=="object") { // есть объект opera?
a.rel="sidebar"; // добавлем закладку, смотрите вызов функции ниже
a.title=title;
a.url=url;
return true;
}
else if(document.all) { // ну значит это Internet Explorer
window.external.AddFavorite(url, title); // используем соответсвующий метод
}
else {
alert("Для добавления страницы в Избранное нажмите Ctrl+D"); // для всех остальных браузеров, в т.ч. Chrome
}

Return false;
}
Ну и чтобы скрипт заработал, достаточно подключить файл bookmark.js и вставить ссылку с js , которая при клике вызывала бы работу скрипта.

Код HTML



Пример работы Добавления вкладок


Добавить ссылку в избранное



На самом деле я бы рекомендовал остановиться на этом варианте. Второй я предложу уже больше ради разнообразия, поскольку в нём есть свои проблемы.

Как добавить сайт в избранное? Второй вариант Раньше функция работала только в Internet Explorer, а после правок в HTML 5 работает в Opera и Mozilla, но не во всех версиях IE и Chrome.

Перед закрывающим тегом head вставляем


function addYoursite() {
if (document.all) window.external.addFavorite("http:/yoursite.ru", "Сайт yoursite.ru");
}

Только соответственно меняем yoursite.ru на адрес Вашего сайта.

Добавить в избранное

И соответственно тоже меняем yoursite.ru на адрес Вашего сайта.

Готово. Проверяем.

В прошлом своём уроке я рассказывала о том, что такое раздел Избранное в ЖЖ. И несмотря на один довольно чувствительный минус, многие всё равно заинтересовались тем, что это такое и как работает (и неудивительно — штука на самом деле хорошая). Так что сегодня я расскажу самое главное — как же добавить интересную запись в избранное, чтобы потом не плутать по ЖЖ в её поисках, а сразу найти.

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

Искать её нужно над текстом записи на небольшой панельки. Она может выглядеть вот так:

Всё зависит от того, какое оформление используется в журнале автора этой записи (или в вашем, если вы смотрите другие журналы в своём оформлении).

Если кнопку вы найти не можете (такое тоже бывает - в ЖЖ очень много стилей оформления, и в некоторых панели с кнопками нет. плюс любой пользователь может самостоятельно настроить дизайн своего журнала), ищите ссылку «В избранное» или «Добавить в избранное» под текстом записи:

В некоторых стилях она доступна уже в ленте друзей. В новой ленте друзей она будет у всех:

Если вы видите такую страницу — ура, вы нашли нужную ссылку или кнопку.

Вариант простой (и в перспективе неудобный)

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

Вариант сложнее и удобнее

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

  • Описание : по умолчанию в нём отображается дата публикации записи и её заголовок. Вы можете написать там что угодно. Например, вместо «2012-12-04: school_lj: Как создать аккаунт в ЖЖ?» просто «Как создать аккаунт в ЖЖ?». Поверьте, это будет гораздо читабельнее
    Максимальная длина описания — 40 русских букв (если пишете по-английски, то 80)

  • Ключевые слова : вы можете добавить одно или несколько ключевых слов для записи, и она будет помещена в категорию с таким названием.
    Можно ввести до 5 ключевых слов (то есть одну запись можно поместить в 5 разных категорий), разделяя их запятыми. Каждое ключевое слово должно быть не больше 20 русских букв (40, если пишете по-английски)

  • Доступ к записи : то есть кто сможет увидеть ваш список избранных записей. По умолчанию они видны всем (а доступ к ним есть из вашего профиля), но вы можете выбрать уровень «Друзья» или «Только мне (личное)». Соответственно, список избранного будет виден только вашим друзьям или только вам.
    Обратите внимание, что если вы добавите в избранное подзамочную запись и поставите уровень «Каждому (публичное)», то ссылка на неё будет отображаться в списке, но саму запись те, у кого нет к ней доступа, не увидят.

После выбора всех нужных настроек нажмите на кнопку «Сохранить», и ваше избранное будет выглядеть гораздо опрятнее. Я уже начала составлять оглавление Школы ЖЖ в избранном сообщества (кстати, про такую каталогизацию напишу подробный урок, владельцам сообщества может пригодиться), и оно выглядит так .

Повторюсь, доступ к Избранному есть из профиля журнала или сообщества. Вот на примере Школы ЖЖ:

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

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

Здесь работает психология. Дело в том, что видя на сайте предложение о добавлении в избранное, пользователь задумывается нужно ли ему это. И если он решит, что сайт, действительно, полезен, то добавит его в список закладок. А если предложения не поступит, то пользователь и не задумается над этим вопросом. Именно поэтому нужно предлагать: кто стучится - тому открывают.

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

Размещать кнопку "Добавить в избранное" на сайте нужно на видном месте, но не слишком навязчиво. Лучшее место для такой кнопки - шапка, либо боковая часть сайта.

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

Код кнопки "Добавить сайт в избранное"

Большинство современных браузеров, с приходом стандарта HTML5, поддерживают атрибут rel="sidebar" .

Добавление сайта в избранное - "Нубекс" function addSite() { if (document.all) window.external.addFavorite("http://сайт", "Конструктор сайтов "Нубекс""); }

Не забудьте добавить наш сайт в закладки! (Для браузера Google Chrome нажмите Ctrl+D)

Добавить сайт в избранное

Но помните, что в браузере Google Chrome невозможно добавить сайт в закладки с помощью кнопки на сайте. Для этого есть специальная комбинация клавиш: Ctrl+D , поэтому не забудьте сообщить пользователю об этом.

Отслеживать количество пользователей, добавивших ваш сайт в закладки, можно, например, с помощью сервиса Яндекс.Метрика ("Посещаемость" - "Конверсии").

Одно время на сайтах была популярна ссылка «Добавить сайт в избранное», при нажатии на которую адрес сайта заносился в закладки браузера. Впрочем, почему была? Периодически на сайтах подобная ссылка встречается до сих пор. Беда в том, что используемый для этой цели скрипт не работает во многих браузерах, поэтому его ценность близка к нулю. В HTML5 расширились возможности атрибута rel тега и теперь с его помощью можно легко добавлять в избранное любые сайты и отдельные страницы.

Достаточно к ссылке добавить rel="sidebar" и при нажатии на нее откроется специальная панель в браузере для создания новой закладки. Пока значение sidebar поддерживают два браузера - Firefox и Opera, остальные игнорируют атрибут rel и переходят по указанной ссылке как обычно.

Чтобы расширить количество браузеров и добавить к ним IE, к ссылке также можно подключить небольшой скрипт. В итоге получится, что Firefox, Opera, Internet Explorer вызовут специальную панель, остальные браузеры перейдут по ссылке (пример 1).

Пример 1. Добавление в избранное

HTML5 IE Cr Op Sa Fx

Добавить в избранное function addBookmark() { if (document.all) window.external..ru"); }

Добавить в избранное

Как в итоге выглядит применение rel="sidebar" ? Результат зависит от браузера. Firefox к примеру открывает такое окно (рис. 1).

Рис. 1. Добавление в избранное в Firefox

В Opere вид несколько другой, но смысл аналогичный (рис. 2).

Рис. 2. Добавление в избранное в браузере Opera

У Internet Explorer самый лаконичный интерфейс (рис. 3).

Рис. 3. Добавление в избранное в браузере Internet Explorer

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