youtube preview image has black bars

The black bars are likely generated by the image style being used having a different aspect ration than the YouTube provided thumbnail. See: http://drupal.stackexchange.com/questions/21308/change-image-background-... for suggestions on how to fix the style definition to control the background. Alternatively, change the aspect ratio so it matches the source images from YouTube.

I've tried many different image styles to attempt to match YouTube's aspect ratio, but nothing seems to have any effect.

Has anyone found another solution to this issue?

My research for the 8.x branch is relevant to this issue: #2711323: YouTube videos have black bars..

Hi

I used the following solution to create an embedded youtube video without black bars on my drupal page (Open Outreach), inside a block, aligned with the rest of the block.

//In the block body:

//In the CSS:
.container {
position: relative;
padding-bottom: 56,25%;
height: 0;
}
.video {
position: absolute;
left: -5px;
margin-top: 0px;
width: 105%;
height: 105%;
}

For me this works like a charm!

So I was xdebugging through the 7.x branch and inside video_embed_field_field_presave() the actual thumbnail is downloaded.
This makes it difficult/impossible without refactoring of the branch to make use of the fallback as in the 8.x branch commit (http://cgit.drupalcode.org/video_embed_field/commit/?id=4c01b41).

It might be easier to add an configuration option to the field that let the site-builder choose which thumnail-type to choose.

But my proposal would be to just default to maxresdefault. It looks a lot better.

The attached patched does just that.

There is an upgrade issues, because the old thumbnail are still in the system and they are not recreated automatically.
I can trigger recreation by:
1. Delete the old files in /files/video_embed_field_thumbnails/youtube
2. Re-save any node has a video_embed_field with youtube video

And I tried to create an update function. But not successful though.

The manual procedure in #7 works.

This is a start for the hook_update.
It will call entity_save() for all entities with a video_embed_field.
But that does not trigger the required call to video_embed_field_field_presave()
Don't know why.

But even if it would work; for a site with a lot of thumbnails this easily can trigger time-outs.

So maybe it is better to put this issue to "no-fix" and keep the patch #7 waiting here.
Note that for a Drupal 7 site without existing thumbnails you can use the patch in #7 without any issues.

/**
 * Update youtube thumbnails to max resolution.
 */
function video_embed_field_update_7011() {
  // Delete all youtube thumbnail images.
  file_unmanaged_delete_recursive('public://video_embed_field_thumbnails/youtube');
  // Re-generate all youtube thumbnail images with max resolution.
  $video_embed_fields = field_read_fields(array('type' => 'video_embed_field'));
  foreach ($video_embed_fields as $field_name => $field_settings) {
    $query = new EntityFieldQuery();
    $query->fieldCondition($field_name, 'video_url', 'NULL', '!=');
    $result = $query->execute();

    foreach ($result as $entity_type => $entities) {
      foreach ($entities as $entity) {
        entity_save($entity_type, $entity);

        /// !!!! This does not trigger video_embed_field_field_presave()
        /// so it doesn't work.
      }
    }
  }
}

I fix it by create new views with bulk operation and 'Publish content' for all content you need to generate new thumbnail.

You can use online service like (https://www.youtubethumbnaildownloaderonline.com/?id=YQB8i4XjfX8) to get the preview image of your choice