Sound on youtube video header

Site: https://xplab.savemoz.com, uploading from youtube because video is more that 20MB.
Checked some athemes forum posts, provided solution are not solving issue:

How can sound be enabled on youtube video header?
note: A solution without extra control buttons besides youtube - play/pause, is suitable for now.

Thanks
Timba

Hello Timba,

First thanks for using our Sydney Pro theme!

Unfortunately is not possible have a youtube video with autoplay enabled. This is a browser behavior, that do not allow autoplay videos with sound. The only way is having a play button. My suggestion for you is disable the default sydney video option and then use hooks to add an Youtube iframe. For it please follow the steps below:

  1. First disable the Sydney default video. Go to Appearance > Customize > Header Area > Header Type > Front page header type and check the options No header (only menu)
  2. Go to Appearance > Customize > Hooks > Header > After hero and add the given code below in the box:
    
    <div id="youtube-player"></div>

    <script>
    if( document.querySelector('.home') ) {
        var iframe = document.createElement('iframe');
        iframe.src = 'https://www.youtube.com/embed/0U_wsNAyGPI?autoplay=0&controls=0&showinfo=1&modestbranding=1&loop=0&fs=0&cc_load_policy=0&iv_load_policy=3&autohide=1&rel=0&enablejsapi=1&origin=http%3A%2F%2Flocalhost&widgetid=1';
        iframe.width = '100%';
        iframe.height = 900;
        iframe.frameborder = 0;
        iframe.allowfullscreen = 1;
        iframe.allow = 'accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture';

        document.querySelector('#youtube-player').appendChild(iframe);

    }
    </script>
    

3.Go to Appearance > Customize > Additional CSS and add the given custom CSS code below:

.header-clone {
	height: 0 !important; 
}

This will create the same video as before (with default Sydney options), but now without autoplay, with the play button and with sound.

We hope this helps!

Kind Regards,

Rodrigo,

aThemes Support

Hello Rodrigo,

Thanks for your reply.

  1. There are no hooks option under installed Sydney Pro theme Appearance --> Customize, as per attached image, how to enable?

  2. " This is a browser behavior, that do not allow autoplay videos with sound". Is this affirmation valid also for WP locally loaded videos?

Regads
Timba

Hello Timba,

  1. Please make sure you have the latest version of Sydney Pro (2.1.2). So you will see the Hooks like in the image below:
  2. Even with locally WP videos the autoplay with sound is not allowed. Please learn more on this article:
    https://developers.google.com/web/updates/2017/09/autoplay-policy-changes

We hope this helps!

Please try that and let us know if you need further assistance.

Kind Regards,

Rodrigo.

aThemes Support

Hi Rodrigo,

I am facing issue trying to update sydney pro version: Appearance --> Theme --> (Sydney Pro) update now
“Update failed: The update cannot be installed because we will be unable to copy some files. This is usually due to inconsistent file permissions.”
could you please help, identify which files should change permission to make successful update?
I have access to site directories.

Regards
Timba

Hi Rodrigo,

Above Sydney Pro update error was corrected, changing temporary permissions of site dirs to 777,
root@mail:/var/www/xplab.savemoz.com# chmod -R 777 public_html/

update Sydney
then set back to previous permission.
root@mail:/var/www/xplab.savemoz.com# chmod -R 755 public_html/

After following provided instruction - use hooks to add youtube iframe, following questions comes:

  1. Opening website video is full screen as expected, after 1st play video minimizes, as per attached image. how to keep this video full screen even after 1st play?
  2. Second click on video, opens in new youtube tab. howto stay in same website, after clicking play?
  3. How to remove displayed info on video such has, Youtube logo on video start and number of views?

    Regards
    Timba

Hi Tima,

  1. I did a inspection in your website and seems that you already solved the issue with small video, right ?
  2. Can you please confirm if this still happens ? In my test here when I click, the video pause.
  3. Inspecting your website I am seeing only the youtube logo at bottom right corner. But this is something that youtube do not allow to remove. At really, the logo only appears when the video is at initial state (with play button), when we pause the video and when the video is playing and we mouseover the video.

Hope this helps!

Let me know if you have more questions.

Kind Regards,

Rodrigo.

aThemes Support

Hi Rodrigo,

Thank you, all questions clarified.

Regards
Timba

Hello Timba,

Great!

If you are satisfied with our theme and support, would be great if you leave your comment and rating in the offical WordPress Themes repository. That helps us a lot: https://wordpress.org/support/theme/sydney/reviews/#new-post

Let us know if you have more questions.

Kind Regards,

Rodrigo.

aThemes Support