Використовуємо соцмережі

3349
  • Настройка кнопок для показу на мобільних телефонах
  • Що змінилося в блоці «Поділитися» від Uptolike
  • Встановлення кнопок і плагінів для WordPress і Joomla
  • Робота зі статистикою в АпТуЛайке
  • Інші можливості сервісу Uptolike
  • Підводимо риску
  • Здрастуйте, шановні читачі блогу . На тлі жорсткості пошукових систем по відношенню до посилальних систем просування (нещодавнє введення Мінусинська в Яндексі і вже давня робота Пінгвіна в Гуглі) стає актуальним використовувати інші методи просування, які знаходяться зазвичай дещо в тіні на тлі закупівлі посилань. Це і поліпшення юзабіліті (поведінкових чинників), і створення думки про сайті і бізнесі в інтернеті (крауд-маркетинг), і робота з соціальними мережами.

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

    Використовуємо соцмережі

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

    Приємним моментом стало те, що безкоштовний конструктор соціальних модулів для сайтів Uptolike, яким я користуюся останні півтора року на всіх моїх проектах, викотив чергове оновлення, де кнопки для мобільних пристроїв будуть відображатися так, що їх не можливо не помітити, і ймовірність їх використання сильно підвищується. Все це справа дуже гнучко настроюється, з’явилися плагіни для WordPress і Joomla, так і купа інших оновлень АпТуЛайке сталася, тому я і вирішив присвятити цій справі ще один пост.

    Настройка кнопок для показу на мобільних телефонах

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

    Мобильные кнопки от UptolikeВикористовуємо соцмережі

    Однак, мене в коментарях поправили, що цю панель з кнопками расширанивания в соціальні мережі створює встановлений у мене на сайті скрипт від Uptolike. Нещодавно я знайшов час, щоб детальніше з цим ознайомитися, і виявилося, що це нововведення з’явилося в АпТуЛайке зовсім недавно, і вміст цієї мобільної панелі можна налаштувати окремо від кнопок (аж до відключення), які будуть показуватись на сайті при перегляді його на великих екранах.

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

    Тому і рекламу для мобільних користувачів роблять окрему, а ось тепер АпТуЛайк і панель з кнопками адаптував під «інфантильних» мобільних користувачів. За статистикою сервісу (клієнти мають доступ до неї), розшарювання стало значно більше, але в цьому може бути і частка більш дружнього для мобільних користувачів дизайну сайту.

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

    У блоці «Поділитися» (його ви побачите, трохи прокрутивши вниз головну сторінку АпТуЛайка) з’явилася можливість налаштування кнопок для мобільних сайтів від Uptolike, а так само додалася можливість ділитися посиланнями в месенджерах Вацап і 4talk.

    Адаптация кнопок Uptolike под мобильные устройстваВикористовуємо соцмережі

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

    Особливо багато кнопок робити видимими (ставлячи галочки навпроти них) я не став, бо вони зменшуються при цьому в розмірах і по ним складніше стає клікнути. Також зверніть увагу, що в мобільному блоці від Uptolike з’явилася можливість додати кнопку WhatsApp, який є одним з найпопулярніших в світі мобільних сервісів (мало не мільярд користувачів їм користуються, а зараз ще з’явився вацап для комп’ютера). Ще є кнопка набирає популярність месенджера 4talk, але вона присутня і в основному наборі, який відображається на великих екранах.

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

    Uptolike на экране мобильного телефонаВикористовуємо соцмережі

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

    На даний момент налаштувати розташування цього блоку на екрані мобільного телефону поки що немає можливості, так само як і не вдасться поміняти зовнішній вид кнопочок, які будуть бачити мобільні відвідувачі. Можливо, що надалі ці налаштування з’являться (Uptolike дуже активно реагують на висловлюються побажання користувачів і постійно щось допрацьовують і доводять до розуму).

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

    Кнопки соцсетей на телефонеВикористовуємо соцмережі

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

    Що змінилося в блоці «Поділитися» конструктора Uptolike

    Крім цього в Uptolike виявилося дуже багато нововведень і доопрацювань, які були зроблені приблизно за рік з того часу, як я опублікував огляд цього конструктора соціальних кнопок. Мені здалося, що оновлювати той пост вже не має сенсу і простіше буде написати новий з описом того, що з’явилося нового (наприклад, плагіни для Joomla та WordPress, скрипти голосування, лайків, підписки, опитувань, соціальної авторизації, розшарювання картинок і ін).

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

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

    Тепер повернемося до кнопок соціальних мереж відображаються на мобільних телефонах. Їх вміст і зовнішній вигляд налаштовується в основному блоці сервісу під назвою «Поділитися» (його ви побачите, трохи прокрутивши вниз головну сторінку АпТуЛайка).

    Використовуємо соцмережі

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

    Зверніть увагу, що ми поки говоримо про налаштування кнопок, які будуть відображатися на сайті при його перегляді з великих екранів (комп, ноут, планшет, який не зрозуміло для чого потрібен). До речі, цей блок стоїть у мене на блозі вже дуже давно і навіть я сам його використовую при публікації нових постів, щоб по-швидкому провести його расшаріваніє у своїх соціалках. Там присутні і деякі безкоштовні блог-платформи (Живий журнал, Лайвинтернет, Блогер від Гугла, Tumblr), посилання з яких враховуються пошуковими системами, так і реферальний трафік з них йде (він розбавляє пошуковий трафік, що є добре). Загалом дуже зручно, на мій погляд.

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

    Цитирование в UptolikeВикористовуємо соцмережі

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

    Все це справа (поки я расматриваю кнопки Uptolike для великих екранів) дуже тонко можна налаштувати (без перебільшень). Є можливість вибрати тип блоку — плаваючий (приклеєний до однієї з чотирьох сторін екрану комп’ютера) або стаціонарний (у вигляді горизонтальної чи вертикальної лінійки). Можна вибрати вигляд кнопок з десятка запропонованих варіантів, їх розмір і навіть поведінка при підведенні курсору миші (обертання або збільшення розміру).

    Настройка кнопок в UptolikeВикористовуємо соцмережі

    Останнє мені дуже сподобалося в плагіні Easy Social Share Buttons, але він платний (і до того ж моторошно вантажить сервер), а тут всю цю красу пропонує безкоштовний сервіс, який використовує для подгрзки скрипта асинхронний код не уповільнює швидкість завантаження сторінок сайту. Що є гуд в наш час, коли швидкість завантаження сайту стала одним з факторів ранжирування сайтів в Яндексі і Гуглі.

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

    Получить код в АпТуЛайкВикористовуємо соцмережі

    Правда, якщо ви ще не були зареєстровані в Uptolike, то вам запропонують це зробити (ввести свій Емайл і Урл сайту, де плануєте розміщувати код). Реєстрація не є дозвільними процедурою, бо в сервісі є можливість переглядати детальну статистику по роботі блоку з кнопочками, доступ до якої буде тільки у вас.

    Встановлення кнопок соцмереж і плагінів для WordPress і Joomla

    Код буде виглядати приблизно так:

    (function(w,doc) {
    if (!w.__utlWdgt ) {
    w.__utlWdgt = true;
    var d = doc, s = d.createElement(‘script’), g = ‘getElementsByTagName’;
    s.type = ‘text/javascript’; s.charset=’UTF-8′; s.async = true;
    s.src = (‘https:’ == w.location.protocol ? ‘https’ : ‘http’) + ‘://w.uptolike.com/widgets/v1/uptolike.js’;
    var h=d[g](‘body’)[0];
    h.appendChild(s);
    }})(window,document);

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

    Особисто у мене в даний момент на сторінках статей розміщено відразу два блоки від АпТуЛайк — під заголовком і під текстом статті. У цьому випадку код скрипта (разом з тегами script) я розміщував перед закриваючим тегом Body тільки один раз, а от два блоки Div вставив в тих місцях файлу SINGLE.PHP (з папки з вашою темою оформлення), де кнопочки социално мереж повинні виводитися. Детальніше про установку коду Uptolike читайте в попередньому огляді цього сервісу.

    Якщо вас метушня з кодом не приваблює чинності не дуже хорошого знайомства з пристроєм шаблону вашого сайту, то ви можете скористатися вже готовим плагіном Uptolike для WordPress або Joomla. Завантажити їх можна буде в самому низу головної сторінки сервісу:

    Скачать плагина АпТуЛайк для WordPress и JoomlaВикористовуємо соцмережі

    C плагіном для Joomla мені попрацювати поки що не довелося, а от плагін для Вордпреса під назвою Uptolike Share Buttons я не тільки протестував, але і описав його у пості, який ви знайдете за наведеним посиланням. Налаштування блоку з кнопками соціальних мереж в ньому проходять як на сторінці онлайн-сервісу, а ось код ніякої вручну вставляти не доведеться — просто вкажіть плагіну, де повинні відображатися кнопочки і все. Для початківців вебмайстрів саме те.

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

    Робота зі статистикою в АпТуЛайке

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

    Взагалі, якщо вже мова зайшла про статистику, то хочу показати їх зведений графік розшарювання в соцсервисы за підсумками минулого року кількість скачувань плагінів для WordPress і Joomla (всього в систему зараз додані близько двохсот тисяч сайтів):

    Статистика UptolikeВикористовуємо соцмережі

    Joomla програє, але, можливо, це через те, що плагін для WordPress з’явився раніше. Однак, повернемося до наших баранів. Ми хотіли статистику расшраиваний подивитися. Для цього достатньо буде просто авторизуватися на сайті, клацнувши по кнопці «Мій Uptolike» у правому верхньому куті. З’явиться форма для авторизації (можна і свої акаунти в соцсетах використовувати для входу — до речі, трохи нижче ми поговоримо про спеціальний блок соціальної авторизації від АпТуЛайка).

    Вход в АпТуЛайкВикористовуємо соцмережі

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

    Статистика социальной активности в АпТуЛайкВикористовуємо соцмережі

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

    Інші можливості сервісу Uptolike

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

    Другие возможности АптулайкаВикористовуємо соцмережі

    Про плагіни для WordPress і Joomla ми з вами вже говорили, тому їх опустимо і подивимося на інші інструменти:

  • Лайки — в цьому конструкторі ви можете додати на свій сайт блок зі стандартними кнопками для лайків від таких соціальних мереж, як Facebook, Вконтакте, Google+, Однокласники і Майлу.ру. В принципі, те ж саме ви могли б зробити отримавши код офіційних кнопок, але з цим потрібно возитися, налаштовувати, вирівнювати на сторінці, а тут все в готовому вигляді. Налаштувань не так багато, як у кнопок для розшарювання, але можливість вибрати стаціонарний або плаваючий блок є. В кінці генеруєте код і вставляєте його в потрібне місце на сайті.
  • Підписатися (Follow) — думаю, що цей конструктор теж особливих питань не викличе. Він дозволяє швиденько створити блок з кнопками, провідними на ваші сторінки або групи в соцмережах. Я, до речі, нещодавно писав, як це можна зробити самому (див. по наведеній посиланням), ну, а тут знову ж все значно простіше і наочніше. Соцмереж і можливих налаштувань тут буде трохи побільше, ніж у розглянутому раніше інструменті «Лайки». Думаю, що онлайн-комерсантам особливо не буде зайвим наростити свою цільову аудиторію в соціалках таким ось способом.
  • Поділитися картинкою — на мій погляд, має сенс використовувати цю можливість для соціальних мереж з ухилом в картинки. Це насамперед Пинтерест і Пинми, про яких я в свій час досить докладно писав. Після установки коду відвідувач, підводячи курсор миші на зображенні, побачить, що з’явилися на ній іконки вибраних соцмереж, в яких він зможе поділитися цією картинкою. Знову ж чудова можливість для інтернет-магазинів, чиї товари просунуті відвідувачі люблять-таки додавати в PinTerest і PinMe.
  • Опитування — конструктор опитувань з досить великою кількістю налаштувань. Не так давно я писав про створення інтернет-опитування з допомогою Гугл Форм. Тут виходить щось схоже, але з великими можливостями по розміщенню. Варіантів використання морі, в тому числі і на комерційних сайтах.
  • Рейтинг статей — досить цікавий конструктор голосувалки виду «Подобається/Не подобається». Щось схоже досить часто зустрічається на сайтах і дозволяє зрозуміти власникам уподобання цільової аудиторії. Думаю, що для комерційного сайту (наприклад, для карток товару інтернет-магазину) цей інструмент також можна спробувати застосувати.
  • Соціальна авторизація — даний інструмент винесено на окремий сайт, який може бути дуже актуальним для тих, хто використовує реєстрацію на своїх проектах. Багатьом відвідувачам (включаючи, наприклад, мене) простіше увійти за допомогою свого аккаунта в соціальних мережах (Google, Яндекс, Mail.ru, ВКонтакте, Facebook та ін), ніж вказувати Емайл, придумувати логін і так далі. Для початку роботи просто виберіть потрібний вигляд кнопок соціальної авторизації, зробіть налаштування та отримайте код для установки на сайт.
  • Підводимо риску

    Багато нового і цікавого для себе виявив у АпТуЛайке. Особливо порадували адаптовані під мобільні пристрої кнопки розшарювання в соціальних сервісах. Чисто візуально сподобалися деякі нові види кнопок і їх поведінка при підведенні курсору миші (під даною статтею якраз оновлений блок стоїть, так і у верхній блок я додав ефект обертання іконок, що досить прикольно виглядає, на мій погляд).

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

    Удачі вам! До зустрічей на сторінках блогу