Navigation
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • #1344019
    fearofpudding
    Participant

    Hi Guys,

    Attempting to use X-theme video post to host a mp4 video (hosted on s3).

    When I load the page, the video shows for about half a second, then disappears. I can’t seem to find any troubleshooting on this.

    Affected URL: http://www.newmeta.agency/money-time-two-sides-of-the-same-coin/

    Help please!

    ~Ben

    #1344021
    fearofpudding
    Participant

    Versions:
    X-Theme: 4.64
    Cornerstone (not being used in this post): 1.3.3

    #1344370
    Lely
    Moderator

    Hello Ben,

    Thanks for posting in.
    Your site is on http and you’re calling a secured video on https.
    Instead of adding https://s3-ap-southeast-2.amazonaws.com/newmeta/ben/time-video-webopt.mp4 try //s3-ap-southeast-2.amazonaws.com/newmeta/ben/time-video-webopt.mp4

    Hope this helps.

    #1345789
    fearofpudding
    Participant

    I’m not sure why http or https for the video resource would make any difference, but changed to HTTP and it still has the same problem.

    #1345895
    Rue Nel
    Moderator

    Hello There,

    Thanks for updating in! It appears that you are using mpeg4 video or .m4v. Please keep in mind that this format actually, is also a common video container just like MP4 and AVI. Apple developed this format to encode TV episodes, movies, and music videos in the iTunes Store. The M4V video container is close to the MP4 with the same MPEG-4 video codec, except for the FairPlay DRM copy protection from Apple.

    I would highly recommend that you use HandBrake (https://handbrake.fr/) and convert your video to a .mp4, .webm or .ogv format. These are the only video formats that is web standard and cross browser compatible.

    Hope this explains it briefly.

    #1345955
    fearofpudding
    Participant

    Hi Guys,

    The video is encoded correctly for a HTML5 container. Has already been re-coded for mp4 using handbrake.

    I just renamed the mp4 to m4v to see if that was it.

    So just to clarify, neither mp4 or m4v works. Neither http or https works.

    ~Ben

    #1345958
    fearofpudding
    Participant

    The only other time I’ve had issue with video in the past (not your theme) was mimetype settings out of S3. I have it currently set to video/mp4.

    #1345962
    Rue Nel
    Moderator

    Hello There,

    Thanks for the updates! This time around as I have check your video link which has filename.m4v even if you set the mimetype, this video will still not visible in most browser. To fully understand the supported video format in most browser, please check this out:
    http://www.w3schools.com/html/html5_video.asp
    https://developer.mozilla.org/en-US/docs/Web/HTML/Supported_media_formats

    Hope this helps.

    #1345972
    fearofpudding
    Participant

    No, I think you misunderstand. The video is encoded mp4, using handbrake (mp4 container, h264 encoded video) (see original post).

    Seeing as mp4 and m4v are essentially the same, and the x-theme asks for a .m4v (see screenshot), I thought i’d test a m4v extension. That didn’t work.

    I’ve changed it back to mp4 now (which is how it was originally done).

    Just to be super clear, if I use any other wordpress plugin or embed, the video works fine.

    ~Ben

    #1345979
    fearofpudding
    Participant

    and… if I just use basic HTML container embed code:
    <video autoplay>
    <source src=”https://s3-ap-southeast-2.amazonaws.com/newmeta/ben/time-video-webopt.mp4″&gt;
    </video>

    it works.

    So i’m convinced this is not an issue with the video or it’s encoding.

    #1345986
    Rue Nel
    Moderator

    Hello There,

    I can see now that you are using .mp4 format. One thing also to consider is the file size of your video. If this is a 1080P video, chances are, it would be a big filesize video. Please keep in mind that the browser has to buffer before displaying the vide.

    I would also explain what is display when you first load the page. It is the video poster image that is loaded first. As soon as the browser starts buffering, the poster images disappears and the video should start to play as long as it is already buffered by the browser.

    By the way, since you are using Hummingbird Cache, please clear your plugin cache before testing your site. This can cause the changes to not take place on the front end. It will eventually show up when the cache regenerates, but it’s not ideal if you’re looking to see your changes immediately. Caching plugins are best to turn on only when you’ve finished building the site.

    Hope this helps.

    #1345990
    fearofpudding
    Participant

    Ok. Seems like its just going to be easier to use an external player. The video is 200mb, not tiny, but the external player has no issues loading this up and playing it immediately.

    It’s definitely not a caching/buffering issue… I”m seeing zero network transfer.

    So if you’re saying it simply shows a blank area while loading the video, that’s not going to work. I’ll just deal with using an external player.

    Is there something I can do to disable featured image on a post so it doesn’t show up? That way I can use the external player and hide the featured image, solving both my issues.

    #1345991
    fearofpudding
    Participant

    For your reference, the current page is now setup as a normal post, with external video player… you can see it works just fine. Just need to hide the featured image.

    #1345995
    Rue Nel
    Moderator

    Hello There,

    Thanks for updating in! To hide the feature image in your single blog post, you can add this under Custom > CSS in the Customizer.

    .single-post .x-main .hentry .entry-feature {
      display: none !important;
    }

    Hope this helps.

    #1345996
    fearofpudding
    Participant

    Does that hide ALL featured images?

    I only want to do it on select posts (the ones with videos).

  • <script> jQuery(function($){ $("#no-reply-1344019 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>