Добавление на Турбо‑страницу контента сети Одноклассники

Вы можете разместить на Турбо‑странице встраиваемый контент сети Одноклассники:

• Кнопку «Класс» («Поделиться»). Она позволит пользователям отметить содержимое Турбо‑страницы и поделиться им на в Одноклассниках.

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

• Видео. Вы можете добавлять в текст видеоматериалы, размещенные в сети Одноклассники.

После добавления кода встраивания в RSS-канал, посмотрите, как контент отображается на Турбо‑странице. Сделать это можно в Вебмастере на странице Турбо‑страницы для контентных сайтов → Отладка. Подробнее об отладке.

Кнопка «Класс» («Поделиться»)

Вы можете добавлять на одну Турбо‑страницу несколько встраиваемых блоков. Для этого используйте пример кода, приведенный в инструкции Одноклассников.

1. Выберите страницу-источник сайта, для которой формируется Турбо‑страница и на которой вы хотите разместить кнопку. Например, https://example.com/page/.

2. Добавьте URL выбранной страницы в конструктор кнопки Одноклассников и настройте отображение кнопки.

3. Из кода для встраивания скопируйте элемент script и его содержимое. Вы можете использовать несколько вариантов кода:

   Полный код вызова API и виджета

   <script>
       !function (d, id, did, st, title, description, image) {
           var js = d.createElement("script");
           js.src = "https://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, title, description, image);
                   }, 0);
               }
           }};
           d.documentElement.appendChild(js);
       }(document,"ok_shareWidget","https://ya.ru",'{"sz":30,"st":"oval","ck":1}',,,);
   </script>
   

   Короткий код вызова виджета

   Такой код необходимо сформировать самостоятельно:

   <script type="text/javascript">
       OK.CONNECT.insertShareWidget("mineShareWidgetDivId","https://ya.ru",'{"sz":30,"st":"oval","ck":1}',,,);
   </script>
   

4. Добавьте код в тег <![CDATA[ ]]> внутри элемента turbo:content.

...
<turbo:content>
    <![CDATA[
        <script type="text/javascript">
           OK.CONNECT.insertShareWidget("mineShareWidgetDivId","https://ya.ru",'{"sz":30,"st":"oval","ck":1}',,,);
        </script>
    ]]>
</turbo:content>
...

Виджет группы

Вы можете добавлять на одну Турбо‑страницу несколько встраиваемых блоков. Для этого используйте пример кода, приведенный в инструкции Одноклассников.

1. В Одноклассниках настройте отображение виджета и сформируйте код для встраивания.

2. Из кода для встраивания скопируйте элемент script и его содержимое. Вы можете использовать несколько вариантов кода:

   Полный код вызова API и виджета

   <script>
       !function (d, id, did, st) {
       var js = d.createElement("script");
       js.src = "https://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.insertGroupWidget(id,did,st);
               }, 0);
           }
       }}
       d.documentElement.appendChild(js);
   }(document,"ok_group_widget","48235937660955",'{"width":250,"height":285}');
   </script>
   

   Короткий код вызова виджета

   Такой код необходимо сформировать самостоятельно:

   <script type="text/javascript">
       OK.CONNECT.insertGroupWidget("widget", 48235937660955, '{width: "250", height: "285"}');
   </script>
   

3. Добавьте код в тег <![CDATA[ ]]> внутри элемента turbo:content.

...
<turbo:content>
    <![CDATA[
        <script type="text/javascript">
            OK.CONNECT.insertGroupWidget("widget", 48235937660955, '{width: "250", height: "285"}');
        </script>
    ]]>
</turbo:content>
...

Видео

Видеоролики можно встраивать на Турбо‑страницу с помощью HTML-элементов:

• a (в виде ссылки). В этом случае видеоролик откроется поверх контента Турбо‑страницы.
• iframe.

Добавьте код в тег <![CDATA[ ]]> внутри элемента turbo:content.

...
<turbo:content>
    <![CDATA[
        <a href="https://ok.ru/video/771913157349"/a>
    ]]>
</turbo:content>
...

...
<turbo:content>
    <![CDATA[
        <iframe width="560" height="315" src="//ok.ru/videoembed/771913157349" frameborder="0" allow="autoplay" allowfullscreen></iframe>
    ]]>
</turbo:content>
...