Customize Video Auto Thumnail Image

  • bernadettetp

    (@bernadettetp)


    7 years ago

    Can you help with these questions?

    1. Is there css I could used to center the thumbnails correctly? One that also centers the play.png image? I am using this

    .wpvl_auto_thumb_box_wrapper {
    margin-left: 19% !important;
    }

    but whenever I change the padding for the column the short code is in, I have to change the % in the css. This means I cannot use the shortcode for other videos on any other page because it will not look centered.

    2. How can I increase the video thumbnail image? (while still using the auto thumbnail option to pull from youtube) Is there anyway to remove the black border on the top and bottom?

    3. Replace the play.png image with my own. I replaced this file in the plugins Images folder but it did not replace the image.

    Thank you for your help in advance!

    The page I need help with: [log in to see the link]

Viewing 10 replies - 1 through 10 (of 10 total)
  • Plugin Support mbrsolution

    (@mbrsolution)

    Hi, I don’t see any black borders on the top and bottom. I see them on the left hand side and right hand side.

    Did you add width and height to the thumbnail image class?

    When you replaced the play.png file did you also clear the cache in your site? Did you add the same URL name to the file you used?

    The thumbnail images are currently on the left hand side. Are you trying to center them? Can you give me an example of where would you like to move those thumbnail images too?

    Thank you

    Thread Starter bernadettetp

    (@bernadettetp)

    See image: https://snag.gy/71xDjX.jpg

    1. Center Images: Yes I am trying to center the thumbnail image and the play.png image. (blue)

    2. Image Size: Using this css only adjusts the height, the width will not change.

    .video_lightbox_auto_anchor_image {
    width: 250px !important;
    height: 188px !important;
    }

    3. Custom play.png: This is solved. Thanks!

    Plugin Support mbrsolution

    (@mbrsolution)

    Hi, thank you for sharing the image. Now I know which video images you are trying to center.

    To center the images try the following CSS.

    .wpvl_auto_thumb_box{
margin: auto;
}

    The height is limited by the wrapper div contain around the anchor image. You actually have a few div containers. You will have to experiment more with this.

    Let me know if you need more help.

    Kind regards

    Thread Starter bernadettetp

    (@bernadettetp)

    The css worked great! Thank you.

    I will just leave the size as is for now. But where do the black borders come from on the auto thumbnail images? https://snag.gy/ocjl3h.jpg

    I’d like to try and remove the black padding on the top and bottom of the images.

    Plugin Support mbrsolution

    (@mbrsolution)

    Hi, you are most welcome ??

    The padding is actually coming from the YouTube image. You can check the following URL https://img.youtube.com/vi/3L38leZdQ4g/0.jpg.

    Let me know if you need more help.

    Kind regards

    Thread Starter bernadettetp

    (@bernadettetp)

    Is there a way to work around this? How/why does youtube add the black padding?

    When I look at the thumbnail image in youtube it doesn’t have any padding. When I download it right from youtube and open in photoshop, there is still no padding: https://snag.gy/JsFo1g.jpg

    This is peculiar.

    Plugin Support mbrsolution

    (@mbrsolution)

    Hi, I just carried out a test and I can see the black padding on the top and bottom of the thumbnail image.

    I think your best option for now is to create a thumnail image yourself. Then use a similar shorcode like the one below.

    
[video_lightbox_youtube video_id="G7z74BvLWUg" width="640" height="480" anchor="https://www.yourdomain.com/wp-content/uploads/anchor-image.jpg"]

    Let me know if the above works for you.

    Kind regards

    Thread Starter bernadettetp

    (@bernadettetp)

    I will create my own thumbnail images to fix this. Is there a way to automatically include the play button like it does with auto thumbnail? I do not want to Photoshop it on all the custom thumbnails.

    Plugin Support mbrsolution

    (@mbrsolution)

    Hi, I have submitted a message to the developers to investigate further your question/request.

    Thank you

    Thread Starter bernadettetp

    (@bernadettetp)

    Thank you! I’ll wait right here ??

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Customize Video Auto Thumnail Image’ is closed to new replies.