Поделится Կոճակ WordPress_ի համար

Коды:

Odnoklassnik

function voteOdnoklassniki(){

var url = «http://www.odnoklassniki.ru/dk?st.cmd=addShare&st.s=1&st._surl=«+encodeURIComponent(url);

window.open(url,»,’toolbar=0,status=0,width=626,height=436′);

}

FACEBOOK

function calculateFB(idbrand){

var facebook = ‘  https://api.facebook.com/method/fql.query?query=select total_count from link_stat where url=«‘ +encodeURIComponent(url)  + ‘»&format=json&callback=?’;

$.getJSON(facebook, function(data) {

});

}

Добавление кнопок социальных сетей себе на сайт

При создании новостного портала или просто блога с интересными заметками, для увеличения количества реальных посетителей, я рекомендую разместить кнопки добавления в популярные социальные сети: Однокласники, Вконтакте, Twitter, Facebook, LiveJournal и другие.

Для добавления каждой кнопочки приходится перечитать гору документации. Здесь в одной статье я собрал все свои поиски.

Адрес перехода на Twitter:

http://twitter.com/timeline/home?status=__ЗАГОЛОВОК_СТРАНИЦЫ__%20__АДРЕС__

Пример ссылки:

<a href=\»#\»

onclick=\»this.href=’http://twitter.com/timeline/home?status=’+document.title+’%20’+window.location.href+window.location.hash\»>

Добавить в Twitter</a>

Обратите внимание, что длина сообщения не должна превышать 140 символов.

Документация Twitter-API-Documentation, Application-Ideas.

Иконки:

Facebook

Адрес перехода на Facebook: wordpress

http://www.facebook.com/share.php?u=__АДРЕС__

Пример ссылки:

<a href=\»#\»

onclick=\»this.href=’http://www.facebook.com/share.php?u=’+window.location.href+window.location.hash\»>

Добавить в Facebook</a>

Документация Specifying_Meta_Tags, Facebook_Share.

Иконки:

Вконтакте

Адрес перехода на vkontakte.ru:

http://vkontakte.ru/share.php?url=__АДРЕС__&title=__ЗАГОЛОВОК_СТРАНИЦЫ__

Пример ссылки:

<a href=\»#\»

onclick=\»this.href=’http://vkontakte.ru/share.php?url=’+window.location.href+window.location.hash+’&title=’+document.title\»>

Добавить в ВКонтакт</a>

Документация Документация » Сайты » Публикация ссылок, Документация » Сайты » Open API.

Иконки:

LiveJournal

Адрес перехода на LiveJournal:

http://www.livejournal.com/update.bml?mode=full&subject=test&event=__АДРЕС__

Пример ссылки:

<a href=\»#\»

onclick=\»this.href=’http://www.livejournal.com/update.bml?mode=full&subject=test&event=’+window.location.href+window.location.hash\»>

Добавить в LiveJournal</a>

Документация lj_dev.

Иконки:

LinkedIn

Адрес перехода на LinkedIn:

http://www.linkedin.com/shareArticle?mini=true&url=__АДРЕС__&title=G__ЗАГОЛОВОК_СТРАНИЦЫ__&source=CIO.com

Документация docs.

Buzz

Адрес перехода на Buzz:

http://www.google.com/buzz/post?message=__ЗАГОЛОВОК_СТРАНИЦЫ__&url=__АДРЕС__&hl=ru

Документация apis.

Яндекс

Адрес перехода на Яндекс:

http://wow.ya.ru/posts_share_link.xml?url=__АДРЕС__&title=__ЗАГОЛОВОК_СТРАНИЦЫ__&body=__ЧАСТЬ_СТРАНИЦЫ__

Блок «поделиться»

Поделиться…

<script type=»text/javascript» src=»//yandex.st/share/share.js» charset=»utf-8″></script>

<div class=»yashare-auto-init» data-yashareL10n=»ru» data-yashareType=»button»

data-yashareQuickServices=»yaru,vkontakte,facebook,twitter,odnoklassniki,moimir,lj,friendfeed,moikrug»>

</div>

Документация share, блок «поделиться».

Иконки:

Мой мир

Адрес перехода на Мой мир:

http://connect.mail.ru/share?url=__АДРЕС__&title=__ЗАГОЛОВОК_СТРАНИЦЫ__&description=&imageurl=

Кнопка «Нравится»

<a target=»_blank»

href=»http://connect.mail.ru/share&#187;

data-mrc-config=»{‘type’ : ‘button’,

‘width’ : ‘550’,

‘show_text’ : ‘true’,

‘show_faces’ : ‘true’}»>Нравится</a>

<script src=»http://cdn.connect.mail.ru/js/loader.js&#187;

type=»text/javascript» charset=»UTF-8″></script>

Документация share, кнопка «нравится».

Иконки:

Готовый блок кода:

<script language=»JavaScript»><!—

function addSoc(a) {

h=encodeURIComponent(window.location.href+window.location.hash);

t=encodeURIComponent(document.title);

if(a==1)h=’vkontakte.ru/share.php?url=’+h+’&title=’+t;

else if(a==2)h=’odnoklassniki.ru/dk?st.cmd=addShare&st.s=1000&st._surl=’+h+’&tkn=3009′;

else if(a==3)h=’www.livejournal.com/update.bml?mode=full&subject=’+t+’&event=’+h;

else if(a==4)h=’twitter.com/timeline/home?status=’+t+’%20’+h;

else if(a==5)h=’www.facebook.com/share.php?u=’+h;

else if(a==6)h=’wow.ya.ru/posts_share_link.xml?url=’+h+’&title=’+t;

else if(a==7)h=’connect.mail.ru/share?url=’+h+’&title=’+t+’&description=&imageurl=’;

else if(a==8)h=’moikrug.ru/share?ie=utf-8&url=’+h+’&title=’+t+’&description=’;

else return;

window.open(‘http://’+h,’Soc&#8217;,’screenX=100,screenY=100,height=500,width=500,location=no,toolbar=no,directories=no,menubar=no,status=no’);

return false;

//—></script>

<a href=»#» onclick=»return addSoc(1);» title=»Twitter»><img src=»/pic/ico_twitter.gif» width=8 height=12></a>

<a href=»#» onclick=»return addSoc(2);» title=»Facebook»><img src=»/pic/ico_facebook.gif» width=12 height=12></a>

<a href=»#» onclick=»return addSoc(3);» title=»Vkontakte»><img src=»/pic/ico_vk.gif» width=12 height=12></a>

<a href=»#» onclick=»return addSoc(4);» title=»Одноклассники.ru»><img src=»/pic/ico_odno.gif» width=12 height=12></a>

<a href=»#» onclick=»return addSoc(5);» title=»livejournal»><img src=»/pic/ico_lj.png» width=12 height=12></a>

<a href=»#» onclick=»return addSoc(6);» title=»Яндекс»><img src=»/pic/ico_ya.png» width=12 height=12></a>

<a href=»#» onclick=»return addSoc(7);» title=»Мой мир»><img src=»/pic/ico_mymail.gif» width=12 height=12></a></h4>

Скопировать в буфер

Более сложное, но красивое решение.

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

Представлено два варианта с иконками:

16×16:

12×12:

<style type=»text/css»>

.social-net-buttons-16 a{

background-image: url(/pic/social-net-16.png);

width: 16px;

height: 16px;

display: block;

float: left;

margin-right: 5px;

}

.social-net-buttons-16 a.icon-vk-16{background-position: 0 0;}

.social-net-buttons-16 a.icon-ok-16{background-position: 0 -16px;}

.social-net-buttons-16 a.icon-lj-16{background-position: 0 -32px;}

.social-net-buttons-16 a.icon-twitter-16{background-position: 0 -48px;}

.social-net-buttons-16 a.icon-facebook-16{background-position: 0 -64px;}

.social-net-buttons-16 a.icon-yaru-16{background-position: 0 -80px;}

.social-net-buttons-16 a.icon-moimir-16{background-position: 0 -96px;}

.social-net-buttons-16 a.icon-moikrug-16{background-position: 0 -112px;}

.social-net-buttons-12 a{

background-image: url(/pic/social-net-12.png);

width: 12px;

height: 12px;

display: block;

float: left;

margin-right: 5px;

}

.social-net-buttons-12 a.icon-vk-12{background-position: 0 0;}

.social-net-buttons-12 a.icon-ok-12{background-position: 0 -12px;}

.social-net-buttons-12 a.icon-lj-12{background-position: 0 -24px;}

.social-net-buttons-12 a.icon-twitter-12{background-position: 0 -36px;}

.social-net-buttons-12 a.icon-facebook-12{background-position: 0 -48px;}

.social-net-buttons-12 a.icon-yaru-12{background-position: 0 -60px;}

.social-net-buttons-12 a.icon-moimir-12{background-position: 0 -72px;}

.social-net-buttons-12 a.icon-moikrug-12{background-position: 0 -84px;}

</style>

<div class=»social-net-buttons-16″>

<a href=»#» onclick=»return addSoc(1);» title=»Vkontakte» class=»icon-vk-16″></a>

<a href=»#» onclick=»return addSoc(2);» title=»Одноклассники.ru» class=»icon-ok-16″></a>

<a href=»#» onclick=»return addSoc(3);» title=»livejournal» class=»icon-lj-16″></a>

<a href=»#» onclick=»return addSoc(4);» title=»Twitter» class=»icon-twitter-16″></a>

<a href=»#» onclick=»return addSoc(5);» title=»Facebook» class=»icon-facebook-16″></a>

<a href=»#» onclick=»return addSoc(6);» title=»Я.ру»></a>

<a href=»#» onclick=»return addSoc(7);» title=»Мой Мир» class=»icon-moimir-16″></a>

<a href=»#» onclick=»return addSoc(8);» title=»Мой Круг»></a>

</div>

<br />

<div class=»social-net-buttons-12″>

<a href=»#» onclick=»return addSoc(1);» title=»Vkontakte» class=»icon-vk-12″></a>

<a href=»#» onclick=»return addSoc(2);» title=»Одноклассники.ru» class=»icon-ok-12″></a>

<a href=»#» onclick=»return addSoc(3);» title=»livejournal» class=»icon-lj-12″></a>

<a href=»#» onclick=»return addSoc(4);» title=»Twitter» class=»icon-twitter-12″></a>

<a href=»#» onclick=»return addSoc(5);» title=»Facebook» class=»icon-facebook-12″></a>

<a href=»#» onclick=»return addSoc(6);» title=»Я.ру»></a>

<a href=»#» onclick=»return addSoc(7);» title=»Мой Мир» class=»icon-moimir-12″></a>

<a href=»#» onclick=»return addSoc(8);» title=»Мой Круг»></a>

</div>

</br>

Ներբեռնել փաստաթուղտը

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

Заполните поля или щелкните по значку, чтобы оставить свой комментарий:

Логотип WordPress.com

Для комментария используется ваша учётная запись WordPress.com. Выход / Изменить )

Фотография Twitter

Для комментария используется ваша учётная запись Twitter. Выход / Изменить )

Фотография Facebook

Для комментария используется ваша учётная запись Facebook. Выход / Изменить )

Google+ photo

Для комментария используется ваша учётная запись Google+. Выход / Изменить )

Connecting to %s