Как добавить кнопки «Поделиться» на страницу

Что дела­ем: под­клю­ча­ем к сай­ту кноп­ки, что­бы чита­те­ли мог­ли быст­ро поде­лить­ся ста­тьей в соц­се­тях.

Вре­мя: 3 мину­ты.

С чем рабо­та­ем: HTML-страница.

Что пона­до­бит­ся: блок «Поде­лить­ся» у Яндек­са.

1. Выбираем нужные соцсети

Захо­дим на стра­ни­цу сер­ви­са и галоч­ка­ми отме­ча­ем те соц­се­ти и мес­сен­дже­ры, кото­рые вам нуж­ны. При жела­нии мож­но отме­тить все, но выгля­деть это будет очень гро­мозд­ко.

2. Настраиваем внешний вид блока

Мож­но выбрать толь­ко икон­ки, икон­ки и меню (полез­но, когда ико­нок мно­го) и икон­ки малень­ко­го раз­ме­ра. На рабо­то­спо­соб­ность сер­ви­са это никак не повли­я­ет.

3. Получаем код

Полу­чив­ший­ся код нуж­но ско­пи­ро­вать и вста­вить в нуж­ное место на стра­ни­це — то есть там, где он дол­жен появить­ся. Чаще все­го икон­ки раз­ме­ща­ют сра­зу после ста­тьи, но вы може­те поста­вить их вооб­ще в любое место на сай­те.

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

Лайфхаки

Что­бы стра­ни­ца хоро­шо шери­лась в соц­се­тях, нуж­но про­пи­сать ей пара­мет­ры OpenGraph. Это спе­ци­аль­ная скры­тая раз­мет­ка, кото­рая гово­рит соц­се­тям, как пока­зы­вать ваш кон­тент. Подроб­но­сти есть у Яндек­са

Обыч­но, когда в соц­се­тях шерят сай­ты или ста­тьи, на глав­ную кар­тин­ку для соц­се­тей попа­да­ет пер­вая боль­шая кар­тин­ка на стра­ни­це. Ино­гда это соот­вет­ству­ет вашей задум­ке, а ино­гда нет — напри­мер, в соц­се­ти уйдет ваш лого­тип или какая-то мало­зна­чи­тель­ная кар­тин­ка. Поэто­му сто­ит сде­лать отдель­ную кар­тин­ку для соц­се­тей и при­ло­жить ее к раз­мет­ке OpenGraph, что­бы ваша ста­тья все­гда выгля­де­ла рос­кош­но.