Добавление фотогалереи в RSS

Для того, чтобы объединить несколько изображений в фотогалерею, необходимо на место предполагаемой фотогалереи внутри тега <content:encoded> вставить следующий элемент:

<div data-pulse-component="gallery" data-pulse-component-name="gallery_name">

<figure><img src="..."/><figcaption>Пример подписи 1</figcaption></figure>...

<figure><img src="..."/><figcaption>Пример подписи 2</figcaption></figure></div>

data-pulse-component="gallery" – обязательный атрибут, указывающий на то, что вложенные элементы надо отображать в статье как фотогалерею.

data-pulse-component-name="gallery_name" – обязательный атрибут, содержащий имя галереи.

Если в каждом из ваших материалов всего по одной фотогалерее, вы можете проставить для всех <item> одинаковое значение этого атрибута. Но важно, что двух галерей с одним и тем же значением в одном <item> быть не должно. Если вы хотите вставить в статью две галереи, учтите, что вам нужно задать для каждой из них собственное значение "gallery_name".

 

Пример блока галереи внутри <content:encoded>:

<div data-pulse-component="gallery" data-pulse-component-name="pulse_gallery">

<figure><img src="https://example.com/uploads/2020/03/taxi.jpg"/><figcaption>Пример подписи к первому фото</figcaption></figure>

<figure><img src="https://example.com/uploads/2020/03/taxi1.jpg"/><figcaption>Пример подписи к второму фото </figcaption></figure>

<figure><img src="https://example.com/uploads/2020/03/taxi3.jpg"/><figcaption>Пример подписи к третьему фото </figcaption></figure> </div>


Пример item с галереей:

<item>

<title>Опубликованы первые фотографии летающего электротакси</title>

<link>https://example.com/</link>

<pubDate>Mon, 23 Mar 2020 12:00:00 +0000</pubDate>

<author>Игорь Малышев</author>

<description>Первые экспериментальные полеты могут пройти уже в 2020 году.</description>

<enclosure url="https://example.com/uploads/2020/03/taxi.jpg" type="image/jpeg"/>

<enclosure url="https://example.com/uploads/2020/03/taxi1.jpg" type="image/jpeg"/>

<enclosure url="https://example.com/uploads/2020/03/taxi3.jpg" type="image/jpeg"/>

<content:encoded><![CDATA[<p>Производители показали первые фото электрического аэротакси. Фото смотрите в галерее.</p>

<div data-pulse-component="gallery" data-pulse-component-name="pulse_gallery">

<figure><img src="https://example.com/uploads/2020/03/taxi.jpg"/><figcaption>Пример подписи к первому фото</figcaption></figure>

<figure><img src="https://example.com/uploads/2020/03/taxi1.jpg"/><figcaption>Пример подписи к второму фото </figcaption></figure>

<figure><img src="https://example.com/uploads/2020/03/taxi3.jpg/"/><figcaption>Пример подписи к третьему фото </figcaption></figure>

</div>

<p>В Австралии первые экспериментальные полеты могут быть осуществлены уже в 2020 году, а полномасштабный запуск запланирован на 2023 год.</p>

]]></content:encoded>

</item>

 

Как выглядит фотогалерея?

https://drive.google.com/file/d/1u3zDsScjabSzt7mBdnk4p0GRJQhFRcK7/view?usp=sharing

https://drive.google.com/file/d/1ssH6n3rroLtFLggYixmGHTrgpHii1ZbK/view?usp=sharing

Отображение виджета Instagram в полнотексте

Для того, чтобы отобразить изображение из Instagram в полнотексте необходимо:

  • Открыть пост, необходимый для полнотекста, в Instagram-web

  • Нажать на многоточие рядом с постом

  • Выбрать пункт Embed

  • Нажать на Copy Embed code

  • Вставить его в текст полнотекста

Автоматически, код будет обработан и отображён в виде инстаграммного поста.

Пример кода embed:

<blockquote class="instagram-media" data-instgrm-captioned data-instgrm-permalink="https://www.instagram.com/p/somelink/" 

data-instgrm-version="12"  style=" background:#FFF; border:0; border-radius:3px; box-shadow:0 0 1px 0 rgba(0,0,0,0.5),0 1px 10px 0 rgba(0,0,0,0.15); margin: 1px; max-width:540px; min-width:326px; padding:0; width:99.375%; width:-webkit-calc(100% - 2px); width:calc(100% - 2px);">

<div style="padding:16px;">

</div>

</blockquote> 

<script async src="//www.instagram.com/embed.js"></script>