Добрый день. Нужен html код виджетов с комментариями (Вконтакте и facebook) для вставки на лендинг.
1. Высота блока должна меняться в зависимости от размера окна комментариев.
2. Брейкпоинты:
1200px – MAX. Оба виджета шириной 550 px расположены горизонтально. Расстояние между ними 40-50 px
980 – 1200px. Оба виджета шириной 450 px расположены горизонтально. Расстояние между ними 20-30 px
640-980px. Оба виджета шириной 300 px расположены горизонтально. Расстояние между ними 20 px
480-640px. Виджет ВК шириной 450 px. Виджет Facebook не отображается.
320-480px. Виджет ВК шириной 310 px. Виджет Facebook не отображается.
3. Между виджетами vk и fb всегда есть вертикальная линия толщиной 1px с цветом #19bdec
По ссылке то, как есть сейчас
Там комментарии за границы блока уходят, на тильде по-другому не получается.
Для того чтобы комментарии заработали надо в head вставить:
<!-- Put this script tag to the <head> of your page -->
VK.init({apiId: 6420660, onlyWidgets: true});
И в любое место:
<div id="fb-root"></div>
(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 = '
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
Вот сами виджеты:
VK:
<!-- Put this div tag to the place, where the Comments block will be -->
<div id="vk_comments"></div>
VK.Widgets.Comments("vk_comments", {limit: 1, width: "550", autoPublish: 1, attach: "*"});
FB:
<div class="fb-comments" data-href="
" data-width="550" autoPublish: "1" data-numposts="10"></div>