Video in Header Position

Hi there,

We love this template and we are wondering if it is possible to place a video in the header portion of the main page instead of an image.

Any help at all would be greatly appreciated!

Hi

Please try to put a video module in header module position and let me know when You will do this, so I'll see how this can be adjusted.

Okay, I have added a video module to the header position and unpublished the default header from the quickstart installation (although it still shows for some reason)... This can be seen at http://dev3.shed-solutions [dot] ca

any suggestions?

Hi

Please try to put a video module in header module position and let me know when You will do this, so I'll see how this can be adjusted.

Hi

Header is showing, because You have a video module there I thought it's a different kind of module, but this one is even better. You may even move this module to "debug" module position and it will work the same.

Now add this code to override.css to remove the background which is covering the video now.

Code: Select all

.frontpage #gkBg,
.frontpage #gkHeader {
    background: none repeat scroll 0 0 transparent;
}


Hi,

We have added the code to override.css and the background image is still showing... we even tried to place the module in the debug position as you suggested but the video only plays at the bottom of the page.

Is there anything else we can try?

Hi

Header is showing, because You have a video module there I thought it's a different kind of module, but this one is even better. You may even move this module to "debug" module position and it will work the same.

Now add this code to override.css to remove the background which is covering the video now.

Code: Select all

.frontpage #gkBg,
.frontpage #gkHeader {
    background: none repeat scroll 0 0 transparent;
}


Hi

Please enable using overrides in template settings.

Okay, we have enabled the css override. There are a few alignment issues still. Could you take a look and let us know your suggestions. Thank you in advance!

Hi

Please enable using overrides in template settings.

Hi

I would propose to use autoplay for the video and use transparent images for food.

Tell me exactly where alignment needs some fixing, I'm a programmer, not a designer, so I have some trouble noticing such stuff

Hi,

The food images and Restaurant text are supposed to be positioned below the header section but are not on top of the video. We would like them below the video... do you know how we would accomplish this?

Hi

I would propose to use autoplay for the video and use transparent images for food.

Tell me exactly where alignment needs some fixing, I'm a programmer, not a designer, so I have some trouble noticing such stuff

Hi

Ok, now I understand. Add this to override.css:

Code: Select all

.frontpage #gkFooter,
.frontpage #gkPageContent {
    background-color: #fff;
}


and this code to /layout/blocks/head.php

Code: Select all

<script type="text/javascript">
   (function($) {
   $(document).ready(function() {
      function checkForChanges() {
         $('.frontpage #gkHeader').height( $(window).height() );

         if( $(window).scrollTop() > $(window).height() ) {
            $('.frontpage #gkHeader #gkHeaderMod').css('display','none');
         } else {
            $('.frontpage #gkHeader #gkHeaderMod').css('display','block');
         }

         setTimeout(checkForChanges, 50);
      }

      $(checkForChanges);
   });
   })(jQuery)
</script>


You may also compare wiht this thread where I was asked about a similar thing: https://www.gavick.com/forums/steak-hou ... 38699.html