1 reply to this topic

[Shara Karasic]

Hi - my client has video thumbnails in both 4:3 and 16:9 aspect ratios. Can anyone guide me as to how to code TubePress so the thumbnails are not stretched? The settings do not allow you to set different widths/heights for different aspect ratios. Is there an easy way to do this? That would make our TubePress implementation perfect. Here is the site:

http://www.thecandyagency.com

[eric]

Hi,

Here's the look that you can achieve with the steps outlined in this post: http://i.imgur.com/O0TB9.png. You'll notice that the black bars are still there, but that's simply because the video provider (Vimeo/YouTube) stuck those in there. As of now there's no real easy way to hide that.

Here's what to do:

• If you haven't already, please create and activate a TubePress theme
  
  
• In your theme's copy of gallery.tpl.php, you'll want to change this line from
  
  

  <img alt="<span class="syntaxdefault"><?php echo htmlspecialchars($video->getTitle(), ENT_QUOTES, "UTF-8"); ?>" src="<?php echo $video->getThumbnailUrl(); ?>" width="<?php echo ${org_tubepress_api_const_template_Variable::THUMBNAIL_WIDTH}; ?>" height="<?php echo ${org_tubepress_api_const_template_Variable::THUMBNAIL_HEIGHT}; ?>" /></span>

  to
  
  

  <img alt="<span class="syntaxdefault"><?php echo htmlspecialchars($video->getTitle(), ENT_QUOTES, "UTF-8"); ?>" src="<?php echo $video->getThumbnailUrl(); ?>" width="<?php echo ${org_tubepress_api_const_template_Variable::THUMBNAIL_WIDTH}; ?>" max-height="240" /></span>

  As you can see, we're getting rid of the fixed height of the thumbnail and replacing it with a max-height of 240px.
  
  
• Add the following to your WordPress theme's style.css
  
  

  .tubepress_thumb {
      height: 240px ! important;
  }

That should do it! Please let me know if you have any questions implementing this and I'll be glad to assist. Thanks.