Покопавшись, в итоге наашел красивое решение, работает во всех браузерах.
function add2Fav(x){ if (document.all && !window.opera) { if (typeof window.external == "object") { window.external.AddFavorite(document.location, document.title); return true; } else return false; } else{ x.href=document.location; x.title=document.title; x.rel = "sidebar"; return true; } }
Добавить в избранное
Добавить в избранное - скрипт для всех браузеров Добавить в избранноеМеняем Название Сайта и URL в 2х местах! Работает везде без ошибок)
Сделать стартовой - скрипт для IE Сделать стартовойМеняем URL в 2х местах! Работает только в IE
JavaScript Ссылка "Добавить в избранное" для всех браузеровСкрипт найден в google и доработан с учетом нынешних реалий, а именно - наличия уже 8й версии IE и браузера Chrome (который в оригинальном виде скриптом определялся как Netscape и ни каких действий в результате не производилось). Если браузер не поддерживает добавление в закладки через скрипт - пользователю будет показано сообщение о том что добавить в закладки можно нажатием Ctrl-D.
Поместите эти функции в заголовок страницы:
function getBrowserInfo() { var t,v = undefined; if (window.chrome) t = "Chrome"; else if (window.opera) t = "Opera"; else if (document.all) { t = "IE"; var nv = navigator.appVersion; var s = nv.indexOf("MSIE")+5; v = nv.substring(s,s+1); } else if (navigator.appName) t = "Netscape"; return {type:t,version:v}; } function bookmark(a){ var url = window.document.location; var title = window.document.title; var b = getBrowserInfo(); if (b.type == "IE" && 8 >= b.version && b.version >= 4) window.external.AddFavorite(url,title); else if (b.type == "Opera") { a.href = url; a.rel = "sidebar"; a.title = url+","+title; return true; } else if (b.type == "Netscape") window.sidebar.addPanel(title,url,""); else alert("Нажмите CTRL-D, чтобы добавить страницу в закладки."); return false; }
С
егодня я вам расскажу об одной полезной функции на сайте - это ссылка, ну или кнопка «Добавить в закладки (избранное)». Эта функция позволяет пользователям добавить понравившуюся страницу вашего сайта в закладки браузера, чтобы в нужный момент быстро и легко получить доступ к ней.
Многие из вас скажут: – «Зачем дублировать функцию браузера, ведь эта кнопка есть в адресной строке?».
Да есть, но она там, во-первых, не очень заметна, во-вторых, некоторые пользователи вообще не знают о ней.
Для улучшения UI (юзер интерфейса), лучше продублировать эту функцию и расположить ссылку/кнопку «Добавить в закладки (избранное) » на видном месте. Например, если у вас интернет-магазин, то ее лучше вставить на карточку товара, если у вас блог, то – под или над статьей. Расположение все равно нужно тестировать. А так же ее можно разместить в шапке сайта на всех страницах.
В интернете представлено много разных способов реализовать эту функцию, но большинство из них работают не во всех браузерах, то не работает в старых, то в новых, то в IE, то еще где-то.
Поэтому пришлось, самому выбрать среди них самый лучший и немного дописать его. И сегодня я поделюсь этим способом с вами и предоставлю пошаговую инструкцию по установке ссылки/кнопки «Добавить в закладки (избранное)» на ваш сайт.
Для того чтобы сделать кнопку «добавить в закладки» для сайта нам нужно выполнить 3 простых шага:
Создание JS-файлаЕсли у вас на сайте есть javascript – файл подключающийся на всех страницах сайта, то используйте его и переходите к следующему шагу. Если у вас нет такого файла, нужно его создать. Для этого создадим папку с названием «js» в корневой папке сайта, а в ней уже файл и назовем его «functions.js».
< !DOCTYPE html> Заголовок магазина > Контент страницы
Копирование и сохранение кодаНиже приведен JavaScript-код, который нужно вставить в выбранный/созданный вами файл и сохранить его:
Function addFavorite(a) { var title = document.title; var url = document.location; try { // Internet Explorer window.external.AddFavorite(url, title); } catch (e) { try { // Mozilla window.sidebar.addPanel(title, url, ""); } catch (e) { // Opera if (typeof(opera)=="object" || window.sidebar) { a.rel="sidebar"; a.title=title; a.url=url; a.href=url; return true; } else { // Unknown alert("Нажмите Ctrl-D чтобы добавить страницу в закладки"); } } } return false; }
Добавление ссылки/кнопки на сайтТеперь нам осталось выбрать место на сайте и вставить туда следующую HTML-код:
Добавьте страницу в избранное!
Вот и все! Как это всё работает — Вы можете видеть (и попробовать) чуть ниже, а так же в сайдбаре этого сайта.
P.S. Хотелось бы добавить: Данный способ работает в следующих браузерах:
- Opera
- Mozilla FireFox
- Google Chrome / Safari – будет выводиться надпись «Нажмите Ctrl-D чтобы добавить страницу в закладки», в этих браузерах эта функция выключена из соображений безопасности.
В любом из современных браузеров есть функция добавления сайтов в список избранного. Таким образом, пользователь может сохранить любимые сайты и держать их всегда под рукой, чтобы иметь к ним быстрый доступ. Но долгое время была популярна кнопка для сайта "Добавить в избранное". Эта функция несколько упрощает процесс добавления сайта в закладки и позволяет лишний раз напомнить пользователю о том, что неплохо было бы добавить сайт в избранное.
Здесь работает психология. Дело в том, что видя на сайте предложение о добавлении в избранное, пользователь задумывается нужно ли ему это. И если он решит, что сайт, действительно, полезен, то добавит его в список закладок. А если предложения не поступит, то пользователь и не задумается над этим вопросом. Именно поэтому нужно предлагать: кто стучится - тому открывают.
Конечно, большинство посетителей добавляют страницы в закладки не потому, что планируют возвращаться на сайт каждый день, а "на всякий случай, вдруг понадобится", и, как правило, не возвращаются. Но некоторые пользователи возвращаются регулярно и формируют костяк посетителей. Так или иначе, если люди будут возвращаться на сайт, это значит, что ваш сайт полезен, и это положительно скажется на поведенческих факторах вашего ресурса, что позволит поисковым системам относиться к нему с большим доверием.
Размещать кнопку "Добавить в избранное" на сайте нужно на видном месте, но не слишком навязчиво. Лучшее место для такой кнопки - шапка, либо боковая часть сайта.
Не нужно делать кнопку огромной или слишком маленькой. Помните, что кнопка должна вписываться в общий дизайн сайта, и не быть слишком навязчивой или слишком малозаметной.
Код кнопки "Добавить сайт в избранное"Большинство современных браузеров, с приходом стандарта HTML5, поддерживают атрибут rel="sidebar" .
Добавление сайта в избранное - "Нубекс" function addSite() { if (document.all) window.external.addFavorite("http://сайт", "Конструктор сайтов "Нубекс""); }
Не забудьте добавить наш сайт в закладки! (Для браузера Google Chrome нажмите Ctrl+D)
Добавить сайт в избранноеНо помните, что в браузере Google Chrome невозможно добавить сайт в закладки с помощью кнопки на сайте. Для этого есть специальная комбинация клавиш: Ctrl+D , поэтому не забудьте сообщить пользователю об этом.
Отслеживать количество пользователей, добавивших ваш сайт в закладки, можно, например, с помощью сервиса Яндекс.Метрика ("Посещаемость" - "Конверсии").
Что ж, пришло время написать несколько коротеньких постов на в общем-то полезные темы!
Одна барышня, попросившая организовать на её сайте кнопку «добавить страницу в избранное браузера», заодно поинтересовалась, как у меня устроен фиксированный сайдбар и меню.?. и коли эти функции кого-то интересуют, — значит, возможно, потребуются и посты.
Сегодня прикрутим и настроим на сайте кнопку «страницу в избранное».
Я, признаться, у себя на блоге такое чудо не использую: не знаю, как-то не раскушал прок… Но если у вас появилось желание реализовать такую кнопочку «у себя…», давайте приступим. Дело очень простое — займёт минут десять труда и, к тому же, как бы то ни было — очень полезное принципиальное js-познание…
В следующих статьях реализуем «прилепленное» меню и сайдбар (ссылки на эти статьи в комментариях )…
Разделы статьи:
создаём кнопку «добавить в избранное»…Что нам для этого потребуется?..
Во-первых: определиться с географией расположения сего элемента) От этого будет зависеть «устройство» селекторов css.
В-вторых, конечно же, не забыть сделать бэкап сайта.
И коли определённость и осторожность … достигнуты) — смело заходим в файловую директорию (ядро) своего шаблона; отыскиваем папку с именем js — если её нет — создаём новенькую, эта папка ещё потребуется много раз для иных полезных файлов: например, когда расширяем функционал визуального текстового редактора, скажем, добавляем свои …
Итак: в созданной, или уже существующей папке под именем js , теперь необходимо создать js-файл… в который поместим необходимую на сегодня функцию.
нам требуется к так называемому событию onClick какого-то элемента сайта прикрутить определённую JavaScript-функцию: сегодня — это строки данные чуть ниже.
Добавить в закладки
Продолжим… дадим новому файлу понятное имя, такое, чтобы в дальнейшем было легко определить его назначение…
Назовём, скажем, function-isbranoe.js (имя можете выбрать своё собственное).
Теперь в созданный файл пропишем такие чудо-строки: т.е саму JavaScript-функцию.
Function addFavorite(a) { var title = document.title; var url = document.location; try { // браузер Internet Explorer window.external.AddFavorite(url, title); } catch (e) { try { // браузер Mozilla window.sidebar.addPanel(title, url, ""); } catch (e) { // браузер Opera if (typeof(opera)=="object" || window.sidebar) { a.rel="sidebar"; a.title=title; a.url=url; a.href=url; return true; } else { // Unknown alert("Кликните Ctrl-D чтобы добавить страницу в закладки"); } } } return false; }
Практически всё готово! остаётся только расположить «физически» саму кнопку во фронтенде сайта: где-то в сайдбаре, ну или ещё как-то…
Как вы поняли, для привязки элемента кнопки на сайт, всего-навсего нужно дописать строку показанную в самом верху: это обычная в общем-то ссылка, обыгранная полезным эфектом Js-функции.
стили css для кнопки «добавить страничку в избранное»…Например, так: у меня этот класс miha-isbraly .
Получится как-то так…
Страницу в избранное!
А вот примерные стили:
Miha-isbraly a { background: #fff; color: rgb(0, 132, 143); border-radius: 4px 4px; box-shadow: 1px 0 1px 0 #b7b7b7; border: 1px solid #ccc; text-decoration: none; }
Завершение:
Все наши наработки необходимо связать в единый цикл…
Открываем файл footer.php и перед закрывающем тегом прописываем строку-привязку нашего созданного js файла: т.е подключим его, указав путь для системы WP…
А именно: поместите такой код (который, кстати сказать, можно дополнять и иными js строками, но — я бегу — обо всём по порядку…)
/** добавим в футер wp_footer скрипты js **/ function functionss_add_js_my_scr (){ echo
Похожие статьи