I was writing a post about the importance of including images in posts with embedded video’s recently and discovered a great little “hack” to hide said images so that only the thumbnail would show up when shared. This post is the result of that discovery, it solved a long standing issue that I had with video only posts. If you also had come across this issue the video tutorial in particular will be very valuable. There is actually a hidden image immediately after this paragraph, view the page source if you want to see it or watch the video to see how it was done.
The problem with embedded video posts
Posts with only embedded video and no pictures do not display as nicely when shared on Facebook, Linked In and other similar sites. For example, when I share a post without an actual image included, these are my thumbnail choices:
None of these are appropriate in most cases as they do not represent what I am posting about. The thumbnail should represent what the post is about, here is a good example:
In the example above the image represents the 2 Year Anniversary of Waxing Unlyrical (Shonali – that’s 3 days in a row, inside joke sorry readers). With the two candles you really get the gist of what the post is about before reading it, the image ties in perfectly with the title and what the post is about. The example above is clean and professional.
The solution is simple – an appropriate but hidden image, this video will show you how you do it:
Three days in a row? That must be some kind of record, Joe. :p Thanks!
Great tip. Of course, I don’t use video nearly as much as you do, but I will try this the next time I do. You’ve probably noticed that I use at least one image with every post; part of it is to do with the way my blog theme is structured – the font, etc., is relatively small, and I like using an image at least at the start of the post to try to illustrate what the post is about. When I post them to Facebook, I too have to use the “link” option, and then FB will give me an option of images to use as the thumbnail. Then I just click through to the one that is related to the post.
@Shonali ironically Shonali I was looking at other examples and yours really was best. So in spite of my effort to mix things up you win again. 😉
What do you think of the video format I am using? Any feedback?
@hackmanj Hey, it’s not a competition, Joe. 🙂 I’m VERY glad mine was the best example you could find, though!
I really like your video format. The only thing I would suggest is that you try to keep them a little bit shorter (not that they feel long) – maybe to 3 minutes or so? When I look for video tutorials on YouTube, I invariably stay away from the ones that I think are too long, because I want to get to it and move along.
The other thing I’d suggest you consider doing is doing a companion step-by-step written tutorial with screengrabs, though I think one of the reasons you’re doing the videos is to save time. I personally really like those kinds of tutorials, because often I just don’t want to watch a video, I want to see quick instructions that I can try to use immediately and simultaneously. It’s tough to do that with a video, you might miss something, have to rewind, etc.
Btw, are we still using the word “rewind”? sky pulse media Are you down with “rewind”?
Hey Joe, this is a neat trick. Because of the magazine theme I use, I never do a post without an image on my main blog, so I haven’t run into this scenario yet, but I will certainly share it. Thank you.
@Ileane thanks Ileane, what Theme do you use?
@Shonali awesome, I love the feedback, definitely some great suggestions. Thanks for taking the time to respond. 🙂
Time is a huge factor for me for sure!
@hackmanj The theme is Magazine Premium. One of the cool features is a slide show gallery of post images in the header. I have it turned off for now, but once I set it up, I’ll need to have some high quality images from recent posts for the slide show. I really like the theme and my daughter uses the basic version of the same one.
@Ileane I am always on the lookout for good WP themes, thanks. Your daughter blogs? How fun!
The problem you address is real, but this hack is really not nice. Resizing the image is a waste of CPU time.
I think a better solution is to add style=”display:none” to the thumbnail image. Or even better, to place create a CSS class for that.
The problem you address is real, but this hack is really not nice. Resizing the image is a waste of CPU time.
I think a better solution is to add style=”display:none” to the thumbnail image. Or even better, to place create a CSS class for that.
The http:// is added by Livefyre without my consent
style=”display:none”
@regis great idea Regis, have you tested this to verify that Facebook, etc, will still display the thumbnail? Maybe a video response is in order, I’d be happy to add it to the post. Thanks for taking the time to share your insight on this.
@hackmanj Yes, I didn’t want to look like a fool, and I have proofed this idea before submitting my comment.
@hackmanj Yes, before submitting my comment, I checked this implementation for facebook. However, since you ask, it seems Google buzz don’t see the image. Where else can I try?
@hackmanj Yes my daughter has a fashion blog and she’s on Amplify too! Actually she is the one that got me into blogging in the first place. Check out her blog when you get a chance http://blog.estavamorioka.com
Let me know what you think! Thank you.
@Ileane you just inspired another blog post Ileane, stay tuned 🙂
I will check out your daughters blog in the process, thanks!
@regis thanks Regis, I will definitely update the post to reflect this option, perhaps even do a follow up video. Where should I point people when I credit you as the source?
This is nice trick but my question will go to magazine layout templates. How we can use this same picture (hiden one) to be shown on our post thumbnail on homepage and also in slider? Is there any wordpress template or any trick to auto insert thumbnail from embedded picture or even from embedded video on home page? @Ileane
http://www.techdial.in>> here, we will provide you with latest techo tips and tricks, latest techno news and gadget updates.tech tricks,gadgtes,hacking tricks,tips and tricks,latest tech updates,gadgets reviews if you wanna exchange links with our website contact us at owner@techdial.in