Slider

Slider can contain the following elements:
  • Video.
  • Picture.
  • Link.
  • YAN ad block. To add a slider to the ad, in the Yandex Advertising Network, on the Products → RTB blocks → 2. Site version page, create the Adaptive (Turbo) block. Also, disable the display of media formats for the “Site version: Turbo pages” ad block type.

    Disabling the display of media formats
    1. In the Yandex Advertising Network, go to the Products → RTB blocks page.
    2. Choose a block and click Edit.
    3. In the Strategy block, set the radio button to Separate CPM.
    4. Turn on the Set the CPM threshold or blocking for media advertising option and choose a value from the Blocking list.


<div data-block="slider" data-view="landscape">
    <figure>
        <figcaption>Sunset photo</figcaption>
        <img src="http://download.cdn.yandex.net/from/yandex.ru/support/ru/webmaster/files/sunset-lapse.jpg"/>
    </figure>
    <figure data-turbo-ad-id="first_YAN_ad_place"></figure>
    <figure>
        <video width="192" height="108">
            <source
                src="http://download.cdn.yandex.net/from/yandex.ru/support/ru/webmaster/files/sunset-lapse.mp4"
                type="video/mp4"
                data-duration=15
                data-title="Sunset"/>
        </video>
        <img src="http://download.cdn.yandex.net/from/yandex.ru/support/ru/webmaster/files/sunset-lapse.jpg"/>
        <figcaption>Take a look at the sunset timelapse</figcaption>
    </figure>
    <figure data-turbo-ad-id="second_YAN_ad_place"></figure>
</div>
Note. Slider doesn't support GIF animation.
Use the div element with the following attributes:
Attribute Description
data-block * Takes the slider value.
data-view Allows you to set the display of images. Possible values:
  • auto (default value) — Automatic orientation setting based on the proportions of the original image.
  • portrait — Portrait.
  • landscape — Album.
  • square — Square.
data-item-view Possible values:
  • cover (default value) — The content fully covers the slider and may be cut.
  • contain — The content is scalable and displayed fully.

*Required attribute.

Inside the div element, use the following elements:

Element Description
header A general title to the whole slider. Displayed if none of the figure elements have captions.
figure *

Slider element. It can be the YAN ad block, a picture or a link.

figcaption Caption for the slider element.
img Picture.
a Link.
video Video block.
source * Video clip parameters.

* Required element.

The figure element attribute.
Attribute Description
data-turbo-ad-id Add the ad block position ID specified in the turbo:adNetwork element or on the Turbo pages → Webmaster settings page.
Video element attributes
Attribute Description
width * Width of the video block.
height * Height of the video block.
The source element attributes
Attribute Description
src * The video URL.
type * The type of video. The supported format is video/mp4.
data-duration * The displayed length of the video, integer.
data-title The title of the video block.

*Required attribute.