Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 44
Одно плохо — лишаемся счётчиков шаринга. Это психологически достаточно важный момент, влияет на посетителя странички.
Можно сделать единственный скрипт (наверняка, кто-нибудь уже сделал), который заботится обо всех счётчиках сразу.
Артём Сапегин сделал jQuery-плагин Social Likes. И настраиваемый внешний вид, и счетчики — все одной библиотекой. При желании можно добавлять свои сети.
Если интересно, то можно написать самому, лайки и шары легко получить в виде JSON или XML (нужно бы собрать Gist, на данную тему), вот пример для FB: api.facebook.com/restserver.php?method=links.getStats&urls=website.com
кое что уже есть gist.github.com/jonathanmoore/2640302
у всех соцсетей с этим все ок, кроме VK, который отдает только JSONP в виде VK.Share.count(index, num); и ради которого приходится создавать объекты
Facebook Share
Стандартная кнопка для “шаринга” URL с дополнительным текстом.
HTTP-endpoint: www.facebook.com/sharer.php
Параметры:
u — url
t — сопровождающий текст
Текст таким образом больше не шарится. Нужно использовать
<meta property="og:type" content="content">
stackoverflow.com/questions/12547088/how-do-i-customize-facebooks-sharer-php
Спасибо за замечание, поправлю на всех ресурсах информацию. Вообще использование opengraph и schema.org заслуживают отдельной статьи.
Добавлю, что чтобы те же теги действовали на расшаренные в твиттер ссылки и в твиттере эти ссылки отображались прям с аннотацией, с картинкой, ссылкой на твиттер автора, нужно пройти валидацию у Твиттера и попасть в белые списки (по ссылке есть возможность подать такую заявку).
Тащить целый Bootstrap для отображения кнопок (совсем обленились верстальщики)? В своих проектах я ухожу от этого css-фреймворка оставляя только сетку (и то пока), Но это не существенное замечание — основное, это отображение количества лайков, ведь уже проставленные лайки это главный мотиватор поставить еще — люди ставят лайки там где ставят лайки другие как показатель ценности материала!
Вы правы, логичнее будет собрать только кнопки в кастомайзере на get bootstrap.com, так же можно поступить и с font awesome.
Никогда не было мотивацией (для меня лично) сколько там уже лайков. Я — не «баран»? Отчего большинство «бараны»?
Мне кажется это вопрос из другой, но не менее интересной области, но факт остаётся фактом.
Почему, когда толпа стоит на пешеходном переходе и ждёт зелёного сигнала, если один начнёт переходить на красный, следом за ним двинутся ещё несколько из толпы? Тот же самый эффект. Вы из тех, кто всё равно останется стоять и ждать зелёного сигнала.
А нужна тьма баранов зачастую =) Логика простая:
Если количество не мотивация, то в минус не будет
Если мотивация — добавит ещё, но, если есть что добавлять) (а кто указал, что количество «поделиться» должно быть реальным ?)
Если количество не мотивация, то в минус не будет
Если мотивация — добавит ещё, но, если есть что добавлять) (а кто указал, что количество «поделиться» должно быть реальным ?)
Уже давно для этих целей использую social-likes (тоже никакого dns-lookup)
Там кстати есть возможность включить/выключить счетчики, дописать доп. сервисы при инициализации.
Также на одном проекте делал ленивую загрузку значений счетчиков при появлении счетчиков в области видимости.
Там кстати есть возможность включить/выключить счетчики, дописать доп. сервисы при инициализации.
Также на одном проекте делал ленивую загрузку значений счетчиков при появлении счетчиков в области видимости.
Есть ещё Shariff — принцип работы тот же, но есть и счётчик лайков — вместо браузера пользователя количество лайков и репостов запрашивает ваш сервер.
Пример использования. Есть даже кнопка для WhatsApp ;-)
Пример использования. Есть даже кнопка для WhatsApp ;-)
Забавно — ТС предлагает отказаться от JS, но при этом тянет Bootstrap, другие предлагают альтернативное решение где требуется только jQuery.
В кастомайзере на getbootstrap.com можно собрать стили только для кнопок, так же можно поступить и с font awesome. Тем не менее тема отказа от jQuery заслуживает отдельной статьи
Тем не менее, для многих jQuery уже пережиток прошлого
monolithed я на это и намекаю — jQuery уже не панацея в наши времена
Поделитесь, пожалуйста, а что сейчас для многих настоящее? А то я не в теме
А можно с непраздным интересом уточнить, на что, окромя jQuery/TwiBootstrap стоит посмотреть?
Простите-с, я по-ходу не в теме. Какая уже существует замена jQuery? Только его неплохо выучил, думаю вот круто, в ногу со временем неплохо иду, а тут… печалька короче(
С нативными кнопками есть еще одна беда — если социалки заблокированы на работе/в стране, то браузер долго будет пытаться подгрузить нужные файлы, тормозя работу сайта.
Не то слово, сколько тащут за собой эти счетчики. тоже запаривался с оптимизацией скорости загрузки страницы.
Аналогично дело обстоит со встраиванием видео с ютуба и подобных сервисов. Чекнуться можно, при 10 роликах браузер рендерит страницу нестерпимо просто.Там верстки еще на пол кило.
В связи с чем делал плагин wordpress.org/plugins/youtube-speedload/
работает очень гибко, не создает зависимостей, не требует пересохранения страниц, хранит параметры в стандартном кеше пресса, где он хранит ютубовский кеш iframe. Об этом тоже, думаю, есть смысл поговорить.
Аналогично дело обстоит со встраиванием видео с ютуба и подобных сервисов. Чекнуться можно, при 10 роликах браузер рендерит страницу нестерпимо просто.Там верстки еще на пол кило.
В связи с чем делал плагин wordpress.org/plugins/youtube-speedload/
работает очень гибко, не создает зависимостей, не требует пересохранения страниц, хранит параметры в стандартном кеше пресса, где он хранит ютубовский кеш iframe. Об этом тоже, думаю, есть смысл поговорить.
А что насчет счетчика звёзд на github?
Да, но если при использовании нативных кнопок любое изменение со стороны соц. сети не вызовет проблем с работой кнопок, то в случае с использованием чего-то своего получаем ещё одно поле, где необходимо постоянно следить за любыми изменениями.
Я не прав?
Я не прав?
Имейте ввиду, что Surfingbird не парсит предоставленный URL-страницы, все параметры ниже обязательны к заполнению.
Парсим же: surfingbird.ru/share?url=http%3A%2F%2Fhabrahabr.ru%2Fpost%2F250021%2F
Вы избавились от js, но теперь зпвисите от серверного рендера. Я не могу использовать ваше решения у себя без правки бекенда. Плюс лишились ряда фич. Сомнительная оптимизация. Я бы смотрел в сторону агрегаторов лайков тогда уж, например от Яндекса
Ссылку можно вставлять как на сервере так и клиенте, можно динамически парсить мета-теги на событии onclick.
В статья я описываю подход, а не решение. Пользоваться им или нет — решать Вам. Если Вы решили воспользоваться предложенным подходом, как его использовать тоже решать — Вам. Кнопки собирать можно на сервере, можно на клиенте, возможно Вы найдете другое более удобное для себя решение.
В статья я описываю подход, а не решение. Пользоваться им или нет — решать Вам. Если Вы решили воспользоваться предложенным подходом, как его использовать тоже решать — Вам. Кнопки собирать можно на сервере, можно на клиенте, возможно Вы найдете другое более удобное для себя решение.
Правильно ли я понимаю, что параметры, передаваемые кнопками посредством GET запроста, при таком подходе необходимо формировать для каждой страницы как-то отдельно, то есть придётся дорабатывать бэкэнд (чтобы href кнопок сразу содержали готовые параметры), либо делать формирование запроса по событию onclick?
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Избавляемся от JavaScript в социальных кнопках (Facebook, VK, Twitter и др.)