Как вставить социальные кнопки в детальное описание новости битрикс

9266  |  3

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

Способ первый- возможностями битрикс

На самом деле все просто. Данная возможность уже есть в битрикс, но если за месяц подобное искали 28 раз, значит не все видели или знают.

Итак, открываем любую новость в публичной части сайта в режиме редактирования. Наводим на тело новости, и во всплывшем табе кликаем по шарниру, далее на пункт "Редактировать параметры компонента"

Редактировать параметры компонента

В появившемся окне опускаемся в самый низ и выбираем чекбокс "Отображать панель соц. закладок"

Отображать панель соц. закладок

В общем-то все. После сохранения, во всех новостях данного инфоблока появится вот такая панелька:

панель соц. закладок

Не ахти что, да и сервисов мало. Конечно внешний вид можно оформить по своему вкусу. Но все же перейдем ко второму способу:

Способ второй- быстро и красиво

Заключается в том, что мы подключим панель социальных закладок со стороны. Например, с помощью сервиса "однакнопка" настраиваем внешний вид, которых там несколько. От простой панели по типу моей (в самом низу этой записки), до симпатичной выпадающей менюшки. Минус тут в надежности, если однажды этот сервис умрет, то и кнопки пропадут. Можно сгенерировать кнопки по отдельности, воспользовавшись функционалом самих социальных сетей.

Так или иначе, в итоге, вы получите код примерно такого вида:

<script src="http://odnaknopka.ru/ok1.js" type="text/javascript"></script>
 

Заключаем его в тег <noindex> чтобы не раскидываться внешними ссылками.

Также как и в первом способе, наводим на тело новости в режиме правки, клик по шарниру, и из выпавшего меню выбираем "Новости" → "Редактировать шаблон компонента"

Редактировать шаблон компонента

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

шаблона своего блогнота

Сохраняем и любуемся. Аналогично вставляем коды полученные любым другим способом. В общем, ничего сложного. Успехов.

Важное дополнение

Так как сервис "однаконопка" стал детектироваться антивирусом Яндекса как "вредоносный код". После небольшой переписки с Платоном Щукиным решил им больше не пользоваться.




Вопрос

Базаров Михаил написал:

Здраствуйте.
На моем сайте http://camouf.ru на двух страницах обнаружен вирус. Однако, после полной проверки сайта и сервера на котором он запущен, вирусов обнаружено не было (проверялось антивирусом Касперского и Доктор Веб). Не могли бы подсказать что конкретно определяется Вашим антивирусом на данном сайте? Гипотетически думаю что данной угрозой (Поведенческий анализ) определяется плагин mousewheel который ни какой опасности не представляет (используется для возможности прокручивать изображения колесиком мышки).

Ответ

Здравствуйте, Михаил!
Источником заражения являются js-скрипты сервиса odnaknopka.ru , которые находятся на Вашем сайте. При обращении к odnaknopka.ru/ok2.js с User-Agent мобильного устройства происходит автоматическое перенаправление посетителей на вредоносные цели.
Советую Вам обратиться к владельцам данного сервиса за комментариями относительно присутствия вредоносного кода для пользователей мобильных устройств.

С уважением, Платон Щукин
Служба поддержки Яндекса
http://help.yandex.ru/



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

Кнопки нравится, поделиться и класс, вариант третий безопасный

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

Данный громадный кусок, вставляем в тоже самое место куда до этого вставляли скрипт сервиса однакнопка. Оформляйте как заблагорассудится, привожу свой пример:

<div style="float:left; margin-left:15px;">
<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";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like" data-href="http://developers.facebook.com/docs/reference/plugins/like" data-send="true" data-layout="button_count" data-width="200" data-show-faces="false" data-action="recommend"></div>
</div>

<div style="float:left; margin-left:10px;">
<!-- Put this script tag to the <head> of your page -->
<script type="text/javascript" src="http://vk.com/js/api/share.js?85" charset="windows-1251"></script>

<!-- Put this script tag to the place, where the Share button will be -->
<script type="text/javascript"><!--
document.write(VK.Share.button(false,{type: "round", text: "Сохранить"}));
--></script>
</div>


<div style="float:left; margin-left:10px;">
<a href="https://twitter.com/share" class="twitter-share-button">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
</div>


<div style="float:left; margin-left:0px;">
<script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script>
<g:plusone></g:plusone>
</div>


<div style="float:left; margin-left:0px;">
<div id="ok_shareWidget"></div>
<script>
!function (d, id, did, st) {
var js = d.createElement("script");
js.src = "http://connect.ok.ru/connect.js";
js.onload = js.onreadystatechange = function () {
if (!this.readyState || this.readyState == "loaded" || this.readyState == "complete") {
if (!this.executed) {
this.executed = true;
setTimeout(function () {
OK.CONNECT.insertShareWidget(id,did,st);
}, 0);
}
}};
d.documentElement.appendChild(js);
}(document,"ok_shareWidget","http://dev.ok.ru","{width:145,height:30,st:'rounded',sz:20,ck:1}");
</script>
</div>

PS: Вариант- ненадежный

И напоследок, предлагаю вашему вниманию сервис сродни однойкнопки pluso вставлять по инструкции "способ 2". На данный момент не забракован Яндексом, но бдительность никто не отменял, если однажды ваш сайт забракуют антивирусом, данный сервис идет под снос в первую очередь.

Расскажи друзьям-то:
Уважаемый читатель! В связи с участившимся спамом в комментариях, возможность писать доступна только для зарегистрированных пользователей
Зарегистрироваться Войти Напомнить пароль
Или войти через социальную сеть:
Илья Смирнов
Михаил добрый день, прежде всего хочу сказать спасибо за представленные уроки и советы. У меня на шее 3 сайта и все на битриксе. К сожалению программированием я не владею, но логику данной CMS начинаю потихоньку понимать. У меня вопрос такого характера:
Есть инфоблоки (в т.ч. и новостные) скажем у нас есть раздел "Мероприятия" где выведен список news_list (соответственно) переходя в детальное описание какой либо новости (мероприятия) хочется что бы описание (SEO) данного блока выводилось в описание страницы. На данный момент на любой новости стоит описание раздела в целом, а как сделать что бы по каждой новости было отдельно?
У вас чуть выше есть блок с кнопками соцсетей, так вот при нажатии скажем на ВКонтакте он предлагает поделится с друзьями и имеет ссылку с описанием конкретно этого раздела и заголовком, у меня же в разделе новости он при нажатии этой же кнопки выдает описание раздела в целом, а не отдельной новости.
Прошу прощение за слишком подробное описание, просто я не где так и не нашел решение этого вопроса. Может вы поделитесь как решили данную проблему?
За ранее благодарен.
Михаил Базаров
Цитата
Илья Смирнов пишет:
Михаил добрый день, прежде всего хочу сказать спасибо за представленные уроки и советы. У меня на шее 3 сайта и все на битриксе. К сожалению программированием я не владею, но логику данной CMS начинаю потихоньку понимать. У меня вопрос такого характера:
Есть инфоблоки (в т.ч. и новостные) скажем у нас есть раздел "Мероприятия" где выведен список news_list (соответственно) переходя в детальное описание какой либо новости (мероприятия) хочется что бы описание (SEO) данного блока выводилось в описание страницы. На данный момент на любой новости стоит описание раздела в целом, а как сделать что бы по каждой новости было отдельно?
У вас чуть выше есть блок с кнопками соцсетей, так вот при нажатии скажем на ВКонтакте он предлагает поделится с друзьями и имеет ссылку с описанием конкретно этого раздела и заголовком, у меня же в разделе новости он при нажатии этой же кнопки выдает описание раздела в целом, а не отдельной новости.
Прошу прощение за слишком подробное описание, просто я не где так и не нашел решение этого вопроса. Может вы поделитесь как решили данную проблему?
За ранее благодарен.
Если версия битрикс старая (до 14-ой если память не изменяет) то вам нужно создать свойства инфоблока "Ключевые слова" и "Описание"

Потом просто выбрать их в настройках компанента новостей, в выпадающих списках в секции детальной новости, будут доступны эти свойства к выбору- как ключи и описание элемента

В свежей версии, все это делается на вкладке СЕО, ни как лишних манипуляций не требуется.
Guest
Цитата
Михаил Базаров пишет:
Цитата
Илья Смирнов пишет:
Михаил добрый день, прежде всего хочу сказать спасибо за представленные уроки и советы. У меня на шее 3 сайта и все на битриксе. К сожалению программированием я не владею, но логику данной CMS начинаю потихоньку понимать. У меня вопрос такого характера:
Есть инфоблоки (в т.ч. и новостные) скажем у нас есть раздел "Мероприятия" где выведен список news_list (соответственно) переходя в детальное описание какой либо новости (мероприятия) хочется что бы описание (SEO) данного блока выводилось в описание страницы. На данный момент на любой новости стоит описание раздела в целом, а как сделать что бы по каждой новости было отдельно?
У вас чуть выше есть блок с кнопками соцсетей, так вот при нажатии скажем на ВКонтакте он предлагает поделится с друзьями и имеет ссылку с описанием конкретно этого раздела и заголовком, у меня же в разделе новости он при нажатии этой же кнопки выдает описание раздела в целом, а не отдельной новости.
Прошу прощение за слишком подробное описание, просто я не где так и не нашел решение этого вопроса. Может вы поделитесь как решили данную проблему?
За ранее благодарен.
Если версия битрикс старая (до 14-ой если память не изменяет) то вам нужно создать свойства инфоблока "Ключевые слова" и "Описание"

Потом просто выбрать их в настройках компанента новостей, в выпадающих списках в секции детальной новости, будут доступны эти свойства к выбору- как ключи и описание элемента

В свежей версии, все это делается на вкладке СЕО, ни как лишних манипуляций не требуется.
Спасибо Михаил как всегда выручили!))

© 2011—2016 Частный вебмастер: ИП Базаров, ОГРНИП: 315784700173692. Работает на 1С-Битрикс.
Копирование материалов запрещено: "ГК РФ, часть 4, раздел VII: Права на результаты интеллектуальной деятельности".

Информация размещенная на сайте, не является публичной офертой. Политика конфеденциальности
x
Как к Вам обращаться? *
Ваша электронная почта: *
Доп. материалы (логотип, тех. задание):
 
Обзор
Текст сообщения: