0

I am building a wordpress site related to a rare disease that I have. On one page, I am listing a number of videos related to the disease. In total, there are 34 videos. I have the videos embedded into the page and I'm using the and tags to hide the videos until the user clicks the summary link. The issue I'm having is that the videos often don't load, even after clicking the summary link. I'm new to wordpress and not sure if this is a wordpress issue or if it's caused because there's so many videos...or both. Does anyone have any idea what the issue might be and how I might fix it? Thanks.

In case it's helpful to see the site, it's here: https://www.myotoniacongenita.info/?page_id=13

Improve this question

1 Answer 1

Reset to default
0

Firstly - what a great project! Well done on pulling all of this info together.

If I look at the code in your page I can see that the videos are set with a width of 0 and a height of 0. So they are there - just not visible (essentially less than one pixel in size!). These dimensions is sometimes added dynamically but can also be hard coded or controlled in a plugin. How are you adding the embeds - pasting in the code manually or using a plugin?

Tip: If you right click your page in Chrome (or any browser, though they differ slightly) and click 'Inspect' you can see all of the raw code. You can find your iframe elements containing the videos (click inspect when hovering over the summary). If you click/focus on the iframe you will see they are height/width 0. You can actually change these within inspector to see that by adding a suitable width/height you will see the videos - this is not a permanent change, it's just proving a potential solution.

I hope this helps you in tracking down the issue.

Additional - here is what I see in Inspector when I view the iframe. Note the dimensions towards the end of the element.

<iframe title="Myotonia Congenita Simplified" src="https://www.youtube.com/embed/1yiPdaGb-nw?feature=oembed" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" data-ratio="0.5625" data-width="640" data-height="360" style="display: block; margin: 0px; width: 0px; height: 0px;"></iframe>
Improve this answer
9
  • Thank you! The code that I'm using to embed the videos is basically just: [embed]youtube.com/watch?v=KU8q_OmWtY0[/embed] I'm using the classic editor.
    – jplank
    Commented Aug 19, 2020 at 14:14
  • Ok, so thats a standard shortcode in Wordpress and you can add a width and height to it like this: [embed width="123" height="456"]...[/embed] ... however, it looks like you might also have Jetpack installed and it has a Youtube shortcode too. See link below as it has more options. If neither of those work any better I can explain how to add the embed code directly. wordpress.com/support/videos/youtube
    – t2pe
    Commented Aug 19, 2020 at 14:32
  • This is probably a very dumb question, but how do I know what width and height to use? I just want it to appear with whatever the default width and height "ought" to be....If I enter my own values, won't the aspect ratio of the video appear distorted? Not sure if I'm thinking about this the wrong way or not...
    – jplank
    Commented Aug 19, 2020 at 14:52
  • No it's a very fair question and tricky to answer. I'd suggest trying out 640w by 480h if only to prove that the videos are then visible the way you need them to be. Try that with the Jetpack shortcode and if that works there may be something that can be done to make them the right size dynamically.
    – t2pe
    Commented Aug 19, 2020 at 15:01
  • Ok, I gave it a try. The first two links on the page use the different methods. When I used the Jetpack shortcode, it just showed up as text. I don't know if there might be something I need to in order to get Wordpress to recognize the shortcode. I do have Jetpack installed though. I also tried using [embed width="640" height="480"], but still seems like the same issue is happening.
    – jplank
    Commented Aug 19, 2020 at 15:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.