Добавление на Турбо‑страницу контента сети Facebook
Вы можете разместить на Турбо‑странице встраиваемый контент Facebook:
- Встраиваемые комментарии. Вы можете добавить на Турбо‑страницу общедоступные комментарии к публикации, размещенной на Facebook от имени вашей Страницы или пользователя.
- Встраиваемые публикации. Вы можете добавить на Турбо‑страницу общедоступные публикации, размещенные на Facebook от имени вашей Страницы или пользователя.
- Плагин комментариев. Он позволяет пользователям комментировать содержимое ваших страниц.
- Плагин «Страница». Он позволяет встраивать и продвигать общедоступную Страницу Facebook. Пользователи смогут просматривать и делиться страницей, просматривая Турбо‑страницу вашего сайта.
- Кнопку «Нравится». С ее помощью пользователи могут отметить содержимое Турбо‑страницы и поделиться им на Facebook.
- Кнопку «Поделиться». Она позволяет пользователям добавлять сообщение к ссылкам, которые они хотят опубликовать в Хронике, группах или отправить через Facebook Message.
- Видео и видеоплеер. Помогает добавлять видеоматериалы и прямые трансляции с Facebook, которые размещены от имени Страницы или пользователя.
После добавления кода встраивания в RSS-канал, посмотрите, как контент отображается на Турбо‑странице. Сделать это можно в Вебмастере на странице Подробнее об отладке.
.Примечание.
При конфигурации виджета настраивайте ссылки с открытием в новой вкладке (target="_blank"
), иначе есть риск, что пользователь не сможет открыть ссылку.
Встраиваемые комментарии
- В Facebook получите ссылку на комментарий, который хотите добавить на Турбо‑страницу.
- Добавьте код в тег <![CDATA[ ]]> внутри элемента turbo:content.
Добавьте код вида
<div class="fb-comment-embed"...></div>
:... <turbo:content> <![CDATA[ <div class="fb-comment-embed" data-href="https://www.facebook.com/zuck/posts/10102577175875681?comment_id=1193531464007751&reply_comment_id=654912701278942" data-width="560" data-include-parent="false"></div> ]]> </turbo:content> ...
... <turbo:content> <![CDATA[ <iframe src="https://www.facebook.com/plugins/comment_embed.php?href=https%3A%2F%2Fwww.facebook.com%2Fzuck%2Fposts%2F10102577175875681%3Fcomment_id%3D1193531464007751%26reply_comment_id%3D654912701278942&width=560&include_parent=false&appId=603762189746032&height=148" width="560" height="148" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe> ]]> </turbo:content> ...
Встраиваемые публикации
- В Facebook получите URL публикации, которую хотите добавить на Турбо‑страницу.
- Сформируйте код для встраивания с помощью генератора кода, вручную или получите его непосредственно из публикации.
- Добавьте код в тег <![CDATA[ ]]> внутри элемента turbo:content.
Добавьте код вида
<div class="fb-post"...></div>
:... <turbo:content> <![CDATA[ <div class="fb-post" data-href="https://www.facebook.com/20531316728/posts/10154009990506729/" data-width="500" data-show-text="true"><blockquote cite="https://www.facebook.com/20531316728/posts/10154009990506729/" class="fb-xfbml-parse-ignore">Опубликовано <a href="https://www.facebook.com/facebook/">Facebook</a> <a href="https://www.facebook.com/20531316728/posts/10154009990506729/">27 августа 2015 г.</a></blockquote></div> ]]> </turbo:content> ...
... <turbo:content> <![CDATA[ <iframe src="https://www.facebook.com/plugins/post.php?href=https%3A%2F%2Fwww.facebook.com%2F20531316728%2Fposts%2F10154009990506729%2F&width=500&show_text=true&appId=603762189746032&height=308" width="500" height="308" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe> ]]> </turbo:content> ...
Плагин комментариев
- Выберите страницу-источник сайта, для которой формируется Турбо‑страница и на которой вы хотите разместить плагин комментариев. Например, https://example.com/page/.
- Добавьте код вида
<div class="fb-comments"...></div>
в тег <![CDATA[ ]]> внутри элемента turbo:content.
...
<turbo:content>
<![CDATA[
<div class="fb-comments" data-href="https://developers.facebook.com/docs/plugins/comments#configurator" data-width="320" data-mobile="true" data-numposts="5"></div>
]]>
</turbo:content>
...
Плагин «Страница»
При добавлении плагина на Турбо‑страницу поддерживаются все возможности, которые предоставляет Facebook (добавление вкладок, кнопки призыва к действию и др.).
- Добавьте код в тег <![CDATA[ ]]> внутри элемента turbo:content.
Добавьте код вида
<div class="fb-page"...></div>
:... <turbo:content> <![CDATA[ <div class="fb-page" data-href="https://www.facebook.com/facebook" data-tabs="timeline" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><blockquote cite="https://www.facebook.com/facebook" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/facebook">Facebook</a></blockquote></div> ]]> </turbo:content> ...
... <turbo:content> <![CDATA[ <iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Ffacebook&tabs=timeline&width=500&height=500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId=603762189746032" width="500" height="500" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe> ]]> </turbo:content> ...
Кнопка «Нравится»
- Выберите страницу-источник сайта, для которой формируется Турбо‑страница и на которой вы хотите разместить кнопку. Например, https://example.com/page/.
- Добавьте код в тег <![CDATA[ ]]> внутри элемента turbo:content.
Добавьте код вида
<div class="fb-like"...></div>
:... <turbo:content> <![CDATA[ <div class="fb-like" data-href="https://developers.facebook.com/docs/plugins/" data-layout="standard" data-action="like" data-size="small" data-show-faces="true" data-share="true"></div> ]]> </turbo:content> ...
... <turbo:content> <![CDATA[ <iframe src="https://www.facebook.com/plugins/like.php?href=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&width=450&layout=standard&action=like&size=small&show_faces=true&share=true&height=80&appId=603762189746032" width="450" height="80" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe> ]]> </turbo:content> ...
Видео и видеоплеер
- Выберите страницу-источник сайта, для которой формируется Турбо‑страница и на которой вы хотите разместить кнопку. Например, https://example.com/page/.
- Добавьте код в тег <![CDATA[ ]]> внутри элемента turbo:content.
Добавьте код вида
<div class="fb-video"...></div>
:... <turbo:content> <![CDATA[ <div class="fb-video" data-href="https://www.facebook.com/facebook/videos/10153231379946729/" data-width="500" data-show-text="false"><blockquote cite="https://www.facebook.com/facebook/videos/10153231379946729/" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/facebook/videos/10153231379946729/">How to Share With Just Friends</a><p>How to share with just friends.</p>Опубликовано <a href="https://www.facebook.com/facebook/">Facebook</a> 5 декабря 2014 г.</blockquote></div> ]]> </turbo:content> ...
... <turbo:content> <![CDATA[ <iframe src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2Ffacebook%2Fvideos%2F10153231379946729%2F&width=500&show_text=false&appId=603762189746032&height=280" width="500" height="280" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media" allowFullScreen="true"></iframe> ]]> </turbo:content> ...