You are here

Blazy API in Blazy 8

Same name and namespace in other branches
  1. 8.2 blazy.api.php \blazy_api
  2. 7 blazy.api.php \blazy_api

Information about the Blazy usages.

Modules may implement any of the available hooks to interact with Blazy. Blazy may be configured using the web interface using formatters, or Views. However below is a few sample coded ones as per Blazy RC2+.

A single image sample.

function my_module_render_blazy() {
  $settings = [
    // URI is stored in #settings property so to allow traveling around video
    // and lightboxes before being passed into theme_blazy().
    'uri' => 'public://logo.jpg',
    // Explicitly request for Blazy.
    // This allows Slick lazyLoad to not load Blazy.
    'lazy' => 'blazy',
    // Optionally provide an image style:
    'image_style' => 'thumbnail',
  ];
  $build = [
    '#theme' => 'blazy',
    '#settings' => $settings,
    // Or below for clarity:
    '#settings' => [
      'uri' => 'public://logo.jpg',
      'lazy' => 'blazy',
    ],
    // Pass custom attributes into the same #item_attributes property as
    // Blazy formatters so to respect external modules like RDF, etc. without
    // extra property. The regular #attributes property is reserved by Blazy
    // container which holds either IMG, icons, or iFrame. Meaning Blazy is
    // not just IMG.
    '#item_attributes' => [
      'alt' => t('Thumbnail'),
      'title' => t('Thumbnail title'),
      'width' => 120,
    ],
    // Finally load the library, or include it into a parent container.
    '#attached' => [
      'library' => [
        'blazy/load',
      ],
    ],
  ];
  return $build;
}

A multiple image sample.

For advanced usages with multiple images, and a few Blazy features such as lightboxes, lazyloaded images, or iframes, including CSS background and aspect ratio, etc.: o Invoke blazy.manager, and or blazy.formatter.manager, services. o Use \Drupal\blazy\BlazyManager::getImage() method to work with images and pass relevant settings which request for particular Blazy features accordingly. o Use \Drupal\blazy\BlazyManager::attach() to load relevant libraries.

function my_module_render_blazy_multiple() {

  // Invoke the plugin class, or use a DI service container accordingly.
  $manager = \Drupal::service('blazy.manager');
  $settings = [
    // Explicitly request for Blazy library.
    // This allows Slick lazyLoad, or text formatter, to not load Blazy.
    'blazy' => TRUE,
    // Supported media switcher options dependent on available modules:
    // colorbox, media (Image to iframe), photobox.
    'media_switch' => 'media',
  ];

  // Build images.
  $build = [];

  // Finally attach libraries as requested via $settings.
  $build['#attached'] = $manager
    ->attach($settings);
  return $build;
}

Pre-render callback sample to modify/ extend Blazy output.

function my_module_pre_render(array $image) {
  $settings = isset($image['#settings']) ? $image['#settings'] : [];

  // Video's HREF points to external site, adds URL to local image.
  if (!empty($settings['box_url']) && !empty($settings['embed_url'])) {
    $image['#url_attributes']['data-box-url'] = $settings['box_url'];
  }
  return $image;
}

See also

\Drupal\blazy\Blazy::buildAttributes()

\Drupal\blazy\Dejavu\BlazyDefault::imageSettings()

\Drupal\blazy\Plugin\Field\FieldFormatter\BlazyFormatterTrait::buildElements()

\Drupal\blazy\Plugin\Field\FieldFormatter\BlazyVideoFormatter::buildElements()

\Drupal\gridstack\Plugin\Field\FieldFormatter\GridStackFileFormatterBase::buildElements()

\Drupal\slick\Plugin\Field\FieldFormatter\SlickFileFormatterBase::buildElements()

\Drupal\blazy\BlazyManager::getImage()

hook_blazy_alter()

File

./blazy.api.php, line 8
Hooks and API provided by the Blazy module.

Functions

Namesort descending Location Description
hook_blazy_alter ./blazy.api.php Alters Blazy individual item output to support a custom lightbox.
hook_blazy_attach_alter ./blazy.api.php Alters Blazy attachments to add own library, drupalSettings, and JS template.
hook_blazy_base_settings_alter ./blazy.api.php Alters blazy-related formatter form options to make site-builders happier.
hook_blazy_complete_form_element_alter ./blazy.api.php Alters blazy-related formatter form elements.
hook_blazy_lightboxes_alter ./blazy.api.php Alters available lightboxes for Media switch select option at Blazy UI.