Jump to content

Социальные кнопки без использования внешних сервисов [бесплатно]


Recommended Posts

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

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

Преимущества доработки объяснять не стану, так как думаю все и так знают. 

Скрипт будет работать с любой cms, с любыми страницами (html, php, tpl) и не будет создавать на сервер лишней нагрузки.

Все вычисления происходят через Браузер пользователя. Как и название текущей страницы так и ссылка на страницу, которой будут делится. Всё это реализовано через JS функцию encodeURIComponent, которая в отличии от $_SERVER запрашивает данные не с сервера, а с браузера пользователя. Размер скрипта тоже не велик - 1 кб.

 

Картинки для кнопок приложил в файлах, но если что позже выложу подробную инструкцию.

 

Краткая инструкция по установке:

В том месте где сейчас стоит ваш скрипт стороннего сервиса, добавляете вот этот код:

<script src="/soc.js"></script>

В принципе его можно добавить в любое место вашего сайта, где бы вы хотели видеть эти кнопки.

Далее:

В корневом каталоге вашего сайта (в самую главную папку, где лежит файл robots.txt и.т.д. добавляете js файл с названием soc.js  со следующим содержанием:

function soc() {var title=encodeURIComponent(document.title);var url=encodeURIComponent(location.href);var dir='/';var knopka=[['plus.google.com/share?url='+url+'&title='+title,'googleplus.png','Google Plus'],['facebook.com/sharer.php?u='+url,'fb.png','FaceBook'],['vkontakte.ru/share.php?url='+url,'vkontakte.png','Вконтакте'],['odnoklassniki.ru/dk?st.cmd=addShare&st._surl='+url+'&title='+title,'ok.png','Одноклассники'],['connect.mail.ru/share?share_url='+url,'mailrumir.png','Мой@Мир'],['twitter.com/?status='+title+' '+url,'twitter.png','Twitter'],['livejournal.com/update.bml?event='+url+'&subject='+title,'livejournal.png','LiveJournal'],['linkedin.com/shareArticle?mini=true&url='+url+'&title='+title,'linkedin.png','Linkedin'],];var style='<div style="text-align:center"><strong></strong> '; for (i=0;i<knopka.length;i++) {style+='<!--noindex--><a rel="nofollow" href="http://'+knopka[i][0]+'" target=_blank><img src="'+dir+knopka[i][1]+'" alt="Поделиться в '+knopka[i][2]+'" title="Поделиться '+knopka[i][2]+'"></a><!--/noindex-->';}style+='</div>';document.write(style);}soc();

Сохраняете его, и далее туда же (в корневой каталог) добавляете все картинки, которые я прикрепил к теме.

 

Сейчас добавил только те соц сети, которые считаю самыми актуальными. Далее добавлю и другие.

 

Доработку буду обновлять и поддерживать всех скачавших постоянными ответами на вопросы. Разработка полностью бесплатна.

Но буду благодарен за отзывы в этой теме, если разработка вам понравилась:

https://talk.pr-cy.ru/topic/20362-besplatnye-uslugi-s-kodom-sajta/

 

 

 

post-13296-0-38479800-1449506873.png

post-13296-0-38187900-1449506875.png

post-13296-0-34004800-1449506877.png

post-13296-0-71950600-1449506878.png

post-13296-0-34827400-1449506880.png

post-13296-0-35305000-1449506882.png

Link to post
Share on other sites

Есть вопрос? Задай его профессиональным веб-мастерам, SEO и другим специалистам!

Пользуюсь кнопками от яндекса, по нескольким причинам:

1 кнопки отображают кол-во нажатий, а точнее ссылок с той или иной соцсети

2 в метрике видно сколько раз нажали и в каких материалах

 

Слышал можно скрипт яндекса разместить на своем сервере, не знаете, возможно-ли и как это реализовать?

Link to post
Share on other sites

Слышал можно скрипт яндекса разместить на своем сервере, не знаете, возможно-ли и как это реализовать?

Очень просто, скачивайте файлы js, которые даёт яндекс и размещайте их на сайте прописав к ним другие ссылки.

 

Например вместо:

<script type="text/javascript" src="//yastatic.net/es5-shims/0.0.2/es5-shims.min.js" charset="utf-8"></script>
<script type="text/javascript" src="//yastatic.net/share2/share.js" charset="utf-8"></script>

Прописать:

<script type="text/javascript" src="/js/es5-shims.min.js" charset="utf-8"></script>
<script type="text/javascript" src="/js/share.js" charset="utf-8"></script>

Так-же как и библиотеки JQuery рекомендуют хранить локально (безопаснее).

 
Link to post
Share on other sites

Этот скрипт сделан с большим акцентом на производительность.

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

А если включать сюда счетчик поделившихся, то такие данные придется запрашивать с соц. сетей, а это на производительности скажется.

Сейчас скрипт это просто ссылки на соц сети, и тем не менее при нажатии на них, происходит публикация на стену пользователей. Именно производительностью мой скрипт и отличается от других скриптов.

Но если кто-то хочет, можно сделать и счетчик возле кнопок.

Link to post
Share on other sites

Этот скрипт сделан с большим акцентом на производительность.

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

А если включать сюда счетчик поделившихся, то такие данные придется запрашивать с соц. сетей, а это на производительности скажется.

Сейчас скрипт это просто ссылки на соц сети, и тем не менее при нажатии на них, происходит публикация на стену пользователей. Именно производительностью мой скрипт и отличается от других скриптов.

Но если кто-то хочет, можно сделать и счетчик возле кнопок.

А почему бы не сделать кнопки еще быстрее и отказаться от JS и write. Разве нельзя сразу просто html код вставить.

Link to post
Share on other sites

А текущий урл как узнавать в html?

Урл выводить <?php echo $_SERVER['REQUEST_URI'] ?>

Вот title сразу не заметил, тут немного сложнее. Но для большинства cms можно его найти. А так мысль хорошая, возьму ваш пример на вооружение.

Link to post
Share on other sites

По вашему $_server это html? Я уже писал почему я php функцию не использую. Читайте пожалуйста внимательнее!
Если сможете написать обращение разработчикам html, договориться со стандартом w3c и каждому разработчику браузеров написать о добавлении такой функции в html, то я - сделаю.
А пока читайте внимательнее всë что написанно выше!

P.S.

Title как раз не обязательно узнавать средствами PHP. Пробуйте поделится кнопками ниже. Всё происходит автоматически. Это при всём при том, что у Talk.pr-cy.ru нет разметки Open Graph.

post-13296-0-45273500-1449506884.png post-13296-0-51635300-1449507007.png

Link to post
Share on other sites

на php можете сделать? для статики не пойдет, зато меньше скриптов для пользователя.

Могу. Установка будет немного по сложнее для Вас, ну и минусы у этого есть. Их я уже писал в первом посте. Но если всë же за хотите на php, сделаю.

Link to post
Share on other sites

Это для кого?

В скрипте подгружается урл http://share.yandex.ru/gpp.xml? 

А я написал этот скрипт, именно для предотвращения вызова внешних урлов и лишней нагрузки на сервер. Хоть и маленькой.

Link to post
Share on other sites
  • Administrators

Это для кого?

В скрипте подгружается урл http://share.yandex.ru/gpp.xml? 

А я написал этот скрипт, именно для предотвращения вызова внешних урлов и лишней нагрузки на сервер. Хоть и маленькой.

Вы не писали этот скрипт. Вы взяли чужую наработку, немного исправили и выдали за свою. 

Link to post
Share on other sites

Вы не писали этот скрипт. Вы взяли чужую наработку, немного исправили и выдали за свою. 

Я сам лично брал API каждый соц. сети, которая сейчас в скрипте, приделал ей функцию encodeURIComponent и подбирал (скачивал) картинки. Картинки не рисовал - да. Чужую работу (скрипт) не смотрел даже!

Link to post
Share on other sites
  • Administrators

Спасибо, вкусная лапша.

 

http://javascript.ru/forum/dom-window/11553-kod-vyvoda-formy-dlya-dobavleniya-sajjta-v-soc-zakladki-i-v-izbrannoe.html 

 

Вы просто не заморачиваясь переименовали функции и обновили ссылки сетей до актуальных. И выдали за своё. 

Link to post
Share on other sites

Спасибо, вкусная лапша.

 

http://javascript.ru/forum/dom-window/11553-kod-vyvoda-formy-dlya-dobavleniya-sajjta-v-soc-zakladki-i-v-izbrannoe.html 

 

Вы просто не заморачиваясь переименовали функции и обновили ссылки сетей до актуальных. И выдали за своё. 

И в правду, оба скрипта на JS написаны. Да ещё и без функции не обошлись и там и там. Явно скопировано! 

 

P.S. Вот для PHP страниц:

<a href="http://facebook.com/sharer.php?u='<?php echo $_SERVER['REQUEST_URI'] ?>'">Картинка</a>
<a href="http://vkontakte.ru/share.php?url='<?php echo $_SERVER['REQUEST_URI'] ?>'">Картинка</a>

Тут кстати тоже половина кода (тот что в одинарных кавычках) скопировано с PHP.NET - не судите строго, ув. DevilStar

Link to post
Share on other sites
Guest
This topic is now closed to further replies.
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...