Blog. Just Blog

Кроссбраузерное добавление страницы в закладки

Версия для печати Добавить в Избранное Отправить на E-Mail 25.11.2008 | Категория: Web-мастеру и не только | Автор: ManHunter
Кроссбраузерное добавление страницы в закладки реализуется с использованием JavaScript. Для добавления страницы в Избранное браузеров Internet Explorer и браузеров, работающих на движке IE, вызывается стандартный метод AddFavorite. Однако здесь есть одна важная деталь. Если страница IE открыта как embedded-объект в другом приложении, например в плагинах или при использовании компонентов для работы с html, то объект window.external присутствует, но его метод AddFavorite не срабатывает. Это наиболее частая ошибка разработчиков, которые просто копируют код друг у друга без его понимания и тестирования. Также большой ошибкой будет использование на своем сайте только одного этого способа.

Браузеры на движке Gecko, такие как Firefox, Netscape, K-Meleon и другие, имеют объект window.sidebar и метод для добавления addPanel. Третий параметр метода недокументирован и является необязательным, поэтому в скрипте заменяется просто пустой строкой. Обратите внимание, что по умолчанию ссылка добавляется не совсем в закладки, а в боковую панель браузера. Для добавления страницы в нужную папку закладок выберите ее в выпадающем меню. С версии 23 в Firefox не поддерживается метод addPanel, в этом случае надо использовать метод добавления Opera.

Для браузера Opera ссылка добавления в закладки должна иметь атрибут rel="sidebar". Но если этот атрибут ставить сразу по умолчанию, то некоторые браузеры типа Netscape будут отрабатывать функцию добавления в закладки дважды: первый раз через скрипт и второй раз через атрибут rel. Поэтому придется изменять атрибуты ссылки динамически, предварительно определив браузер проверкой типа объекта opera.

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

Теперь, когда у нас есть все исходные данные, можно написать кроссбраузерный скрипт для добавления страницы в закладки. У меня получился вот такой:
Code (JavaScript) : Убрать нумерацию
  1. // Добавить в Избранное
  2. function add_favorite(a) {
  3.   title=document.title;
  4.   url=document.location;
  5.   try {
  6.     // Internet Explorer
  7.     window.external.AddFavorite(url, title);
  8.   }
  9.   catch (e) {
  10.     try {
  11.       // Mozilla
  12.       window.sidebar.addPanel(title, url, "");
  13.     }
  14.     catch (e) {
  15.       // Opera и Firefox 23+
  16.       if (typeof(opera)=="object" || window.sidebar) {
  17.         a.rel="sidebar";
  18.         a.title=title;
  19.         a.url=url;
  20.         a.href=url;
  21.         return true;
  22.       }
  23.       else {
  24.         // Unknown
  25.         alert('Нажмите Ctrl-D чтобы добавить страницу в закладки');
  26.       }
  27.     }
  28.   }
  29.   return false;
  30. }
Пример ссылки "Добавить в Избранное" для этого скрипта:
Code (HTML) : Убрать нумерацию
  1. <a href="#" onclick="return add_favorite(this);">Добавить в Избранное</a>
Рабочий пример реализации вы можете увидеть прямо на этой странице. Использование конструкций try-catch позволяет скрипту правильно отрабатывать в любых нестандартных ситуациях, например в окне IE Tab, открытом в браузере Firefox. Также скрипт корректно работает в различных экзотических браузерах, которые нельзя однозначно определить через UserAgent или DOM-свойства. Всякие хваленые коммерческие поделки типа DLE в этой ситуации молча обламываются.

Ищется документация по движку WebKit (браузеры Safari, Chrome) в части добавления страницы в закладки. Кто найдет - большая просьба поделиться.

UPD: выяснилась интересная реакция некоторых "антивирусов" на этот скрипт. Подробности можете почитать у меня на сайте.

Поделиться ссылкой ВКонтакте
Просмотров: 35804 | Комментариев: 89

Внимание! Статья опубликована больше года назад, информация могла устареть!

Комментарии

Отзывы посетителей сайта о статье
ManHunter (08.09.2017 в 06:46):
Одного раза не хватило?
Дмитрий (08.09.2017 в 01:31):
Для всех, кого интересует веб программирование, прошу оценить новый редактор кода на [спам]
Станислав (28.10.2014 в 11:17):
Спустя годы информация актуальна и все работает. Спасибо за ваши бесплатные заметки и советы.
Все работает.
ManHunter (13.07.2014 в 02:29):
Вот это http://rghost.ru/56864345/image.png совсем не видно?
Станислав (13.07.2014 в 01:15):
На этой странице действительно не видно ссылку добавить в избранное. Так что Сантехник от части прав.

скрипт интересный. а на HTML нет возможности сделать?
ManHunter (14.10.2013 в 14:07):
sidebar.addPanel удален из Firefox начиная с 23-й версии. Подправил скрипт, дополнил статью, теперь все нормально.
Серёга (10.10.2013 в 16:28):
по вашей кнопке добавить в избранное в браузере мозилла пишет Нажмите Ctrl-D чтобы добавить страницу в закладки
Александр (29.06.2013 в 02:31):
Спасибо, помог.
Сергей (11.04.2013 в 13:38):
А как его всавить на сайт, помогите пожалуйста.

Отбой, протупил. Спасибо всё работает.
ManHunter (01.03.2013 в 16:02):
Сантехник, ты в курсе, что ты просто очередной тупой и криворукий уёбок? Иди в унитазы заныривай, нехуй в скрипты лезть.

Для остальных особо одаренных и слабовидящих: кнопка "Добавить в Избранное" в виде сердечка находится под заголовком статьи.
Сантехник (01.03.2013 в 16:01):
Гавно скрипт!
@Иван Только нигде не найду у вас на сайте ссылку "Добавить в Избранное"...@

Поэтому и нет, что не работает. Спам это!
ManHunter (20.01.2013 в 10:57):
Firefox 17.0.1 - работает, 18.0.1 - работает. Что я делаю не так?
Виталий (09.01.2013 в 20:07):
В Firefox 17 версии скрипт не работает, как быть?
Dmitry (28.11.2012 в 11:56):
У Chrome отсутствует программный способ добавления страницы в закладки.
ManHunter (15.08.2012 в 18:08):
Исходники Firefox открыты, можно подправить и пересобрать ее под себя. А лучше написать разработчикам, чтобы они перестали тупить и сделали нормальное добавление в закладки, без всяких боковых панелей, выбора всяких каталогов и прочей ненужной херни.
DjVu (15.08.2012 в 18:03):
Скажите, а можно сделать так, чтобы в Mozill-е, после нажатия на ссылку добавления в закладки в открывающемся окне "Новая закладка" ИЗНАЧАЛЬНО не стояла галочка "Загружать закладку в боковой панели"?
Давид (19.05.2012 в 16:45):
Хороший скрипт. Большое спасибо!
Grrr (03.04.2012 в 01:13):
Автор, ты домучил скрипт? В Хроме как не пахал 4 года назад, так и не пашет ...
Что с этим Хромом не так?
Екатерина (13.02.2012 в 11:51):
Работает все отлично. Автору спасибо.
ManHunter (13.02.2012 в 00:02):
На свойствах закладки ставишь галочку "Show in personal bar" и все. В 9-й версии эту галочку можно было поставить при сохранении. С остальными пожеланиями - к авторам этого недобраузера, а то они уже давно считают себя выше всяких стандартов.
Ололо (12.02.2012 в 01:54):
Кто нибудь сделает фикс для Оперы 11?
Дмитрий (06.02.2012 в 01:56):
У меня одного в Опере, сайт добавляться не в закладки, а в боковую панель?
Dima (10.01.2012 в 16:46):
Спасибо. Все просто и удобно.
Andrey (25.11.2011 в 18:46):
спасибо! отличный срипт, всё делает как должен :)
Сергей (18.11.2011 в 23:30):
Благодарю за скрипт!
Андрей (15.11.2011 в 12:33):
ManHunter, спасибо! А то чего только не пробовал. Блин, почему я не такой умный?..
ManHunter (15.11.2011 в 12:20):
Добавить строчку "a.href=url;" Смотри доработанный скрипт.
Андрей (15.11.2011 в 11:53):
Все хорошо, только с Оперой затык небольшой. Она к адресу добавляет символ '#' из ссылки. Подскажите, как его убрать?
ManHunter (14.11.2011 в 22:45):
В бан. Надоело уже.
nimzuka (14.11.2011 в 22:39):
Добрый день. в ie 8 не работает. Даже кнопка на вашем сайте не работает. пишет "нажмите control+d".
Елена (08.10.2011 в 23:56):
ManHunter терпения вам побольше, спасибо за то, что делитесь со всеми результатами своего труда.
Павел - Желающие халявной настройки и прочие криворукие чудовища - идите раком и не озлобляйте автора сайта.
Спасибо за скрипт.
Justicet (07.07.2011 в 13:12):
Премного благодарен. Очень полезный скрипт.
Встроил в страницу: www.b3club.ru
Удачи в осуществлении иных планов!
Сергей (08.04.2011 в 00:54):
Спасибо. Буду искать.
ManHunter (08.04.2011 в 00:47):
Вот тебе пруф, что в IE9 все прекрасно работает:
http://s41.radikal.ru/i091/110...b39287be.jpg
Так что ищи проблемы на своей стороне, меня они мало волнуют.
Сергей (08.04.2011 в 00:29):
Я точно не могу ответить на этот вопрос. Просто даже на твоей странице кнопка не работает в IE9.
ManHunter (08.04.2011 в 00:27):
А что, в IE9 отменили метод window.AddFavorite?
Сергей (08.04.2011 в 00:22):
Автор, привет! А как на счёт IE9?
Siregik (23.02.2011 в 16:40):
Большое спасибо! Именно то, что я искал!!!
АРТ (20.01.2011 в 12:21):
Супер наконец свершилось спасибо
Oxanita (25.10.2010 в 18:37):
Большое спасибо! Много всего просмотрела — ничего нормально не работает. А ваш скрипт сразу все проблемы решил.
ManHunter (22.08.2010 в 12:03):
Руки себе выпрями, тогда заработает, если уж не хватает ума понять разницу между боковой панелью, меню закладок и панелью закладок.
Юрко (22.08.2010 в 11:59):
В Лисе 368 не работает
jazzman (06.08.2010 в 13:22):
Огромное спасибо за скрипт! Работает отлично!
ManHunter (03.08.2010 в 08:12):
Добавил, открыл. Добавилось, открылось. Что я делаю не так?
Unnamed (03.08.2010 в 03:48):
Как и все остальные скрипты это тоже в FF не корректно работает, вы попробуйте добавить страницу в избранное, а потом открыть её с закладок.. вылетит птичка))
Серегей (26.07.2010 в 03:46):
Огромное спасибо!
Смотрю, не зарастает сюда дорога))
Два дня голову ломал как это сделать,
так ничего и не получилось, а у Вас все
работает. Очень благодарен!
DUDE (26.07.2010 в 00:26):
Йо! Ну это круто! Все гениальное - просто!
СПАСИБО, МИЛ ЧЕЛОВЕК!
Игорь (10.07.2010 в 01:16):
Спасибо большое!
Хотелось бы ещё кнопочку "Сделать стартовой" кроссбраузерную!
ManHunter (09.07.2010 в 17:26):
По-моему все предельно четко и ясно написано: в Chrome, Safari и других WebKit-браузерах скрипт ничего никуда НЕ добавляет и НЕ БУДЕТ добавлять. Он просто выводит сообщение "нажмите Ctrl+D".
makoviy (09.07.2010 в 16:31):
Из комментариев складывается неоднозначное мнение о работоспособности скрипта в Google Chrome. У меня НЕ работает, может что то не так делаю? Хотя что там можно не так сделать =)
Сергей (20.06.2010 в 00:20):
Оказалось, что проблемы возникали при использовании локальных адресов (file:///C:/.../index.htm), когда файлы выложил в сеть - всё сразу заработало во всех браузерах. Однако сделал некоторые доработки:

1.Вызов функции из HTML слегка переделал:
Вместо: <a href="#" onclick="return add_favorite(this);">Добавить в Избранное</a>
Сделал: <a href="#" onclick="javascript: return void(add_favorite(this, 'Текст'));">

2.В функцию добавил ещё параметр и слегка переработал начало функции:
Вместо:
// Добавить в Избранное
function add_favorite(a) {
  title=document.title;
  url=document.location;
  try {
...
Сделал:

// Добавить в Избранное
function add_favorite(a, favtitle)
{
    if(favtitle==""){
    title=document.title;
    }else{
    title = favtitle;}
    url=document.location;   
    try {
...
Сергей (19.06.2010 в 10:34):
Протестировал в IE, Google Chrome, Opera - в них всё отлично работает.
Но когда пробовал FireFox 3.5.3, то в нём почему-то не отработала строка
window.sidebar.addPanel(title, url, ""); - причём в эту ветку попадает, ошибок не возникает, но никаких действий не происходит...
В чём может быть проблема? Это глюк последней версии Мозилы?
Иван Николаевич Баян (18.06.2010 в 16:40):
Спасибо. Везде отлично работает, а в хроме просит нажать ctrl+D
Действтеьно кроссбраузерно! Удивительное рядом...
ManHunter (04.05.2010 в 08:11):
Интересно, что помешало взять и сохранить скрипт в юникоде?
Григорий (04.05.2010 в 01:54):
Как быть если кодировка на сайте UTF-8 в этом случае если через хром тыкать, появляеющееся оповещение отображается не коректно (вместо букв русских квадратики). Как быть?
Решил проблему просто написав по английски Press CTRL-D. Но было бы класно улучшить скрипт распознаванием языка браузера и в зависимости от него показывать сообщение. Ну или хотябы если русский то по русски если не русский то по английски чтобы писал.
ManHunter (12.04.2010 в 17:52):
Поставил оперу 10.51, проверил, все работает. Видимо причина в устаревшем драйвере hands.sys, нужна последняя версия. Возможно также потребуется обновление brains.dll, тогда стопудово заработает.
Владимир (12.04.2010 в 16:07):
В последней версии Оперы (Версия:10.51) данный скрипт не работает. В Избранное (Закладки) не добавляет и не выдает сообщения "нажмите Ctrl+D"...
ManHunter (06.04.2010 в 17:09):
Раз вообще возник такой вопрос, то лучше не пытаться искать.
Григорий (06.04.2010 в 17:05):
А где можно посмотреть пример скрипта? Где кнопка Добавить в избранное?
ManHunter (04.04.2010 в 23:46):
semenov, а смысл? В chrome покажет сообщение 'Нажмите Ctrl-D чтобы добавить страницу в закладки'
semenov (04.04.2010 в 21:02):
Есть смысл, наверное, не отображать тогда ссылку "Добавить в Избранное" для Safari, Chrome
ZloyPrianik (21.03.2010 в 13:48):
Спасибо большое, давно этот код искал!
Эдуард (01.02.2010 в 03:56):
Спасибо большое за код !
Serhiy (30.01.2010 в 14:56):
ManHunter, ясно.. бум учить) спс
ManHunter (30.01.2010 в 14:53):
А что, CSS уже запретили? Там все и меняется как надо.
Serhiy (30.01.2010 в 14:48):
Спасибо, скрипт супер! а можно как то в нем цвет ссылки изменить("Добавить в Избранное")?
ManHunter (20.01.2010 в 00:00):
Не видел ничего подобного.
Дмитрий (19.01.2010 в 23:55):
ManHunter. Можно ли переписать скрипт, чтобы текст из мета тега description был в поле "Описание" (Опера), а поле "Краткое имя" (Опера), заполнялось текстом из title, или собственным текстом введенным в скрипте.
Линкер (06.01.2010 в 21:27):
Спасибо за скрипт огромное)
Илья (09.10.2009 в 15:14):
В опере ctrl+f5 уже давно не пашет (в новых версиях)... На страничке правой кнопкой мыши, там обновить.. тока тогда без кэша грузится страница... ну или ctrl+r... вродя... =) жду для хрома фиксы)))
SV (24.09.2009 в 19:35):
Спасибо! Отличный скрипт!!

Тем, у кого не работает на Опере - попробуйте перегрузить страницу в Опере через CTRL-F5, а не через иконку перегрузки. Не знаю почему - но у меня сразу тоже не сработало, потом сделал CTRL-F5 - и скрипт сработал.
InStaller (04.09.2009 в 14:44):
Огромное спасибо. +1
Я тут оперу материл, когда старая ссылка на "добавить в избранное" в ней не работала, а в Фоксе небыло проблем.

Одним головняком меньше.
Жду дополнения насчет Хрома...
ManHunter (03.09.2009 в 16:55):
Павел, сосни-ка хуйца, криворукий мудак
Павел (03.09.2009 в 16:53):
В опере нихуя не работает. Ебанутый скрипт.
Илья (25.08.2009 в 17:34):
да блин ты ж умный парень =) Что так долго то)))
ManHunter (24.08.2009 в 22:49):
Если бы нашлись, то они бы уже были в исходном коде этого блога. Ну и в этой  статье, естественно, тоже.
Илья (24.08.2009 в 22:45):
Блин по Хрому нет нифига, нашел тока как определять браузер, но чет не пашет ( ManHunter нашлись решения для вебкит?
Mirned.com (13.07.2009 в 14:28):
Спасибо, получилось прекрасно
Дмитрий (15.05.2009 в 00:19):
Спасибо!
ManHunter (11.05.2009 в 14:27):
А как на счет того, что webkit-браузеры вообще не имеют функций для добавления в закладки через скрипты?
Дима (11.05.2009 в 14:22):
А как насчёт webkit-браузеров? В Safari и Chrome не алё.
герман (04.05.2009 в 01:43):
проверил в експлорере 8.0.6001.18702, в мозиле 3.0.10 и опере 9.64. все ок.
еще раз спс. :-)
герман (04.05.2009 в 01:30):
спасибо за скрипт. все работает.
ManHunter (28.04.2009 в 23:46):
Здесь же работает, и установлен этот же самый скрипт. Проверено в Opera 7.x-9.x
Руслан (28.04.2009 в 23:39):
А в опере добавляет? Просто мне 2 человека тестировали, сказали, что ничего не происходит...
Светлана (26.03.2009 в 16:41):
Спасибо. Работает.
ManHunter (18.03.2009 в 13:58):
А вот это: "Обратите внимание, что по умолчанию ссылка добавляется не совсем в закладки, а в боковую панель браузера. Для добавления страницы в нужную папку закладок выберите ее в выпадающем меню." для кого написано? Если такой вариант не устраивает - пиши авторам браузеров, пусть они переписывают их под твои нужды.
Иван (18.03.2009 в 13:20):
UPD. В FF и в Опере добавляет закладку в боковую панель! Как сделать, чтобы добавлял нормально?!
Иван (18.03.2009 в 13:07):
Спасибо за скрипт.
Только нигде не найду у вас на сайте ссылку "Добавить в Избранное"...

Добавить комментарий

Заполните форму для добавления комментария
Имя*:
Текст комментария (не более 2000 символов)*:

*Все поля обязательны для заполнения.
Комментарии, содержащие рекламу, ненормативную лексику, оскорбления и т.п., а также флуд и сообщения не по теме, будут удаляться. Нарушителям может быть заблокирован доступ к сайту.
Это я :-)
Если программист в девять утра уже на работе, значит он там же и ночевал
Главная страница Web-мастеру и не только Образ мышления: Assembler Мои программы Software Темная сторона Силы Обзоры техники А еще я туда ем! Жизнь в оффлайне Всякая всячина
Карта сайта Ссылки Обратная связь Правила сайта Настройки сайта RSS-канал
Ограничение по возрасту 16+ Материалы, опубликованные на этом сайте, не рекомендуются к просмотру лицам в возрасте до 16 лет без присутствия взрослых.
Метки статей
.NET (27), AJAX (5), Assembler (348), COM (39), CSS (39), Exif (15), FASM (8), Firefox (7), HDD (17), Hello Teddy (9), HTML (48), iconBIT (4), JavaScript (68), MySQL (13), Nikon (19), PDF (9), PHP (119), Samsung (6), SEO (12), Sublime Text (9), TintonLife (4), UGREEN (4), Windows 7 (66), аккумуляторы (22), аксессуары (12), анализаторы файлов (8), архиваторы (5), аттракционы (7), безопасность (55), браузеры (16), бытовая техника (19), варенье (18), ВВЦ (9), ВДНХ (14), видео (20), Воробьевы горы (9), вторые блюда (120), выпечка (27), выставки (116), генератор ПСЧ (10), графика (118), десерты (31), Египет (8), заготовки на зиму (45), закуска (21), закуска к пиву (24), зарядные устройства (23), защита (15), зоопарки (10), игры (36), иконки (22), интерфейс (26), исследование защиты (306), каша (4), клавиатура (7), Коломенское (37), консоль (7), концерты (52), Кузьминки (4), куклы (27), ледяные скульптуры (6), мои программы (68), мониторы (6), музеи (72), мультимедиа (70), мясо (59), напитки (14), ноутбуки (8), обфускация (7), окна (69), оформление сайта (47), парки Москвы (7), песчаные скульптуры (13), плееры (10), подводная съемка (4), поздравления (127), полезные функции (39), прохождения (4), процессы (25), птица (20), путешествия (25), распаковка (22), реверсинг (51), рыба (34), салаты (18), сброс триала (4), сеть (36), система (177), Сокольники (8), соусы (14), супы (14), телефоны (8), Тунис (6), умный дом (12), файлы справки (6), фаст-фуд (18), фестиваль цветов (5), флешки (5), фото (23), хеши (16), числа (8), юмор (12), яйца (17), Яндекс (10)
Вам помог этот сайт?
Сказать спасибо! Поблагодарили 34,320 раз
<< 2024 - АПРЕЛЬ >>
Пн Вт Ср Чт Пт Сб Вс
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30          
Национальный день донора крови
Всемирный день цирка
Нашли на сайте орфографическую ошибку? Выделите ее мышкой и нажмите
Ctrl
+
Enter
Буду очень благодарен, если размеcтите мою кнопочку:
Личный блог ManHunter'а
Valid CSS Valid XHTML 1.0 Transitional Valid mobileOK Basic Valid RSS
Яндекс тИЦ: {YANDEX_TIC} Яндекс ИКС: 380
Сейчас я слушаю
---
Имя:

Сообщение:

Осталось символов: 200

   
-
Наверх
Powered by PCL's Speckled Band Engine 0.2 RC3
© ManHunter / PCL, 2008-2024
При использовании материалов ссылка на сайт обязательна
Время генерации: 0.07 сек. / MySQL: 2 (0.0036 сек.) / Память: 4.5 Mb
Наверх