Сайтофобия – Социализация сайта [готовимся к новой рубрике]

Многие имеют что сказать, умеют что-то делать и могут наполнять интернет полезным и интересным контентом. Но все ли могут создать хорошую площадку для этого контента? Наша новая рубрика “Сайтофобия” создана специально для того, чтобы сделать создание сайта и его поддержку максимально понятными для всех. Разумеется, здесь вы не узнаете всего, но сможете разобраться во многом! Сегодня говорим про социальную составляющую сайта.

Если вы находитесь на пути создания собственного сайта, то эта статья ой-ой-ой как вам будет полезна. Здесь я расскажу вам о социализации сайта – чуть ли не самом важном пункте на вашем пути. Что это вообще такое? Как запилить это себе на сайт? Узнаете из этой статьи.

Я просто уверен, что вы видели на различных сайтах виджеты с кнопочками “Мне нравится”, “Like”, комментариями, синхронизированными с различными соц. сетями и многими другими. Конечно же, это для того, чтобы упростить и сделать более удобным пользование сайтом, ведь чем удобней сайт, тем больше людей заходят на него. Иначе, это инструменты повышающие популярность сайта.  Естественно, чтобы пользоваться этими инструментами, вам понадобятся хоть какие-нибудь, минимальные знания HTML, при создании своего сайта, без них никуда.

Вконтактик

Компания “Вконтакте” предоставила много виджетов для сайтов, но для их использования, первым делом, вы должны синхронизировать свой сайт с системой Open API, она позволяет авторизировать на вашем сайте пользователей данной соц. сети.

Для того, чтобы подключить ваш сайт к Open API нужно:

1. Создать обычное приложение, для этого нужно зайти на страницу создания приложений (логично!), вот сюда, ввести название приложения, тип (выбрать веб-сайт), адрес сайта и базовый домен (пример на картинке).

Далее нужно подтвердить кодом, который придет вам на телефон, что вы человек, а не бот.

2. Обязательно запомните ID вашего приложения, он вам пригодится в будущем.

3. Нужно провести инициализацию, для этого пропишите у себя на сайте вот такой вот код:

<script src=”http://vkontakte.ru/js/api/openapi.js” type=”text/javascript”></script>

<script type=”text/javascript”>

  VK.init({

    apiId: ТУТ ID ВАШЕГО ПРИЛОЖЕНИЯ

  });

</script>

Все, теперь вы можете спокойно добавлять все виджеты “вконтакта”.

Как я уже говорил, “Вконтакте” дает нам очень много виджетов, а также помогает построить для себя нужный. У каждого виджета есть свой строитель, с кодом и примером самого виджета. (На картинке один из так называемых строителей).

Вот все виджеты (внутри конструкторы к ним):

• Комментарии
• Сообщества
• «Мне нравится»
• Рекомендации
• Опросы
• Авторизация
• Подписаться на автора

Твиттерок

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

На этот раз, нам не придется синхронизировать сайт, мы просто вставляем код.

(На картинках примерные настройки и один из виджетов)

И вот все виджеты которые предлагает нам Твиттер:

• «Профиль»
• «Поиск»
• «Избранное»
• «Список»

Фейсбучек

В “Facebook” с социализацией сторонних сайтов все реализовано подобно “вконтакту”. Ой, нет, что же я, наоборот конечно!

Для начала пользования инструментами социализации, синхронизируйте свой сайт с системой Graph API, для этого потребуется:

1. Создать приложение, после создания запомнить его ID

2. Далее вписываем этот код на свой сайт:

<div id=”fb-root”></div>

<script>(function(d, s, id) {

  var js, fjs = d.getElementsByTagName(s)[0];

  if (d.getElementById(id)) return;

  js = d.createElement(s); js.id = id;

  js.src = “//connect.facebook.net/ru_RU/all.js#xfbml=1&appId=СЮДА ВСТАВЛЯЙТЕ ID ПРИЛОЖЕНИЯ“;

  fjs.parentNode.insertBefore(js, fjs);

}(document, ‘script’, ‘facebook-jssdk’));</script>

Теперь ваш сайт готов к использованию виджетов “фейсбука”, ну а виджетов, по сравнению с “Вконтакте”, большое количество.

Также, вы можете их собственноручно конструировать.

Можно использовать такие виджеты, как:

• Like Button
• Send Button
• Subscribe Button
• Comments
• Activity Feed
• Recommendations
• Like Box
• Login Button
• Registration
• Facepile
• Live Stream

Хочу заметить, что следует добавлять на сайт виджеты всех соц. сетей.

Вот и все, надеюсь вы поняли, что такое социализация сайта и как это использовать.

 Статью подготовил кеддровик Георгий Ткачук, за что ему огромное спасибо!

Серия статей “Сайтофобия” будет выходить при поддержке нашего партнера – компании Hostpro.