Поділитися з друзями у соціальних мережах. Кнопки соціальних мереж. Кнопки соціальних мереж Share Pluso

Тут фраза "Хто хоче купити софт зі знижкою 8% по акції?" написана самим користувачем, а нижче - те, як посилання на сайт виглядає у соц.мережі. Не дуже гарно, правда?

тоді посилання в соц.мережі буде виглядати так:

Тут «Сьогодні день Народження allsoft.ru – 8 років:)» – текст написаний користувачем, решта – інформація з мета-тегів. Детальніше про ці мета-теги можна прочитати на сторінці Facebook developers.facebook.com/docs/share, інші соц.мережі теж їх цілком розуміють.

Як взагалі працює цей механізм?
1. Коли користувач натискає кнопку, віджет передає серверу соц.мережі посилання на сторінку.
2. Сервер соц. мережі сам звертається за цим посиланням та зчитує інформацію про сторінку - заголовок, опис, картинку.
3. Сервер соц. мережі кешує на своїй стороні інформацію про сторінку та відображає на сторінках соц.мережі

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

New Ya.share(( element: "ya_share_normal", elementStyle: ( "type": "none", "quickServices": ["facebook","twitter","odnoklassniki","vkontakte","moimir"] ), link: "http://allsoft.ru/promo/allsoft8let/?share=normal", serviceSpecific: ( twitter: ( title: "Результат тесту: Дракон майже Ваш «коник»! Ви поки не можете викладати Драконознавство, але на правильному шляхи!")))));
1. Тут ya_share_normal - id елемента на сторінці (), в якому з'являтиметься блок із соціальними кнопками, link - посилання, плюс у serviceSpecific для твіттера вказуємо title, який відрізняється від того, що знаходиться в мета-тезі og:title.

Таким чином, для завдання «3 різні результати тесту плюс загальне посилання на сторінку поза тестом» у нас буде 4 теги:

і 4 блоки коду JavaScript, як зазначено вище.

Як змінити закешований соц.мережею заголовок та опис.
1. Для Facebook є самий кращий спосіб: зайти на їх дебаггер

В Інтернеті, ймовірно, не залишилося сайтів, на яких не були б розміщені кнопки для постінгу матеріалів у соціальні мережі. Останні давно й міцно посіли місце у наших життях. Ми там спілкуємося, знайомимося, розкручуємо бізнес, читаємо новини та інше. Повний діапазон. Не дивно, що веб-майстри прагнуть розширити наявність своїх сайтів у соцмережах будь-якими доступними методами. Адже там лежать тонни потенційного трафіку, який потрібний абсолютно всім. Потік відвідувачів – це гроші, репутація, зростання. Все будується довкола нього. Смачний шматок.

Соцкнопки потрібні, це очевидно. Питання в іншому - які вибрати? Ми для вас протестували ТОП 5 різних сервісів щоб додати код кнопок на сайти. Ціль - виявити оптимальний і показати його в деталях. Почнемо з відбірного етапу.

Вибір найкращого сервісу соціальних кнопок

Вибір претендентів для порівняння виявився банальним - ми взяли найпопулярніші сервіси , про які чула будь-яка людина, якось близько знайома з темою створення сайтів. Жодних рідкісних, що набирають популярність, тільки досвідчені дідки.

Склад команди атестованих такий:

Внаслідок тестування обраних соціальних сервісів – лідером виявився uSocial . Тепер ви бажаєте одержати обґрунтування нашого вибору. Звісно, ​​голослівними не залишимося.

Особливості кнопок uSocial

Наведемо деякі факти , які переконали нас у правильності прийнятого рішення.

Словесного порівняння багатьом виявиться мало. Тому ми склали порівняльну таблицю кнопок від uSocial та інших дебютантів (використовується шкала оцінки - від 1 до 5). Всі ці дані отримані у процесі тестування.

Сподіваємося, проведений аналіз зміг розвіяти ваші сумніви щодо обґрунтованості нашого вибору. Крім приємної зовнішності соціальні кнопки від uSocial носять глибокий прикладний характер, будучи досить потужним інструментомдля просування будь-яких проектів.

Інструкція як встановити кнопки соціальних мереж на сайт

Для розміщення соціальних кнопок від uSocial на своєму сайті необхідно виконати кілька простих кроків:

Крок 1

Крок-2

Збираємо набір соціальних кнопок. Можна вибрати відображаютьсясервіси соціальних мереж, форму і стиль кнопки.

Тут можна активувати кнопку "Вгору", включити підтримку мобільних пристроїв, підключити послуги Viber, WhatsApp, Telegram, SMS.

Після завершення всіх операцій вводимо адресасвого сайту і тиснемо на кнопку «Отримати код».

Крок-3

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

Крок-4

Після встановлення соцбару з особистого кабінету uSocial можна переглядати статистку лайків та репостівза вибраний період як одразу по всіх соціальних мережах, так і по вибраних. Дані відображаються у вигляді зрозумілих графіків чи діаграм.

У особистому кабінеті uSocialзберігатимуться всі створені набориі статистикадля веб-сайтів, до яких вони були прикріплені. У будь-який час можна перемикатися між сайтами та аналізувати отримані зі лічильників дані.

Як збільшити ККД соцбару?

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

При коректному заповненні соціальних мета-тегів записи правильно сприйматимуться соціальними сервісамиБо в них вказаний тип матеріалу, релевантний заголовок, посилання на потрібну картинку. Все це підвищує ефективність репостингу: ваш матеріал коректно проіндексується соціальними сервісами.

Приклади коду мікророзміткидля популярних соціальних мереж (код потрібно прописувати перед тегом):

1. Facebookі Вконтактевикористовують Open Graph protocol:

3. Для Twitterкод виглядає так:

4. Для Google+так:

- Посилання на профіль автора в Google+
- Назва сайту
- текст сніпету (до 40 символів)
- Опис сайту
- шлях до файлу зображення

Інструменти для роботи із мікророзміткою.

Як зробити перепост "ВКонтакте" записів зі стіни друзів

Функція "Розповісти" дозволяє швидко розміщувати записи друзів або спільнот на своїй стіні. Для цього необхідно навести на позначку "Мені подобається" і у вікні вибрати необхідну дію.

Як зробити перепис "ВКонтакті" своїх записів або публікацій групи

Стіна на вашій сторінці може бути як публічною, так і закритою. У розділі "Мої настройки" на сторінці ви можете вимкнути коментування стіни та відзначити того, хто може залишати на ній запис. Після таких змін друзі будуть бачити ваші публікації, ділитися ними, але відповіді на будь-який запис, розміщений у вас, можна буде побачити лише на їхній сторінці. Стіна може служити вам місцем для зберігання цитат, висловлювань, картинок, що полюбилися. Тут можна записувати назви книг, які вирішили прочитати, а також наголошувати на заходах, на які хотіли б потрапити.

Створені вами записи можна відправити на стіну до спільноти, в якій перебуваєте, а також особистим повідомленням другові "ВКонтакті" або на e-mail.

Вибирайте потрібні вам функції стіни "ВКонтакті", обмінюйтесь інформацією та отримуйте задоволення від спілкування.

Один з них - мала гнучкість та обмежений вибір стандартних налаштувань. Взяти, наприклад, блок, з нещодавно навіщось разом із соціальними кнопками завантажується вбудована Метрика… Знову ж таки змінити розмір або колір кнопок досить проблематично.

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

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

Онлайн-демо та вихідники даного прикладуви знайдете в кінці статті, а зараз по порядку розпочнемо реалізацію. Спочатку переконайтеся, що на сайті використовується jQuery, інакше підключіть його, в WordPress це краще робити через файл functions.php:

function my_jquery() ( wp_enqueue_script("jquery"); ) add_action("wp_enqueue_scripts", "my_jquery");

Потім підключіть Font Awesome- ми використовуватимемо векторні іконки соціальних мереж замість зображень. Тепер необхідно вставити HTML основу кнопок у код шаблону:

В принципі код універсальний, але як приклад я наводжу соціальні кнопки для WordPress. Тут посилання на поточну сторінку, де розташовані кнопки, виводиться функцією the_permalink() , а заголовок береться з функції the_title() . В інших CMS необхідно замінити ці функції аналогічними.

За допомогою стилів оформимо наші кнопочки, задамо колір фону та тексту, додамо ефект при наведенні курсору миші. У style.css додамо наступний код:

#share ( width: 100%; border: 1px solid #eaeaea; margin: 0 auto; background: #fff; text-align: center; ) .like ( font-size: 16px; font-weight: 700; line-height : 50px; ) .push ( display: inline-block; width: 22%; min-width: 100px; : #fff; cursor: pointer; .. facebook (background-color: #4267b2;) twitter:hover (background-color: #1a91da; color: #fff;) .vkontakte (background-color: #5181b8;) .vkontakte:hover (background-color: #5b88bd; -color: #ee8208;) .odnoklassniki:hover (background-color: #ee7808; color: #fff;)

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

На цьому все! Не соромтеся залишати повідомлення в коментарях, якщо раптом щось не виходить або виникли запитання.

Ділимося за допомогою Публікатора

• У Хроніці.
• У верхній частині Стрічки Новин вашої головної сторінки.

Щоб опублікувати оновлення статусу:

Найчастіше користувачі Facebook діляться оновленнями своїх статусів – коротких текстових записів, які можуть прочитати та прокоментувати друзі. Коли ви публікуєте оновлений статус, він з'являється у вашій Хроніці та Стрічках новин ваших друзів.

Публікація у Хроніці друга

Видалення вашого розташування із записів

Після того, як ви додали ваше місцезнаходження до публікації, воно може автоматично додаватися до наступних записів. Якщо ви не бажаєте цього, клацніть значок у формі хрестика поруч із назвою місця в режимі редагування публікації.

Якщо ви використовуєте мобільний додаток, виберіть піктограму Розташування, а потім натисніть піктограму у формі хрестика в нижній частині екрана, щоб видалити розташування з публікації.

Лайки, коментарі та перепост

Ви можете нескінченно ділитися новими публікаціями у Facebook. Також ви можете ставити позначки «Подобається», коментувати та ділитися чужими записами та історіями, якими поділилися на Facebook ваші друзі.

Відмітки «Подобається» (Лайк)

Коли ваші друзі публікують щось у Facebook, вам це може сподобається і ви можете відзначити запис за допомогою кнопки «Подобається». Це простий спосіб показати вашим друзям, що вам дійсно подобається те, що вони з вами поділилися.

За допомогою кнопки «Подобається» ви можете також відзначати сторінки компаній та організацій, щоб відстежувати їх оновлення у своїй Стрічці Новин.

Пам'ятайте, що кожна сторінка, яку ви позначите натисканням кнопки «Подобається», може з'явитися у вашій Хроніці та Стрічках Новин ваших друзів. Залежно від ваших інтересів це може бути компрометуючим фактом.