Як додати кнопки соціальних мереж на сайт

Вступ

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

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

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

Давайте розглянемо, як все це виглядає на практиці. Людина зайшла на сайт, побачила там соціальні кнопки, натиснула на якійсь одній з них — Фейсбук, Вконтакті, Твіттер, Однокласники, і одразу ж поширила інформацію про вас - поділилася контентом. Ця інформація відразу ж буде опублікована на стіні користувача і в стрічці новин її друзів. Відповідно, всі друзі звернуть на це увагу, зможуть перейти за посиланням і таким чином дізнаються про ваш сайт (блог).

Де взяти ці соціальні кнопки? Варіантів безліч. Для цього існують спеціальні сервіси, які за допомогою невеличкого коду дають змогу вставити ледве не всі кнопки найпопулярніших соціальних мереж і не тільки. Приклади таких сервісів — Яндекс-Кнопки, Pluso, Share42.com і т.д.

Принцип роботи у всіх них майже однаковий. Заходите на будь-який сайт одного з таких сервісів, обираєте потрібні вам кнопки, система генерує код, який потім треба буде вставити у потрібне місце сайту. Тобто там, де б ви хотіли, щоб вони відображалися.

Давайте розглянемо на конкретному прикладі.

1. Блок "Поділитися" від Яндекса

Заходимо сюди, вибираємо кнопочки. Я, наприклад, для свого сайту обрав такий джентльменський набір: Вконтакті, Фейсбук, Однокласники, Google+, Твіттер, ЖЖ і Pocket. Думаю, цього більш ніж достатньо.

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

Відмітили. Що робимо далі? З правого боку обираємо зовнішнє оформлення кнопок: тільки іконки, лічильники, іконки і меню, маленького розміру. Найкращим варіантом. на мій погляд, буде відображення соціальних кнопок з лічильниками. Адже одразу буде видно, скільки разів читачі поділилися контентом.

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

2. Pluso

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

Принцип тут фактично такий самий: обираєте потрібні соціальні кнопки, здійснюєте всілякі налаштування (розмір, оформлення кнопок), копіюєте згенерований сервісом код, і вставляєте його в потрібне місце сайту, чи окремої сторінки.

3. Share42.com

Ну і розглянемо ще один сервіс соціальних мереж і закладок - Share42.com, який пропонує аж 42 кнопки. Вибір великий. Тут ще можна додати кнопки "Наверх", "Роздрукувати", "RSS", "Вибране браузера".

Здійснюєте налаштування, вибираєте необхідні опції, встановлюєте скріпт з кодом на сайт.

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

Кнопка "Подобається" і "Поділитись" від Facebook

Переходимо сюди. Як бачимо, окрім кнопок “Поділитись”, “Подобається”, “Зберегти”, “Підписатися”, тут можна додати коментарі на сайт (такі ж як у Фейсбук), вбудувати публікації, відео і т.д.

Але нас цікавлять лише кнопки. В даному випадку кнопка “Подобається” («Like»), тому обираємо саме її.

Весь процес відбувається в три етапи.

1. Визначаємо URL-адресу сайту.

Спочатку визначаємось з URL-адресою веб-сайту, де потрібно розмістити кнопку «Подобається». Можна, звичайно, URL не вказувати. В такому випадку кнопка буде прив'язана до тієї сторінки, де ви її розмістите.

2. Налаштовуємо конфігурацію кнопки.

Вставляємо URL-адресу, задаємо ширину кнопки в полі "Width", в полі “Композиція” вибираємо вигляд кнопки, а в пункті “Тип дії” вказуємо тип - “Подобається”, або “Поширити”. Знімаємо галочку навпроти пункту Включити кнопку «Поділитися», або ж, при потребі, залишаємо.

3. Копіюємо і вставляємо код кнопки.

Після всіх маніпуляцій натискаємо кнопку “Отримати код”, щоб згенерувати код для нашої сторінки (сайту).

Нам запропонують два кусочки коду. Один потрібно скопіювати і вставити на початку сторінки між тегами , а інший в тому місці, де має бути сама кнопка. Все дуже просто.

До речі, серед усіх кнопок соціальних мереж, кнопка від Facebook завантажується найдовше.

Кнопка "Мені подобається" від "Вконтакті"

Процедура додавання кнопки “Мені подобається” дуже схожа, але має свої незначні відмінності. Для початку переходимо сюди.

В налаштуваннях вказуємо поля: сайт, назву сайту і адресу. Основний домен система визначить автоматично. Натискаємо кнопку "Зберегти" (перед цим потрібно авторизуватися "Вконтакті").

Навпроти пункту “Варіант кнопки” обираємо варіант відображення кнопки: з мініатюрним лічильником, з текстовим лічильником, у вигляді кнопки, чи у вигляді кнопки з лічильником зверху. Мені найбільше подобається перший варіант.

Також можна ще задати "Висоту кнопки" (в пікселях) і "Назву кнопки" (пропонують два варіанти - "Мені подобається" і "Це цікаво").

"Код для вставки" розбитий на два пункти. Все точно так само, як і у випадку з Фейсбук. Першу частину коду вставляємо між тегами , іншу — безпосередньо в потрібне місце розташування самої кнопки.

Кнопка "Клас" від мережі "Однокласники"

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

Налаштовуємо вигляд кнопки. Вставляємо URL-адресу вашого сайту (якщо потрібно), вибираємо розмір по висоті, вигляд кнопки, місце відображення лічильника (зверху, справа) і текст на кнопці (“Клас”, “Поділитись”, “Подобається”).

Система згенерує код, який треба вставити у потрібне місце сайту. На відміну від "Фейсбук" і "Вконтакті", тут код не розбитий на дві частини.

Кнопка "Твіт" від Twitter

У Твіттера немає кнопки “Лайк”, чи “Клас”, зате є кнопка “Твіт”, натиснувши на яку, можна поділитися лінком. При потребі її також можна вставити на сайт. Заходимо сюди і обираємо пункт "Share a link". Здійснюємо потрібні налаштування і вставляємо код у потрібне місце сайту.

Кнопка "+1" від Google+

Соціальна мережа Google+ у нас не дуже популярна. Але вставити кнопочку ви можете завжди. Для цього переходимо на сайт розробників Google.

Здійснюємо візуальне налаштування кнопки +1. Далі згенерований код вставляємо на сайт. Як і у випадку з "Фейсбук" і "Вконтакті", тут дві частинки коду. Один між тегами , другий — в місце відображення самої кнопки від Google+.

Висновок

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

Лінки по темі:

Блок "Поділитися" від Яндекса Сервіс Pluso Сервіс Share42.com Кнопка "Like" від Facebook Кнопка "Like" від Вконтакті Кнопка "Клас" від "Однокласники" Кнопка "Твіт" від Twitter Кнопка "+1" від Google+

Читайте також:

Як вставити пошук від Google на сайт Як встановити лічильник відвідуваності LiveInternet на сайт Як додати візитку з Facebook на сайт


14.06.2016 | 193 | Коментарі (0)

Поділитись

Сторінки


Найпопулярніше (Top-10)
Лічильники
(c) Всі права застережено, 2017