WordPress.org

Ready to get started?Download WordPress

Forums

Jetpack by WordPress.com
[resolved] Photon is stripping out video embed code in 2.1.1 (30 posts)

  1. Chris
    Member
    Posted 1 year ago #

    I recently updated Jetpack to version 2.1.1 and noticed that when I have Photon turned on, some videos are displaying smaller than usual. I looked at the source code and saw that the height/width properties of the embed code were getting stripped out. What's weird is that this isn't happening on every video embed, just some. Any idea what's going on? Here are some examples:

    Normal video embed:
    http://batman-news.com/2012/12/20/the-dark-knight-rises-was-2012s-most-viewed-movie-trailer/

    Small video embed:
    http://batman-news.com/2012/12/17/batman-the-dark-knight-returns-part-2-blu-ray-details/

    If I deactivate Photon, that second example will go back to its original size (600x338) and the width/height will be restored in the source code.

    http://wordpress.org/extend/plugins/jetpack/

  2. Chris
    Member
    Posted 1 year ago #

    Also (I'm not sure if this is related) Photon seems to be skipping some images now with the latest update. For example, the first image of Bane in this post isn't being served through Photon:

    http://batman-news.com/2012/12/31/the-dark-knight-rises-the-biggest-stories-of-2012/

    but if you go to the homepage (http://batman-news.com/) and view the image (it's about the 3rd article down) it is being served with Photon.

  3. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    when I have Photon turned on, some videos are displaying smaller than usual.

    Do you use shortcodes to embed your videos, or do you paste the youtube URL on a separate line?

    Photon seems to be skipping some images now with the latest update

    I noticed that you used your own CDN to serve this image. When you deactivate your CDN and serve all images through WordPress and Photon, do you still experience the issue?

  4. Chris
    Member
    Posted 1 year ago #

    Do you use shortcodes to embed your videos, or do you paste the youtube URL on a separate line?

    I typically just copy the embed code from YouTube. This is what I'm using in the example with the small video:
    <iframe width="600" height="338" src="http://www.youtube.com/embed/0zhWpgvmnYE?rel=0" frameborder="0" allowfullscreen></iframe>

    I noticed that you used your own CDN to serve this image. When you deactivate your CDN and serve all images through WordPress and Photon, do you still experience the issue?

    I just disabled my CDN, but the photo still isn't being served by Photon:
    http://batman-news.com/2012/12/31/the-dark-knight-rises-the-biggest-stories-of-2012/

    If it helps, these problems started happening with the new 2.1 update. Thanks!

  5. Chris
    Member
    Posted 1 year ago #

    Here's another example of the video width/height getting stripped out with Photon active:
    http://techyourworld.com/2013/01/subyou/

    <a class='sublime' href=''><img src="http://i0.wp.com/techyourworld.com/wordpress/wp-content/uploads/2012/06/10.jpg?resize=625%2C247" alt="10" class="alignnone size-full wp-image-4640" /></a><video class='sublime zoom' style='display:none;' preload='none' data-settings='youtube-id:J9DlV9qwtF0' >
    </video>
    
    <a class='sublime' href=''><img src="http://i0.wp.com/techyourworld.com/wordpress/wp-content/uploads/2012/06/10.jpg?resize=625%2C247" alt="10" class="alignnone size-full wp-image-4640" data-recalc-dims="1" /></a><video class='sublime zoom' style='display:none;' width='1280' height='720' preload='none' data-settings='youtube-id:z5Humz3ONgk' >
    </video>

    In the source code, the width and height attribute are gone in the first video tag. But when I deactivate Photon they come back.

  6. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    I tried to reproduce the issue with the same video on a test blog of mine, but I get standard size videos in all cases:

    • when copying the embed code from Youtube: <iframe width="600" height="338" src="http://www.youtube.com/embed/0zhWpgvmnYE?rel=0" frameborder="0" allowfullscreen></iframe>
    • When using WordPress oEmbed feature and pasting the video URL on a separate line: http://www.youtube.com/watch?feature=player_embedded&v=0zhWpgvmnYE
    • When using Jetpack Video shortcode: [youtube=http://www.youtube.com/watch?v=0zhWpgvmnYE&w=600&h=338]

    Could you copy the contents of the Text tab in your post editor, like so:

    • Open an affected post in the editor.
    • Switch to the text tab for the editor.
    • Reload the page.
    • Copy the post content into Pastebin.

    You can then post the pastebin here, or send it to us via this contact form:
    http://en.support.wordpress.com/contact/?jetpack=needs-service

    It could help me understand why I can't reproduce the issue on my test blog.

    Thanks!

  7. Chris
    Member
    Posted 1 year ago #

    Sure, here it is:
    http://pastebin.com/u00WjLtj

    It's weird because it seems random, I don't notice a pattern.

    This post displays fine:
    http://batman-news.com/2012/12/20/the-dark-knight-rises-was-2012s-most-viewed-movie-trailer/

    But Photon strips the width/height properties out of this post, causing the video to be smaller:
    http://batman-news.com/2012/12/17/batman-the-dark-knight-returns-part-2-blu-ray-details/

    The same thing is happening with Photon not serving images for some posts. Photon works fine on the main image here:
    http://batman-news.com/2013/01/07/michael-keaton-wanted-batman-forever-to-be-more-like-batman-begins/

    but Photon isn't serving the main photo here:
    http://batman-news.com/2012/12/31/the-dark-knight-rises-the-biggest-stories-of-2012/

    This all was introduced in the 2.1 Jetpack update. Thanks for looking into it, hopefully we can track down the issue.

  8. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    Thanks for all the additional details! We'll have a look at it and keep you updated as soon as we can address the issue.

  9. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    Thanks again for all the reports. We have now fixed the issue:
    http://plugins.trac.wordpress.org/changeset/651158

    The fix will be available in the next Jetpack release.

  10. Chris
    Member
    Posted 1 year ago #

    That's great, thanks!

    Should I open a new thread for the issue of Photon not being used on some posts?

  11. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    My bad, I missed that second issue of yours.

    We would need a bit more information about this. Could you do the following:

    Thanks!

  12. Chris
    Member
    Posted 1 year ago #

    No problem, here's some more info:

    Photon works in this post:
    http://batman-news.com/2013/01/07/michael-keaton-wanted-batman-forever-to-be-more-like-batman-begins/

    Here's the content from the post screen:
    http://pastebin.com/ktMfgBFy

    Photon is not working in this post:
    http://batman-news.com/2012/12/12/possible-batman-cameo-in-man-of-steel-christopher-nolan-wont-deny-it/

    Here's the content from the post screen:
    http://pastebin.com/SZgdktL0

    Unfortunately I don't notice a pattern. There are a lot of posts where Photon works fine, but many others where it's simply not serving up images. This issue popped up in the 2.1 update.

  13. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    Thanks! We'll have a look at it.

    Could you post a list of the active plugins on your site, so we can see if any of them could conflict with Photon?

  14. Chris
    Member
    Posted 1 year ago #

    Sure, here they are:

    AddThis Social Bookmarking Widget 3.0.2
    Better Recent Posts Widget 1.1.4
    Chartbeat 1.4
    Contact Form 7 3.3.2
    Digg Digg 5.3.0
    Disqus Comment System 2.74
    Fanciest Author Box 1.0
    Google Analytics for WordPress 4.2.8
    Jetpack by WordPress.com 2.1.1
    MCE Table Buttons 2.0
    MediaElement.js - HTML5 Audio and Video 2.9.1
    NextGEN Gallery 1.9.10
    NextGEN Gallery Optimizer 1.1.2
    nrelate Related Content 0.51.4
    Photo Galleria 0.5.1
    Polldaddy Polls & Ratings 2.0.17
    Simple Image Size 2.3.1
    SublimeVideo - HTML5 Video Player 1.5.2
    W3 Total Cache 0.9.2.5
    Widget Logic 0.56
    WordPress SEO 1.3.4.3
    WP HTML Author Bio 1.0
    wpSpoiler 1.2
    WP to Twitter 2.5.5

  15. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    @Eminemdrdre00

    Could you try to disable your CDN again, as well as W3 Total Cache? We tried to reproduce the issue, and we think the problem might be linked to the way W3 Total Cache handles CDN rewrites.

    Thanks!

  16. Chris
    Member
    Posted 1 year ago #

    Hey Jeremy,

    Unfortunately my host doesn't allow me to disable W3 Total Cache. I don't think it's an issue with the CDN because Photon works on all images except for that main image on my single posts. The same image that doesn't work on single posts, works great with Photon on the home page. This was introduced with the 2.1 Jetpack update, in previous versions Photon worked fine throughout my entire site.

    I really appreciate all off your help, but I think I'm going to disable Photon for a few weeks. I'm switching to a new WordPress theme in early February so I'll activate Photon again once that's installed and see if it works properly. I'll create a new thread if I continue to have a problem.

    Thanks again, and thanks for even offering a service like Photon. That's the feature that got me to install Jetpack. Having a free, fast CDN and the ability to serve up Retina images is a huge plus for a website owner like me!

  17. Chris
    Member
    Posted 1 year ago #

    Hey Jeremy,

    I just updated to Jetpack 2.1.2 and Photon is still stripping out the "width" and "height" properties.

    http://techyourworld.com/2013/01/subyou/

    I'm using this shortcode:

    [sublimevideo-lightbox settings="youtube-id:J9DlV9qwtF0" width="1280" height="720"]<img src="http://techyourworld.com/wordpress/wp-content/uploads/2012/12/903271.png" />[/sublimevideo-lightbox]
    
    [sublimevideo-lightbox settings="youtube-id:z5Humz3ONgk" width="1280" height="720"]<img src="http://techyourworld.com/wordpress/wp-content/uploads/2012/12/882215.png" />[/sublimevideo-lightbox]

    and it's outputting this HTML:

    <a class='sublime' href=''><img src="http://techyourworld.com/wordpress/wp-content/uploads/2012/12/903271.png" /></a><video class='sublime zoom' style='display:none;' preload='none' data-settings='youtube-id:J9DlV9qwtF0' data-settings='autoresize:fit; on-end:stop'>
    </video>
    
    <a class='sublime' href=''><img src="http://i0.wp.com/techyourworld.com/wordpress/wp-content/uploads/2012/12/882215.png?w=625" data-recalc-dims="1" /></a><video class='sublime zoom' style='display:none;' width='1280' height='720' preload='none' data-settings='youtube-id:z5Humz3ONgk' data-settings='autoresize:fit; on-end:stop'>
    </video>

    Notice the first one doesn't have "width" or "height" properties, and the image isn't being served by Photon either. If I disable Photon, the "width" and "height" properties are back in the page. Any ideas?

  18. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    Thanks for the report.

    What happens when you use oEmbed to insert the video, or when you use the Jetpack shortcodes?

    oEmbed: Try inserting this on a separate line in the Editor:
    http://www.youtube.com/watch?v=J9DlV9qwtF0

    Jetpack shortcode:
    [youtube=http://www.youtube.com/watch?v=J9DlV9qwtF0&w=1280&h=720]

  19. Chris
    Member
    Posted 1 year ago #

    I can't use oEmbed in this example, I'm using the SublimeVideo HTML5 player plugin:
    http://wordpress.org/extend/plugins/sublimevideo-official/

    In this example I have two videos with the same shortcodes.

    [sublimevideo-lightbox settings="youtube-id:J9DlV9qwtF0" width="1280" height="720"]<img src="http://techyourworld.com/wordpress/wp-content/uploads/2012/12/903271.png" />[/sublimevideo-lightbox]
    
    [sublimevideo-lightbox settings="youtube-id:z5Humz3ONgk" width="1280" height="720"]<img src="http://techyourworld.com/wordpress/wp-content/uploads/2012/12/882215.png" />[/sublimevideo-lightbox]

    The width/height gets stripped out of video #1. Video #2 works fine, the width/height is still there.

    <a class='sublime' href=''><img src="http://techyourworld.com/wordpress/wp-content/uploads/2012/12/903271.png" /></a><video class='sublime zoom' style='display:none;' preload='none' data-settings='youtube-id:J9DlV9qwtF0' data-settings='autoresize:fit; on-end:stop'>
    </video>
    
    <a class='sublime' href=''><img src="http://i0.wp.com/techyourworld.com/wordpress/wp-content/uploads/2012/12/882215.png?w=625" data-recalc-dims="1" /></a><video class='sublime zoom' style='display:none;' width='1280' height='720' preload='none' data-settings='youtube-id:z5Humz3ONgk' data-settings='autoresize:fit; on-end:stop'>
    </video>

    If I disable Photon, both of them work as expected and no code is stripped from page.

  20. ecarmi
    Member
    Posted 1 year ago #

    I just updated Jetpack to 2.1.2 and this issue is still occuring. Was it supposed to be fixed in 2.1.2? Or is it still in the works?

  21. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    We have just added one more fix to the development version of Jetpack, available here:
    http://downloads.wordpress.org/plugin/jetpack.zip

    Could you both try to install this development version, and let me know if this helps?

  22. Chris
    Member
    Posted 1 year ago #

    Just tried the development version but it didn't fix the problem.

  23. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    I ran some tests and tried inserting HTML5 players of different sizes; I also tried inserting videos with Jetpack Shortcodes, and the size parameters were always available.

    Are you able to reproduce the issue with other videos, or just with this one?
    http://www.youtube.com/watch?v=J9DlV9qwtF0

  24. ecarmi
    Member
    Posted 1 year ago #

    So I was troubleshooting the exact occurance of this problem, and it does occur or not occur whenever Photon is enabled/disabled, but the circumstances are very specific. In other words, the post content needs to be the following for the iframe attributes to be stripped:

    A paragraph with a <a href="http://test.com/">link</a>.
    
    <iframe src="http://www.youtube.com/embed/u9ie7k3orPc" height="480" width="640" frameborder="0"></iframe>
    <iframe src="http://www.youtube.com/embed/ZFdqCjefcno" height="480" width="640" frameborder="0"></iframe>
    
    [nggallery id=100]

    This post was using nextgen gallery, which I don't think really matters to much, but when I remove the gallery snippet, the iframe attributes work fine, even with Photon enabled. Also, if I take out the link in the paragraph above, it works fine. So it's just like some weird off case in the above snippet. So not sure how this is effecting everything. If my issue is separate from Eminemdrdre00 I can start a new thread.

    In other words, can you try an install with nextgen gallery (I'm using version 1.9.10) and the example I used above to see if you can reproduce.

    It happens with different videos, not just the thing example above.

  25. Chris
    Member
    Posted 1 year ago #

    @Jeremy

    It's happening with every video. I just changed the shortcodes so that they're both exactly the same, video and all:

    http://techyourworld.com/2013/01/subyou/

    [sublimevideo-lightbox settings="youtube-id:z5Humz3ONgk" width="1280" height="720"]<img src="http://techyourworld.com/wordpress/wp-content/uploads/2012/12/903271.png" />[/sublimevideo-lightbox]
    
    [sublimevideo-lightbox settings="youtube-id:z5Humz3ONgk" width="1280" height="720"]<img src="http://techyourworld.com/wordpress/wp-content/uploads/2012/12/903271.png" />[/sublimevideo-lightbox]

    But this is the HTML being outputting with Photon activated. It's still stripping the width/height out of the 2nd video:

    <a class='sublime' href=''><img src="http://i2.wp.com/techyourworld.com/wordpress/wp-content/uploads/2012/12/903271.png?w=625" /></a><video class='sublime zoom' style='display:none;' preload='none' data-settings='youtube-id:z5Humz3ONgk' data-settings='autoresize:fit; on-end:stop'>
    </video>
    
    <a class='sublime' href=''><img src="http://i2.wp.com/techyourworld.com/wordpress/wp-content/uploads/2012/12/903271.png?w=625" data-recalc-dims="1" /></a><video class='sublime zoom' style='display:none;' width='1280' height='720' preload='none' data-settings='youtube-id:z5Humz3ONgk' data-settings='autoresize:fit; on-end:stop'>
    </video>
  26. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    Thank you both. We'll have a look at it, try to reproduce, and work on a fix. I will keep you posted in this thread!

  27. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    We have made one more fix. Could you try to install the development version of Jetpack on your sites, and let me know if this helps?
    http://downloads.wordpress.org/plugin/jetpack.zip

  28. Chris
    Member
    Posted 1 year ago #

    That worked! Thanks a lot Jeremy. I appreciate all your help!

  29. ecarmi
    Member
    Posted 1 year ago #

    Hi Jeremy,

    I've just tested that development version and it fixed my issue. Many thanks!

    Evan

  30. wordmess
    Member
    Posted 1 year ago #

    gorgeous. works for me too. :)

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.