<img alt="" src="https://secure.agile365enterprise.com/790157.png" style="display:none;">

Developer Tips: Adding Custom Media Inline Image Styles

author
By Team Srijan Jul 20, 2015
Developer Tips: Adding Custom Media Inline Image Styles
Developer Tips: Adding Custom Media Inline Image Styles

Srijan has come up with Developer Tips where you'll find step by step procedure to write some of the most commonly used programmes. Our first tip is on Adding Custom Media Inline Image Styles.

/**
 * Limit the available inline image styles.
 */
function MYMODULE_media_wysiwyg_allowed_view_modes_alter(&$view_modes, &$file) {
  $view_modes = array(
      'media_original' => array(
          'label' => 'Full Width',
          'custom settings' => TRUE,
      ),
      'media_large' => array(
          'label' => 'Half Width',
          'custom settings' => FALSE,
      ),
      'media_third_left' => array(
          'label' => 'One Third Left',
          'custom settings' => FALSE,
      ),
      'media_right_third' => array(
          'label' => 'One Third Right',
          'custom settings' => FALSE,
      ),
      'media_half_right' => array(
          'label' => 'Half Width Right',
          'custom settings' => FALSE,
      ),
      'media_left_half' => array(
          'label' => 'Half Width Left',
          'custom settings' => FALSE,
      ),
  );
}

Now update the $view_mode_updates in the media_token_to_markup function.

static $view_mode_updates = array(
          'media_preview' => 'preview',
          'media_small' => 'teaser',
          'media_large' => 'full',
          'media_third_left' => 'one-third-left',
          'media_right_third' => 'one-third-right',
          'media_half_right' => 'half-right',
          'media_left_half' => 'half-left',
        );

Note: Since this is a static variable, it is done through patch as above.

Subscribe to our newsletter