Videos on Wordpress page loading on desktop but not on mobile - wordpress

I have added a couple of videos to a WordPress blog post. When I am loading the page on a desktop, everything seems to be functioning exactly as it should. When I load the same page on my Android phone in Chrome, it always fails to load 1 video. When I refresh, there will always be one video that doesn't show up. Which video this is, changes with every refresh. I also checked on my partner's iPhone with Safari. There, even fewer videos are showing as they should.
All the videos have been added using the elementor plugin and are saved and loaded from my host server. I can't figure out how to solve this problem because I can't figure out what causes this issue to begin with. I have googled a bit and only found solutions regarding auto-play. I haven't set my videos to autoplay, so this doesn't explain why I have problems.
The blog post can be found here.
Any help would be greatly appreciated!

99% it's because of incorrect video codec. I would suggest to re-format videos with Handlebrake prior to uploading. This tool helped me multiple times with problems like this.

Related

Elementor / Videos disapear

I'm Pascal from france.
I developed a WP site with the plugin elementor one year ago.
Everything was fine until, a week ago, my videos disappeared.
Example here : https://maelyneevolution.com/index.php/test2/
What happened ? What changed ? The plugin ? Wordpress (I tried to upgrade it. No changes) ?
Sometimes, we can hear the sound of the video, but no image. Nothing, not even a black square.
Sometimes the video appears and...pfft ! Dissapears.
Any idea ?
The best way to put videos is by 1st uploading them on youtube then you can show that video on your website using embed or by elementor widget
Your server might be slow or you may have used some cache plugin or something that caused the issue. But embedding youtube video will solve your problem.

Wordpress youtube embed not clickable bootstrap

After I moved a Wordpress website to production server I noticed youtube embeds were no longer clickable. The image and play button show up but nothing more.
Tried to renew the embed code, using the build in embed function, embed via media browser,... Nothing is working and it's making me crazy.
After some trial and error things I noticed that the video does work when the main bootstrap.css file is removed. Can't seem to find a clue to the solution though.
EDIT
Yes, I tried to disable all the plugins, with no result.
Changing back to the default twenty fifteen theme results in a working video embed. But since that one isn't build on bootstrap it's just a logic fact.
Anyone seen this before?
Web page with video embedded: click here
The website is sending lots of error messages in he consolu use F12 in Chrome, apparently your www-embed-player-new.js is causing the problem. Not even Edge is running the site correctly. I think you need a Chrome extension to make it work.
I would recommend you changing the plugin that imports the videos. Check this enter link description here
EDIT:
The chrome plugin Google Cast stops the error messages but still doesn't work.
The problem was with the wordpress loop on the single.php page.
A wrong code snippet caused the issue.
Fixed!

Facebook share link UNWANTED image

I have a strange problem and my PM requires me to fix it. None of my colleagues could help me.
I've added a functionality to existing ASP.NET WebForms page. I involves a button to share the link by facebook. But when sharing in someone's profile a strange image of Adobe is appearing:
Undesired Image
It is even more strange that after a few seconds it disappeares. Tried everything - to give a parameter to the facebook URL with images[0], also from the meta tags in the master page. No result. Supposed the facebook may have cached the link, but when I tried from my home PC the result was the same.
Any advice how to remove the adobe pic?

Pinterest Bookmarklet Not Finding Images

I have searched quite a bit for a solution and can't seem to find anything on this topic so I thought I would reach out to this amazing community.
I will try to provide enough context here so that others may be able to see what is going wrong.
Up till a few days ago I have been able to use the standard pinterest bookmarklet to pin images from my blog's main page (Forged Photography) to pinterest. I tried pinning some images today and realized that it is only finding my header image and none of the other content.
It is a wordpress blog and I have deactivated my plugins and changed my theme to eliminate those aspects as a cause and the behavior still remains.
I have uploaded content in two ways:
Uploaded photos via Wordpress and created galleries
Pinterest bookmarklet only finds the header image and the featured gallery image
Embedding images that are hosted on facebook
I can still pin them if I click on individual pictures but I can't pin from the main page of the blog.
When I used to click the bookmarklet from the main page of my blog it used to pull up all of the images contained in all of the posts and enable me to pin them, now it only finds my header image.
Any ideas on what may have happened or what is preventing the bookmarklet from finding the images?
Well, it isn't the answer that I was looking for but it seems to work out. A nice lady reached out to me on Facebook who was experiencing the same issue, turns out Pinterest won't find images that are under 200px...
Doesn't explain why I was able to pin them in the past but now I can't. I am not crazy about the way the thumbnails look # 200px, any other ideas on how to get around this issue?
Try this:
<img src="smallimage.jpg" data-pin-media="largeimage.jpg" />
The bookmarklet should pick up the image you send in data-pin-media. Also worth trying out: data-pin-url, which will make the bookmarklet pin the URL you suggest rather than the URL of the page you're on right now.

Why does our website load so much slower in IE than any other browser?

We have a WordPress website which loads sufficiently in every browser I've tried, except for IE. For some reason in IE, it seems to freeze the browser for a few seconds every single time the page is loaded, doubly so if it has to load a page with an iframe of another page. The user has to wait awhile before they can interact with anything on the page.
Here's the site.
Someone suggested we could use WP Supercache to solve the issue, but I've had problems with this plugin in the past and am reluctant to rely on it, especially since this seems to be only a problem in IE.
What is the best way I can troubleshoot this issue? How do I find out which scripts in the header, or footer, etc. is causing it? Is there a quick way to do so, or do I just need to start eliminating variables within the theme?
I'd don't quite understand why but in IE9 style.css is being pushed right down the page load order - see request #35 http://www.webpagetest.org/result/130327_Y9_f1d5796658d8475b68e2e537644173f1/1/details/
As a browser won't render until it's downloaded the applicable CSS this blocks rendering.
Chrome on the other hand prioritises downloads so that resources that can block rendering are downloaded ahead of images.
Here's a side-by-side video of the two loading experiences.
(If you want help looking at this further my contact details are in my profile)
Thanks to this thread I just found, the answer appears to be fancybox: Fancybox causing slow load times in IE?
Specifically, the IE-specific filters in the CSS file for fancybox. I removed those filter styles, and it loads fine now.
Sorry, I don't seem to be able to give just a comment. Anyway, in Opera 12.14 it works fine. And in Explorer (8) it works just as well, no errors in the console. Just my .1 cent.

Resources