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

17

Від автора: вітаю вас. Сьогодні соціальні мережі розвинулися до такого рівня, що в них зареєстровано в загальній складності понад 3 млрд людей. Потенційно це дуже потужна аудиторія, тому сьогодні я вам розповім, як додати кнопки соціальних мереж на сайт.

Додати сайт на WordPress

Почну з того, що самим простим способом, якщо у вас WordPress, є просто встановити який-небудь плагін для цієї справи. Який? Я, наприклад, користувався Juiz Social Post Sharer. А взагалі, просто введіть у пошуку плагінів слово social і перегляньте, що там є. Перевага тут тільки в тому, що вам, ймовірно, не доведеться нічого налаштовувати.

Блок «Поділитися» від Яндекса

Яндекс теж розробив сторінку, на якій ви можете налаштувати і поставити собі кнопки. На цій сторінці ви можете вибрати потрібні сервіси (а їх приблизно 25). Праворуч ви можете вибрати зовнішній вигляд блоку. Це можуть бути лічильники, які будуть показувати, скільки разів на кнопки натиснули користувачі. Це, в свою чергу, допоможе вам відстежувати, чи корисний матеріал читачам.

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

Тут же вам буде показаний код, який потрібно скопіювати і вставити в те місце на сайті, де ви хочете їх бачити. Значить, саме час визначити це місце! Найчастіше блок «Поділитися» ставлять: На початку статті; В кінці статті; Збоку.

Природно, не потрібно використовувати всі три варіанти, краще якийсь один. Хоча я бачив сайти, де блок був і на початку, і у кінці сторінки.

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

Редагувати файли сайти можна деякими способами. Наприклад, зробити це безпосередньо через адмінку движка (зовнішній вигляд — редактор). У цьому випадку код не підсвічується, тому орієнтувати в ньому не так зручно. Інший спосіб – через ftp. Підключіться до сайту за допомогою ftp-клієнта, перейдіть в wp-content – themes. Тут потрібно знайти той шаблон, який є активним у вас в даний момент. Заходимо в нього і знаходимо той самий single.php або шукаємо щось схоже за назвою.

В самому файлі з кодом знайдіть рядок the_content за допомогою пошуку (Ctrl + F). Вставте де-небудь після неї цей код.

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

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

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

Кнопки від Pluso

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

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

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

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

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

Ще один варіант – Share42

Якщо попередні варіанти вам чимось не сподобалися, є інший спосіб, як поставити кнопки соціальних мереж на сайт. Це сервіс share42.com. Названий так, напевно, тому, що на момент створення в ньому було 42 кнопки соціальних сервісів, хоча на даний момент їх 43.

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

Іконки, які вам потрібно, потрібно вибрати, клацнувши по них мишкою. Окремо хочу відзначити наявність таких цікавих можливостей, як додавання в обране браузера, посилання на rss і кнопка «Вгору».

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

Далі ви можете вибрати тип панелі: горизонтальна або вертикальна? І якщо вибрана друга, то кількість кнопок можна обмежити. Кодування я рекомендую залишити UTF-8. Ви можете також додати іконку самого сервісу в комплект кнопок, щоб користувачі з вашої сторінки могли перейти на нього і встановити собі теж ці кнопки.

Також якщо ви плануєте додати іконку rss, то обов’язково потрібно вказати адресу вашого фіда, а якщо хочете показувати кількість натискань по кнопках, повинні бути відзначені дві останні галочки.

Нижче є 2 кнопки. Перша дозволяє поглянути, як будуть виглядати соціальні кнопки, які ви настроїли. За допомогою другої скачується скрипт. Його потрібно завантажити через ftp до себе на сайт в кореневу папку.

Наступним кроком вкажіть на сторінці сервісу шлях до цієї папки. Часто достатньо замінити site.com на ваше доменне ім’я. Все, залишається вставити код, вибравши перед цим cms, на якій працює ресурс. Куди вставляти код ви вже повинні розуміти, я сподіваюся.

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

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