1 Topic by ray (edited by ray 2019-07-01 20:51:47)

  • ray
  • Member
  • Offline
  • Registered: 2019-07-01
  • Posts: 2

Topic: No Audio Start on page opening

Hi Guys
First time user. Loving it so far.
Only problem I have is audio desn't seem to be obeying the autoplay on load command.
I have to manually click the button up top to get it to start

Heres the top section of the config file- any ideas ???

    resizeOnImport="true"
    backgroundUrl="http://excursioncairodaytour.com/wp-content/uploads/2016/09/dbImage.jpg"
    galleryTitle="El Alamein War Cemetery  Tribute Page"
    enableAutoPlay="true"
    autoPlayOnLoad="true"
    autoPlayThumbs="true"
    displayTime="5"
    showAutoPlayButton="true"
    loopAudio="true"
    playAudioOnLoad="true"
    showAudioButton="true"
    audioUrlMp3="2-24th-music.mp3"
    buttonBarHAlign="RIGHT"
    imageClickMode="OPEN_URL"
    audioVolume="5"
    indexPageName="index.html"
    textColor="rgba(255,255,51,1)"
    maxCaptionHeight="150"
    imageTransitionType="CROSS_FADE"
    imageTransitionTime="2"
    captionPosition="BELOW_THUMBS"
    captionHAlign="CENTER"
    showImageNumber="false"

  • Registered: 2012-04-24
  • Posts: 5,924

Re: No Audio Start on page opening

Unfortunately, very recently, desktop browsers have started to block the autoplay of audio (and video).
Firefox, from version 66 onwards, now blocks the autoplay of audio (and a click is required from the user to start the audio).
Likewise, recent versions of Chrome, Opera and Safari also now block the autoplay of audio.
playAudioOnLoad continues to work only in Edge and Internet Explorer 11.

Here are the release notes for Firefox 66 where this change of behavior was first noted: https://www.mozilla.org/en-US/firefox/6 … easenotes/

I have contacted the developers to let them know of this and a note regarding this change should be added to our online support documentation in the next website refresh.

Unfortunately, there is nothing that can be done from within Juicebox to override this new browser functionality.
If a user want to allow the autoplay of audio in a browser, then the browser's settings need to be changed by the user.
Please see this web page for more information regarding Chrome, Firefox and Safari.
Chrome: https://developers.google.com/web/updat … cy-changes
Firefox: https://support.mozilla.org/en-US/kb/block-autoplay
Safari: https://webkit.org/blog/7734/auto-play- … for-macos/

As unfortunate as it is, there is nothing that can be done from within Juicebox to force audio to autoplay in modern browsers any more.

I realise that this may not be the answer that you were looking for but I hope that my notes above at least explain what you have recently been experiencing.

  • ray
  • Member
  • Offline
  • Registered: 2019-07-01
  • Posts: 2

Re: No Audio Start on page opening

Thanks Steve - well that sucks the big hairy one !
Can we look at a button that screams hit me hit me and play my music ?

  • Registered: 2012-04-24
  • Posts: 5,924

Re: No Audio Start on page opening

If you'd like your Audio Button to stand out from the other icons on the Button Bar, you could color it differently by using CSS such as the following. (This example will color the Audio Button red.)

.jb-bb-button.jb-bb-btn-audio {
    color: #ff0000;
}

Put this CSS code at the foot of your gallery's 'jbcore/classic/theme.css' file. (If you put the code in the gallery's embedding page, then the Audio Button will not be colored if/when the gallery is expanded in a new page (for example, on iOS devices).)

This might at least attract some attention and users will hover over the button where they will then see the rollover tooltip text  "Play Audio". If you like, you can change this tooltip text via the languageList configuration option. Please see the International Gallery Text support section for details. (The languageList option was intended for translating the on-screen text into different languages but you can use it to change the messages to whatever you like.)

If you want to actually change the Audio Button icon itself, then this is also possible (but more difficult).
Please check out the Using Custom Icons support section in the Theming Guide for details.

Alternatively, you could create your own Audio Button and place it alongside the gallery on the embedding page.
You would need to use the Juicebox-Pro API (specifically the toggleAudio() method) and knowledge of JavaScript would be required.
Take a look at the Juicebox-Pro API demo gallery here. You'll see that there is a 'Toggle Audio' button to the left of the gallery. You could do something similar for your own gallery's web page. (Check out the source of the demo in your browser to see how it is done.)
Your custom Audio Button does not need to be an HTML button, though. You could make any HTML element (e.g. text or an image) clickable and act like a button.

I hope this gives you some ideas as to how you could make your Audio Button more prominent now that autoplay is becoming less likely to happen (depending on the user's browser).