кнопка Вконтакте

Кнопка Вконтакте. Як встановити кнопку на сайт "Мені подобається" на Wordpress.

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

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

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

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

картинка 1

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

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

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

картинка 2

реєстрації номер вашого телефону, то обов'язково зробіть це. Дивіться в налаштуваннях профілю. І так, вставили отриманий код, натиснули "відправити". Через пару секунд спливе ось таке віконце (дивіться третю картинку).

картинка 3

Заповнюємо поля в ній. У самому верху, де назва, які ви вже зробили і опис, нічого можете не робити. Звертаємо увагу тільки на "Захищений ключ", скопіювавши ви можете вставити наприклад в корисний плагін кнопок для сайту Share Buttons, якщо він у вас є. А також трохи уваги на "ID додатки", запам'ятовувати і копіювати це не треба, просто я до того, що саме цей номер і буде визначальним для вашої кнопки, саме для вашого сайту. На зображенні ці поля виділені жовтим.

картинка 4

Тепер найголовніше про те, як вставити кнопку на сайт.

Внизу вікна бачимо Open API (виділено червоним), в поле "Адреса сайту" вставляємо вашу адресу. Зверніть увагу, як виглядає адреса: http://nachnivsesnachalo.ru - неправильно, http://nachnivsesnachalo.ru/- правильно. Вся відмінність в значку "/" в кінці назви. В поле "Базовий домен" вставляємо ваш домен, як приклад, - nachnivsesnachalo.ru, без http: //. Зберігаємо налаштування. Приклад на зображенні 4

Налагодження та вставка кнопки на сайт

Всі необхідні дані зареєстровані, тепер заходимо на сторінку "Підключення віджета до Вашого сайту" . В панелі Сайт / додаток, вже буде вказана адреса вашого сайту, або натисніть стрілку на проти (праворуч) і виберіть в ручну. Далі вибираємо із запропонованого дизайн кнопки. Це по своєму смаку. Я вибрав перший варіант "Кнопка з текстовим лічильником". "Висота кнопки" - я не чіпав, і назва за вашим бажанням "Мені подобається" або "Це цікаво". Нижче бачимо сам код кнопки, код складається з двох частин, і вставлятися буде теж в двох місцях. Відразу зауважу. робіть резервну копію незайманого документа, в які будемо вставляти код, про всяк випадок.

картинка 5

Перша частина коду, - (не копіюйте у мене-це приклад)

<Script type = "text / javascript" src = "http://userapi.com/js/api/openapi.js?45"> </ script> <script type = "text / javascript"> VK.init ({ apiId: 2638339, onlyWidgets: true}); </ Script>

картинка 6

Тепер, скопіювавши вставляємо на сайт. Дивимося картинку 6, яка зображує панель інструментів, (колонка зліва). Знаходимо "Дизайн" і в ньому меню "Редактор". Це редактор налаштувань вашої теми. Дивимося в правій колонці і знаходимо "Тема", файл називається (header.php). Відкриваємо його і бачимо наступне вікно (дивіться картинку). Документ виглядає у вигляді набору символів і значків, але не лякайтеся, розбиратися у всьому вам не треба, просто зробіть те, що я напишу.

картинка 7

І так, спочатку відразу скажу, першу частину коду будемо вставляти між ось цих тегів .. <head> (відкриває) </ head> (закриває). Один з цих тегів буде в верху, другий, тільки із позначкою "/" внизу документа. Між ними будуть інші символи. але не звертаємо на це уваги, зараз головне правильно вставити нашу першу частину коду. Вся увага на нижній тег </ head>, не поспішаючи переглядаємо документ і внизу знаходимо цей символ (тег буде окремо в рядку). Я підкреслив його червоним на зображенні 7. Зеленим- вставлену частина коду.

Скопійоване частина коду вставляємо вище цього тега </ head>. Простіше це зробити так, піднімаємося трохи вище </ head>, натискаємо "ентер" і отримуємо "пробіл". Тепер вставляємо частина коду. "Пропуск" для того, що б вам потім було легше знайти цю "частину коду", якщо ви захочете видалити, або внести якісь зміни.

Далі, йдемо назад на сторінку даного вам коду. Спускаємося нижче (дивимося картинку 8). Знову пропускаємо (копіюємо) <! ​​- Put this div tag to the place, where the Like block will be -> а тільки саму частину коду. Виглядає так:

картинка 8

Друга частина коду:

<Div id = "vk_like"> </ div> <script type = "text / javascript"> VK.Widgets.Like ( "vk_like", {type: "full"}); </ Script>

Заходимо знову в "панель інструментів". Знаходимо "Дизайн", далі натискаємо "Редактор" (як я вже писав) і у вікні, (у правій

картинка 9

колонці) находім- Одиночна запис (single.php). Відкриється документ. В якому, вам потрібно буде знайти тег- <? Php the_content (); ?> Так він виглядає в документі. Дивіться на картинку 9, обведений червоним. Скопійоване другу частину коду (обведений зеленим) вставляємо після цього тега, краще через "пробіл", як я описав вище, що б потім можна було його легше знайти і відрізнити. Чому саме в цьому місці? Можна звичайно поексперементувати і вставити в інші місця. Але краще якщо ваша кнопочка буде внизу вашої статті, а не де-небудь зверху. Все, кнопка встановлена, - пізніше розповім як встановити кнопки від Facebook і Mail.ru. Для початку сам вставлю .. Удачи!

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

Шановні читачі якщо стаття виявилася для вас корисною, клікніть по кнопці "Мені подобається".

Статті які можуть бути вам корисні:

1. Як перевірити сайт на віруси
2. Як створити сайт або Блогінг від А до Я в Трініті
3. Який найкращий файлообмінник або файлообмінник GetFiles небезпечно.