Support » Theme: Hueman » Video on the desktop version

  • Resolved andreaas

    (@andreaas)



    Hi ,
    I use the theme is not updated for to include video embed .

    The videos are also shrunk in the desktop version ( over 1200px ) . Now I wish that only in the desktop version ( over 1200px ) the video is displayed in the original size .
    How can I do this ?
    Thanks.

Viewing 10 replies - 1 through 10 (of 10 total)
  • Hi andreaas. Please post a link to your site so we can see the issue. Thanks.

    I can not show my site .

    The original size of my video are: 638×505 px .

    However when I insert the video into the video – DIV video-container, it changes size and becomes about 638x360px.
    How to show the video to the original size only when I do I access from PC and have the screen than 1200px ?

    Well, it’s pretty difficult to troubleshoot if we can’t see the problem. Where exactly is “the video – DIV video-container”? Are you adding a URL? Code for an iFrame? What is the post format? Is this on the home page? A category page? There are many variables that could be affecting the site.

    The video is displayed correctly both on the desktop and on the mobile. But I wish that in the desktop version is not resized but retains its original size.

    The video is in a post. I use the video format and use an iframe. Div video container is the CSS class of your plugin …

    There isn’t any resizing in the embed code in post-formats.php. This is the default theme css applied to an iFrame video container:

    .video-container iframe, .video-container object, .video-container embed, .video-container video {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
    }

    I’d have to see the css on your site to see if there is something else affecting the video.

    This is a test site . I added a random video and I put 638px width and 505px in height .
    http://wonepiece.altervista.org/video-testo-hueman/

    The video has been resized automatically . But I want to show in the desktop version to its original size ( 638×505 ) .

    I don’t know all the details of how iFrames are used so the following is based on what I know about the theme and testing I did using your video from YouTube. The theme looks at the actual video size which, in this case (and it seems most, if not all, YouTube videos) is 560×315. This is a standard video 16:9 ratio. It then uses css to expand the iFrame to 100% of the available content area width, which is 720px. Using the 16:9 ratio expands the height proportionately to 405px. The actual iFrame on the page is created using the dimensions you provide in the embed code. However, the image cannot be displayed beyond 720×405. You can override the default css and set a fixed iFrame container height and width. The theme will apply those dimensions to the iFrame, and the image displayed will expand or contract based on that iFrame size. But the actual size of the container in which the image is displayed won’t go beyond 720×405. So, for example, if you set the iFrame size to 1000×800, the video image would expand to fill that size, but the actual image displayed would appear to zoomed and cropped. If the iFrame css size is less than 720×405 the displayed image will be adjusted down accordingly. Again, I’m basing this only on what I was able to determine in testing. Hope that helps.

    I understand everything, but I do not know ‘to apply what you said 🙂

    I tried to put this code in responsive.css
    @media only screen and (min-width: 1201px) {
    .video-container {height: 140px !important;}}

    I do not know ‘if it works well 🙁

    That’s because this media query, at the top of responsive.css, is missing a closing bracket }

    @media only screen and (max-width: 1200px) {#header-ads {
    float: none !important;}

    Also, just a reminder that anything you put in responsive.css will be lost when you upgrade the theme. You should use a child theme or a css plugin.

    I do not ever update the theme, because disappears the video format 🙂
    Thanks for all.
    Kind regards.

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Video on the desktop version’ is closed to new replies.