Наверх
52 комментария 08/05/2012

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

как создать свой блог

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

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

Я просто уверен, что вы видели на различных сайтах виджеты с кнопочками “Мне нравится”, “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>

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

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

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

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

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

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

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

Если вы нашли ошибку, пожалуйста, выделите фрагмент текста и нажмите Ctrl+Enter.

52 комментария

по хронологии
по рейтингу сначала новые по хронологии
1

зачетная рубрика! появился еще один повод почаще заглядывать на Keddr))

очень бы хотелось почитать по-больше про СЕО и раскрутку в целом в следующих статьях от знающих людей!

2

Не ожидал на этом сайте увидеть уроки по сайтооформлению :) хотя для себя много нового не узнал , я как раз этим занимаюсь для сайта одного клуба , но все равно спасибо за статью

3

Очень интересно! Спасибо за статью! Было бы интересно почитать, что нибудь из этой темы ещё.

4

Бесполезная рубрика с точки зрения потенциальных клиентов хостпро. Кто имеет свой сайт, знает эту информацию и так, а кто соберётся делать - найдёт в гугле гораздо более полную и развёрнутую информацию.

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

На правах IMHO.

5

@Алексей Коляда, Лалала..!!! Ручки ножки огуречит, получился человечек :D

Хватит мусолить тему, тошнит Р:

6

@Алексей Коляда, 100% согласен, мне даже кажется что эта рубрика перебор...

7

@Eduard, перебор, но деньги от партнёра приносит, значит, быть ей. И коли быть, то пускай качественно.

8

@Алексей Коляда, мне кажется ты слишком умен для интернета. Денег не приносит, если тебе это интересно. А в гугл ходить, так и кеддр начинать не нужно было. Но к качественному материалу мы очень стремимся, особенно который устроил бы Алексея Коляду ;)

п.с. суть как раз не в самом ПОЛНОМ и РАЗВЕРНУТОМ материале, а в "коротко и ясно"

9

@Кременюк Семён, спасибо за комментарий :)
Это же не недовольство, а желание сделать сайт лучше :)
Всё отлично!
Но, может, всё-таки последовательно выкладывать? То есть, сайта ещё нет, а социальные виджеты уже прикручиваем ;)

10

@Алексей Коляда, Тут соглашусь, но у нас еще автора постоянного нет и мы дали специальные темы нескольким желающим, чтобы понять, кто на что способен.

11
Михаил Пинчуков

@Александр Ляпота, а когда будет ответ на эти статьи уже почти неделю как отправил, просто интересно способен я или нет)

12

@Александр Ляпота, спасибо за пояснение :)

13
Andrew LazyHero

@Алексей Коляда, Чувак, тебе надо быть автором этой рубрики!

14

@Andrew LazyHero, Полностью поддерживаю:)

15

@Andrew LazyHero, уверен, уже найдены те, кто разбирается в этом лучше меня :)

16
Andrew LazyHero

@Алексей Коляда, та ничего подобного. Цитирую Сашу: "у нас еще автора постоянного нет и мы дали специальные темы нескольким желающим". Для меня ты шаришь хорошо. Думаю достаточно людей найдется таких как я, то что я зависаю на сайте гиков, не говорит о том, что я реально во всем этом разбираюсь.

17

@Andrew LazyHero, я подумаю, но эта тема в принципе очень негибкая. Подобного рода инструкции не универсальны и очень быстро теряют свою актуальность, частично или полностью.
Поддерживать актуальность таких инструкций сложно и сложность прямо пропорциональна универсальности инструкций и их количеству.

18

По оформлению - картинки сильно растянуты, поставьте оригинальный размер, пожалуйста.

19
Александр Тяпкин

Пройденный этап

20
Slava Ukraine

Рубрика я так понял для дела нужна, тогда пусть будет ;)

21

1. по рубрике +
2. по теме: сейчас мало кто пишет сайты на чистом штымыле, пхп или там рубби. 99% используют готовые СУС. Практически во всех популярных СУС есть плагины, модули (ну или где как называется) которые добаляют кнопочки шаринга в десятки сетей, твитлены или авторизацию на сайте через соцсети, как говорят - в 2 клика.
Кстати, про авторизацию я понял только недавно, как удобно не регаться на сайтах, а просто заходить своим аком в соцсетях. Подумываю в корне переписать пару сайтов.
Ну и на правах ИМХО сервис http://loginza.ru/ для этого (который помоему недавно яндекс купил)

22
@loginov_zhenya

@Михаил, категорически не соглашусь! хтмл вообще язык разметки, а не программирования. пхп и руби предназначены для написание веб-приложений. Жаль, что многие не понимают разницу между сайтом и приложением. для сайтов-визиток/портфолио/блог вполне подойдет готовый движок, для написания веб-приложения нужен как раз тот же пхп, руби, ява, питон и тд.

23

Креативно, позитивно - почему бы и нет? Может для кого-то это как раз и будет первым толчком к созданию чего-то своего.

24

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

25

Ребята, рискуете себе конкурентов создать ;)

26

@Koluchiy, опа точно! А еще прикол, что тут будут иногда описаны темы, которые и нам не помешало бы применить... ))) но всё для вас ))) всё для читателей )))

27

@Кременюк Семён, благодарим великодушно))

28

НЕ написали самого главного. О том как же все таки добавлять думаю можно и самому розобратся. Но не написали что и куда лепить, как и где все размещать. Если я поставлю себе на сайт ряд кнопок "поделится с друзьями" размерностью больше чем шапка сайта. То это будет не правильно.

29
Георгий Ткачук

@MediaPortal, я думаю, что размещение виджетов на сайте, дело для всех индивидуальное.
Да и какой смысл писать "этот разместите слева, а этот снизу".

30
@loginov_zhenya

@keddr Если по сути, то думаю рубрика не приживется ввиду ее неактуальности. Да простят меня ув. @Кременюк Семён и @Александр Ляпота.
Думаю, что эту статью найдет полезным тот человек, который написал (в свое удовольствие)себе блог и теперь хочет "прикрутить" туда что-то типа "мне нравится" от ВК, "like" от fb и так далее.
Суть в том, что кто занимается созданием и разработкой веб-приложений делают это с помощью готовых решений(библиотек). Не спорю, будут пользователи, кто найдет что-то полезное.
Есть предложение сделать голосование по поводу актуальности данной рубрики.

31
@loginov_zhenya

И еще, чтобы меня не сочли совсем уже критиканом, советую посмотреть в другую сторону. Насколько помню, в одном из ВЛОГов, вроде бы, Саша упоминал об автомобильной тематике. Думаю, это было бы лучшей темой для новой рубрики.
Говорить, что кому нужно что-то сделать(например прикрутить кнопки ВК на свой сайт), тот сам найдет как это сделать и не будет сюда ходить - не буду! Но все таки тема веб-разработки уж очень краеугольная.

32

@@loginov_zhenya, да и для автомобилей нужна не отдельная рубрика, а целый сайт ;)

33

@Алексей Коляда, согласен, вообщем-то для любой тематики нужен отдельный ресурс :) Но если появилась идея создать новую рубрику, думаю, все, что касается веб-разработки - неудачный выбор.

35

Отличная рубрика!!!!!!! Буду следить за ее обновлением!!!

36

ИМХО на КЕДДРе "Сайтофобия" уместна только лишь в формате уже знакомой нам "Домашней рубрики". Ну т.е. вы рассказывали бы что нового на сайте появилось с технической точки зрения. Это было бы интересно. Постоянные читатели могли бы давать советы и чувствовать себя причастными к развитию кедра.

P.S. Ребят, ну я вас умоляю прикрутите нормальные комментарии. Хотябы дискус. Вот вам и тема для следующего поста. "Какой сервис комментирования лучше поставить на свой сайт. Наш опыт внедрения ***"

37

@shaQ, дискус, я так понял, прикрутить не могут из-за модераторских прав. То есть писателям статей можно модерировать и удалять комментарии, а в дискусе все работает только от админа. А прикручивать фейсбук или вк комменты — странно, только потому, что не все пользуются обеими соцсетями, чтобы выбирать. Просто нужно доработать движок комментов, это лучший вариант. И внедрить систему минусов-плюсов, чтобы отсеивать матерщину без особых усилий.

38

@mrVeles, не в этом дело! Как-то мы пробовали на кеддре дискус в самом начале... уж слишком это отдельная тема, мы привыкли как-то всё в своем огороде крутить... а тут целый самосвал прикрутить надо и его рулить отдельно! Но думаю к теме вернемся, слишком много толковых сайтов используют этот движек!

39

@mrVeles, ничего писатели уже давно не могут :)

40

Почему-то мне тоже кажется, что эта рубрика на Кеддре неуместна. Для таких тем есть хабр, можно публиковать статьи там, я думаю, их оценят. А тут сайт посвященной технике и гиковским штучкам, но никак не сайтостроению. Странно это все.

41

@mrVeles, сайт Кеддр.ком он как мобильный телефон. Тоесть, изначально создавался для одного, но по-ходу развития появляется столько всяких мелочей, функций и возможностей, что аж про самые основные можно и позабыть иногда.

42

@mrVeles, полностью согласен, топик стопроцентно подходит для хабра, не для кеддра, но тем не менее познавательно.

43

@woloshin, на хабре этот топик заплюют и затопчут, если вообще пропустят

44

@zhenya, :D точно, но на хабре бывали статьи и гораздо хуже

45

@woloshin, все равно там все злые :D

46

@zhenya, так потому и появился фрихабр, там проще, недобрых нету

47
Nemoi serega

Полторы тыщи накликало значит нужная рубрика... Хотя мне не интересная... Я в такие дебри лесть не буду... Мне легче заплотить тому кто для меня все сделает чем самому тратить время и без гарантий что-то получится...

48

Я вот недавно начал потихоньку вести что то типо блога http://kiriller.com/! Добавил 2 блока справа Вконтакте и Facebook ! Оцените пожалуйста! Правильно ли я их разместил!?
Спасибо!
Рубрика просто Офигенная!!! Буду теперь развивать свой блог благодаря КУДДРУ! Спасибо огромное!!

49

@Кирилл, мне лично было бы стыдно кому-то такое показывать. вы смелый человек!!!!!!:)

50

@iosmatic, Все на столько плохо!? Подскажите пожалуйста как лучше сделать?

51

@Кирилл, жесть-то какая. Более прикольный плагиат на кеддр сложно придумать.

52
CaptainFlint

Кто решил ставить себе разные социальные виджеты, кнопки лайков, советую посмотреть на сервис share42.com, выбираешь нужные сервисы и установка всего этого не более 5 минут.

Добавить комментарий

Такой e-mail уже зарегистрирован. Воспользуйтесь формой входа или введите другой.

Вы ввели некорректные логин или пароль

Извините, для комментирования необходимо войти.

Modal box

Сообщить об опечатке

Текст, который будет отправлен нашим редакторам: