Jump to content
Sign in to follow this  
serega-lomik

GoodShare - кнопки "поделиться" без использования сторонних сервисов

Recommended Posts

Что это

Это небольшой яваскрипт, файл стилей и спрайт кнопок, позволяющий буквально в 2 клика вставить блок "поделиться" на любую страницу сайта.

За основу взят https://github.com/koddr/goodshare.js 

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

 

Как это выглядит

goodshare.png.2a885a28a47834b319bed0994f038b25.png

 

Зачем

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

 

Как пользоваться

Скачиваете прикреплённый к сообщению архив, распаковываете в  \catalog\view\javascript\, в коде нужной страницы в месте, где хотите, чтобы отображались кнопки, вставляете примерно такой код:

<div id="goodshare" data-socials="facebook,vkontakte,odnoklassniki,moimir,googleplus,twitter,livejournal,evernote,blogger,surfingbird,reddit,telegram,viber,whatsapp"></div>
<script src="catalog/view/javascript/goodshare/goodshare.js" type="text/javascript"></script>

Как видно из приведённого выше кода, для использования доступны 14 кнопок, а именно:

 

  • Facebook
  • Вконтакте
  • Одноклассники
  • МойМир
  • Google+
  • Twitter
  • Livejournal
  • Evernote
  • Blogger
  • Surfingbird
  • Reddit
  • Telegram
  • Viber
  • Whatsapp

 

Для Facebook, Вконтакте, Одноклассники, МойМир, Surfingbird и Reddit так-же виден счетчик людей, поделившихся страницей.

 

Что сделано мной

Написан "сео оптимизированный" код для генерации кнопок "поделиться". Найдены, оптимизированы собраны в единый спрайт все картинки кнопок. Написаны стили для отображения всех кнопок.

Предоставлено вам всё в удобоваримом формате и с нормальной инструкцией.

 

Как убрать не нужное

Очень просто: удаляете названия ненужных кнопок из атрибута data-socials у div id="goodshare

 

Лицензия

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

Исходный код https://github.com/koddr/goodshare.js распространяется по лицензии MIT, изображения, использованные для создания этого микродополнения -  Creative Commons

 

Скачать

 

goodshare.zip

 

Поблагодарить автора за проделанную работу можно тут

  • +1 5

Share this post


Link to post
Share on other sites

круто

но

если популярные сервисы будут обновлять свой код

то этот файл вам надо обновлять вручнуюю и с условием того что в него внесли обновления

Share this post


Link to post
Share on other sites

ashap, согласен, но https://github.com/koddr/goodshare.js достаточно часто обновляет свой код и я в него изменений не вносил. всего несколько строк "сверху"

  • +1 1

Share this post


Link to post
Share on other sites
Только что, serega-lomik сказал:

ashap, согласен, но https://github.com/koddr/goodshare.js достаточно часто обновляет свой код

главное что бы

  • Facebook
  • Вконтакте
  • Одноклассники
  • МойМир
  • Google+
  • Twitter
  • Livejournal
  • Evernote
  • Blogger
  • Surfingbird
  • Reddit
  • Telegram
  • Viber
  • Whatsapp

не часто обновляли)))

  • +1 1

Share this post


Link to post
Share on other sites

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

  • +1 1

Share this post


Link to post
Share on other sites
Только что, serega-lomik сказал:

Та не. Правда я расчитывал на другую реакцию.

Да нормальная тема, можно ещё заморочится хочу в подарок к тайтлу подцеплять)

Share this post


Link to post
Share on other sites

Подписался, я не против платного - главное что бы обновлялся!

Share this post


Link to post
Share on other sites
2 часа назад, serega-lomik сказал:

Та не. Правда я расчитывал на другую реакцию.

а чего в дополнения то не добавил, к стати?
там найти проще, скоро фильтр обещают вообще просто будет находить нужные файлы

 

Share this post


Link to post
Share on other sites

AWARO, так это ж не модуль, чтобы его там размещать.

Tom, спасибо.

 

Share this post


Link to post
Share on other sites
В 01.07.2017 в 09:20, serega-lomik сказал:

AWARO, так это ж не модуль, чтобы его там размещать.

Tom, спасибо.

 

 

Хорошая штука, спасибо, иконки бы чуть больше и чуть четче )

Share this post


Link to post
Share on other sites

Доброе время суток! Как я понимаю, скрипт предложенный serega-lomik предназначен для opencart. А как можно задействовать на обычных статических html страницах?

Share this post


Link to post
Share on other sites

Выдернуть код вставки из ocmod и вставлять через редактор.

Отправлено через Tapatalk

Share this post


Link to post
Share on other sites
В 03.06.2018 в 10:43, pimur сказал:

Выдернуть код вставки из ocmod и вставлять через редактор.

 

Благодарю за ответ! А не подскажите для новичка как это сделать? Всё что я нашел здесь оказалось сложным для понимания, одним словом не понял как это сделать.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
You are posting as a guest. If you have an account, please sign in.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

×

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.