MediaBlockPhotos

Media Block (photos)

Template ID	Required
oggeh-photos	No

A template for displaying the content of a single media block with photos.

Example:

<template id="oggeh-photos">
  <div class="grid-item col-lg-{{ size_x }}">
    <div class="content">
      <h3>{{ title }}</h3>
      <div id="single-carousel-{{ block_id }}" class="single-carousel carousel slide" data-ride="carousel">
        <ol class="carousel-indicators">
          <li data-oggeh-repeat data-target="#single-carousel-{{ block_id }}" data-slide-to="{{ * }}" class="{{ active = 0 }}"></li>
        </ol>
        <div class="carousel-inner" role="listbox">
          <div data-oggeh-repeat class="item {{ active = 0 }}">
            <div class="single-item">
              <div class="img-holder">
                <img src="{{ regular.url }}" alt="{{ caption.title }}">
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

Notes: You can only use the data attribute data-oggeh-repeat with this media/attachments blocks and/or receive a list of content from OGGEH API (see Handling Search Results).

Example API Response Object

{
    "type": "media",
    "col": 7,
    "row": 1,
    "size_x": 6,
    "size_y": 1,
    "title": "Test Media Single Photo Block",
    "media": [
        {
            "id": 7,
            "code": "xxx",
            "ext": "jpg",
            "type": "photo",
            "thumbnail": {
                "url": "https://storage.googleapis.com/cdn.oggeh.com/files/xxx/img/thumbs/xxx.jpg"
            },
            "regular": {
                "url": "https://storage.googleapis.com/cdn.oggeh.com/files/xxx/img/photos/xxx.jpg"
            },
            "maximum": {
                "url": "https://storage.googleapis.com/cdn.oggeh.com/files/xxx/img/medium/xxx.jpg"
            },
            "original": {
                "url": "https://storage.googleapis.com/cdn.oggeh.com/files/xxx/img/large/xxx.jpg"
            },
            "tags": [],
            "caption": {
                "title": "",
                "description": ""
            }
        }
    ]
}