Колко бутона за споделяне трябва да добавя? Бутони за социално споделяне – ние го пишем сами

Отбелязах значението на SMO (оптимизация на социалните медии) при промоцията на уебсайтове. Сега нека поговорим директно за това как да направите социална оптимизация на вашия уебсайт, или по-точно как да добавите социални бутони на популярни мрежи към вашия уебсайт.

Първо, ще ви покажа как всъщност трябва да изглежда на сайта. В много блогове и новинарски сайтове в долната част на всяка статия можете да видите нещо подобно:

Това са социалните бутони, благодарение на които се постига SMO, а след това и социална активност. Тази статия е посветена на въпроса къде да получите кода за тези социални мрежи. бутони и как да ги инсталирате правилно на уебсайта си. Нека първо да обмислим инсталирането на Google+.

1. Добавете бутон Google+ към сайта

2. Добавяне на бутон „Харесва ми“ от VKontakte и Facebook към сайта 2.1. Харесва ми от Фейсбук

Нека започнем, като вземем кода на бутона на Facebook. За да направите това, посетете тази страница: https://developers.facebook.com/docs/plugins/like-button. Трябва да видите следната картина:

Горе вдясно можете да видите как ще изглежда бутонът на вашия уебсайт. Нека да разгледаме параметрите, които могат да бъдат зададени:

1. URL за харесване
Това е незадължителен параметър. Ако оставите полето празно, всяка страница ще има свой индивидуален брояч за харесвания. Ако въведете конкретен URL там, броячът ще бъде единичен (харесванията се сумират от всички страници на този сайт).

2. Бутон за изпращане
Добавете или премахнете бутон за изпращане на съобщения. Препоръчвам да премахнете този бутон, защото... Нашата цел е просто да поставим бутон „харесвам“, въпреки че може би вие имате съвсем различни цели.

3. Стил на оформление
Стил на показване на бутоните. Лично аз най-много харесвам стандарта.

4. Ширина
Ширината на бутона в пиксели. Обикновено задавам не повече от 100 пиксела.

5.Глагол за показване
Какво ще се покаже на бутона: „Харесва ми“ или „Препоръчвам“. Обикновено избирам първата опция (по подразбиране), защото е по-ефективен начин да мотивирате потребителя да хареса.

6.Цветова схема
Цветова гама: бяло или черно.

7.Шрифт
Просто задаване на шрифта за надписа "Харесва ми".

След като зададете настройките, щракнете върху бутона „вземете код“ и го поставете на сайта. Общ код на бутона за facebook:

(функция(d, s, id) ( var js, fjs = d.getElementsByTagName(s); if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js. src = "//connect.facebook.net/ru_RU/all.js#xfbml=1"; fjs.parentNode.insertBefore(js, fjs); )(document, "script", "facebook-jssdk")); 2.2. Харесвам от VKontakte

Сега нека да разгледаме как да получите кода на бутона „харесвам“ от VKontakte. За да направите това, отидете на следната страница: https://vk.com/dev. Трябва да видите следната страница:

Първо ще трябва да добавите нов сайт. За да направите това, изберете опцията за свързване на нов сайт от падащото меню „сайт/приложение“:

След като добавите нов сайт, запазете го. Сега изберете желания сайт от падащото меню. Това е последвано от малък брой параметри: „опция на бутон“, „височина“, „име на бутон“ - всичко това може да се персонализира по ваш вкус. В края ще има код за бутона:

VK.init ((apiId: 2872188, onlyWidgets: true )); VK.Widgets.Like ("vk_like", (тип: "бутон")); 3. Добавете туит бутон към сайта

Както в предишните случаи, първо отидете на мястото, където сте получили и конфигурирали бутона.

Friendfeed е агрегатор на информация, събрана от социални мрежи, блогове, микроблогове, който работи в реално време. С Friendfeed можете да откривате и обсъждате интересни материали, които вашите приятели намират в интернет!

Surfingbird е услуга, която предлага най-интересното съдържание в интернет. За да направите това, трябва да се регистрирате, да посочите вашите интереси, а от своя страна тази услуга ще предлага интересни снимки, видеоклипове, бележки в зависимост от посочените интереси. Интересна услуга, ще трябва да я разгледам по-отблизо!

Уважаеми читатели на моя блог, някой има ли акаунти в последните четири представени услуги? Последното ме интересува, задължително ще се регистрирам!

Лично аз избрах първия вариант, който се нарича броячи. Той ще покаже броя препоръки на публикацията, с други думи, колко пъти е споделена връзката към публикацията. След като изберете опция за показване, ще трябва да копирате кода по-долу, който ще трябва да бъде публикуван в блога.

В моя случай (поради факта, че избрах дисплея „броячи“), кодът се оказа така:


Съдържанието е текстът на публикацията.

Но ако просто подредите предложения код, ще получите следния дисплей:

Yashare-auto-init(
margin:10px автоматично;
подравняване на текст: център;
}

Където yashare-auto-init е клас, който е добавен заедно с кода. Margin:10px auto е съответно хоризонталното и вертикалното поле, а text-align:center е центрираното местоположение на обекта.

Развитието на блога набира скорост, външният вид се променя и подобрява, блогът постепенно се попълва с интересно съдържание, съветвам ви да се абонирате за блога, за да сте в крак с всички промени и актуализации на блога.

От автора: Поздрави. Днес социалните мрежи са се развили до такова ниво, че в тях са регистрирани общо над 3 милиарда души. Това е потенциално много мощна аудитория, така че днес ще ви кажа как да добавите бутони за социални медии към уебсайта си.

Добавяне към WordPress сайт

Позволете ми да започна, като кажа, че най-лесният начин, ако имате WordPress, е просто да инсталирате някакъв плъгин за този въпрос. Който? Например използвах Juiz Social Post Sharer. Като цяло, просто въведете думата social в търсенето на плъгини и вижте какво има там. Единственото предимство тук е, че вероятно няма да се налага да конфигурирате нищо.

Yandex също разработи страница, на която можете да персонализирате и инсталирате бутони за себе си. На тази страница можете да изберете услугите, от които се нуждаете (и има около 25 от тях). Отдясно можете да изберете външния вид на блока. Това могат да бъдат броячи, които ще показват колко пъти потребителите са кликнали върху бутоните. Това от своя страна ще ви помогне да проследите дали материалът е полезен за читателите.

JavaScript. Бърз старт

Естествено, не е необходимо да използвате и трите опции; едната е по-добра. Въпреки че съм виждал сайтове, където блокът беше и в началото, и в края на страницата.

Сега трябва да намерите файла с кода, който показва статиите. В wordpress, например, обикновено се нарича single.php или подобно. Така че, ако трябва да поставите блок с бутони след статията, потърсете реда the_content. Това е мястото, където можете да поставите кода. Ще ви помогне много, ако разработчикът на вашия шаблон направи коментари в кода.

Можете да редактирате файлове на сайта по няколко начина. Например, направете това директно през административния панел на двигателя (облик - редактор). В този случай кодът не е маркиран, така че не е толкова удобно за навигация. Друг начин е чрез ftp. Свържете се със сайта с помощта на FTP клиент, отидете на wp-content – ​​​​теми. Тук трябва да намерите шаблона, който е активен за вас в момента. Влизаме в него и намираме същия single.php или търсим нещо подобно по име.

В самия кодов файл намерете реда the_content с помощта на търсене (Ctrl + F). Поставете този код някъде след него.

Коментарите са това, което е подчертано в зелено на тази екранна снимка по-горе. Както можете да видите, разработчикът ясно е посочил, че текстът на самата статия ще бъде показан на това място. Това е страхотно, просто поставете кода веднага след статията и получете желания резултат.

Бутони от Pluso

JavaScript. Бърз старт

Научете основите на JavaScript с практически пример как да създадете уеб приложение.

Можете да изберете стила на бутоните, да персонализирате техния фон, позиция и размер. Можете също да изберете икони с вграден брояч. Друго предимство на бутоните Pluso е техният зашеметяващ външен вид и възможността да се интегрират в почти всеки дизайн.

Когато всичко е конфигурирано, просто копираме кода и го поставяме на мястото, където искаме да видим съответния блок.

Друг вариант е Share42

Ако не сте харесали предишните опции, има друг начин да добавите бутони за социални мрежи към сайта. Това е услуга на share42.com. Вероятно е наречен така, защото по време на създаването му е имало 42 бутона за социални услуги, въпреки че в момента те са 43.

Няма да описвам подробно процеса, защото всичко вече е представено на уебсайта под формата на инструкции стъпка по стъпка. Не можете да промените дизайна на тези икони, а само размера. Те обаче не изглеждат зле.

Необходимите икони трябва да бъдат избрани, като щракнете върху тях с мишката. Отделно бих искал да отбележа наличието на такива интересни функции като добавяне към предпочитани в браузъра, връзка към RSS и бутон „Назад към началото“.

След това можете да изберете вида на панела: хоризонтален или вертикален? И ако е избран вторият, тогава броят на бутоните може да бъде ограничен. Препоръчвам да оставите кодирането като UTF-8. Можете също така да добавите икона на самата услуга към набора от бутони, така че потребителите от вашата страница да могат да отидат до нея и да инсталират тези бутони и за себе си.

Освен това, ако планирате да добавите rss икона, тогава трябва да посочите адреса на вашата емисия, а ако искате да показвате броя на кликванията върху бутоните, последните две квадратчета трябва да бъдат отметнати.

Отдолу има 2 бутона. Първият ви позволява да видите как ще изглеждат социалните бутони, които сте конфигурирали. Използвайки втория, скриптът се изтегля. Трябва да го качите чрез ftp на вашия уебсайт в основната папка.

Следващата стъпка е да посочите пътя до тази папка на страницата на услугата. Често е достатъчно да замените site.com с името на вашия домейн. Това е всичко, остава само да вмъкнете кода, като първо изберете cms, на който работи ресурсът. Вече трябва да разберете къде да вмъкнете кода, надявам се.

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

Е, днес научихме как да добавяме бутони за социални мрежи и услуги към вашия интернет проект. Сега вашите полезни материали могат да бъдат автоматично разпространявани в социалните мрежи от вашите благодарни читатели. И това е всичко за мен.

JavaScript. Бърз старт

Научете основите на JavaScript с практически пример как да създадете уеб приложение.

Тук фразата „Кой иска да купи софтуер с 8% отстъпка от промоцията?“ написан от самия потребител, а по-долу е как изглежда връзката към сайта в социалната мрежа. Не е много красиво, нали?


тогава връзката в социалната мрежа ще изглежда така:

Тук „Днес е рожденият ден на allsoft.ru - 8 години :)“ е текстът, написан от потребителя, останалото е информация от мета тагове. Можете да прочетете повече за тези мета тагове на Facebook страницатаdevelopers.facebook.com/docs/share, други социални мрежи също ги разбират доста добре.

Как обикновено работи този механизъм:
1. Когато потребителят щракне върху бутона, джаджата предава връзка към страницата към сървъра на социалната мрежа.
2. Социален сървър Самата мрежа влиза в този линк и чете информация за страницата – заглавие, описание, снимка.
3. Социален сървър мрежата кешира информацията за страницата от своя страна и я показва на страниците на социалните мрежи

Как да изпратите различни описания за една страница.
Например, когато създавате промоционална страница на allsoft.ru с комичен тест, беше необходимо да изпратите различни описания в социалните мрежи за различния брой точки, отбелязани от потребителя в теста. Тъй като социалната мрежа получава описание на страница чрез щракване върху връзка, за различните описания са необходими различни връзки. Освен това Twitter позволява само 140 знака, така че се нуждае от отделно, по-кратко описание.

Нов Ya.share(( element: "ya_share_normal", elementStyle: ( "type": "none", "quickServices": ["facebook","twitter","odnoklassniki","vkontakte","moimir"] ), връзка: "http://allsoft.ru/promo/allsoft8let/?share=normal", serviceSpecific: ( twitter: ( заглавие: "Резултат от теста: Драконът е почти вашата силна страна! Все още не можете да преподавате драконология, но на прав път!" ) ) ));
1. Тук ya_share_normal е идентификаторът на елемента на страницата (), в който ще се появи блокът със социални бутони, връзката е връзката, плюс в serviceSpecific за Twitter посочваме заглавието, което се различава от това, което е в og: заглавен мета таг.

Така за задачата „3 различни резултата от теста плюс обща връзка към страница извън теста“ ще имаме 4 тагова:

и 4 блока JavaScript код, както по-горе.

Как да промените заглавието и описанието, кеширани от социалната мрежа.
1. Има най-добрият начин за Facebook: отидете на техния дебъгер

Във връзка с

Въпросът не е толкова в разширяването на списъка с това, което може да бъде прехвърлено на някого. В момента той обхваща почти всички видове данни, които представляват интерес за средния собственик на iPhone или iPad. Тоест, в допълнение към имейл, снимки, видеоклипове и музика, можете да предавате навигационни координати, списъци с контакти и адреси, връзки към тематични ресурси и конкретни файлове в „облаците“, кратки мултимедийни бележки, създадени с помощта на месинджъри и много други. Би било по-правилно да формулираме идеята по следния начин: когато се появи нова услуга, която използва собствен формат на данни, тогава трябва да се разпредели място в системата за нея, но досега всичко е балансирано.

Apple обаче разбира, че светът на iOS приложенията със сигурност ще се развива и следователно появата на такива нестандартни новодошли е въпрос на време. Вероятно от Купертино са решили да се отърват от допълнителната тежест и да инструктират авторите на приложенията сами да работят върху внедряването на функциите за „споделяне“. Стриктното изискване за сключване на споразумение с Apple е нещо от миналото, приложните програмни интерфейси (API) са направени отворени - дерзайте, ентусиазирани новатори. Това е потенциално най-обещаващата област на работа за създателите на социално ориентирани програми, но отговорността за резултата също е тяхна грижа.

Изключение се прави само за собствените продукти на компанията, като Mail, Messages, Photo Sharing - те винаги ще останат активни. Въпреки това, тъй като все още говорим за бета, това и други нововъведения все още може да се променят до септември.



Дял