Community Forums › Forums › Archived Forums › General Discussion › Audio player in menu/navigation
Tagged: audio, menu, navigation
- This topic has 10 replies, 2 voices, and was last updated 9 years, 11 months ago by rschel.
-
AuthorPosts
-
April 25, 2014 at 6:55 pm #102405rschelMember
I am trying to get two audio snippets in the navigation/menu bar one in the as the first item and one as the last. I have tried several different ways and so far nothing is working completely. I need both audio snippets to work independent of each other.
http://willixhypnosis.com/
Any Ideas?April 25, 2014 at 8:42 pm #102409Brad DaltonParticipantYou could float one to the left and one to the right using this code http://www.rfmeier.net/add-a-custom-primary-nav-extras-within-genesis/
April 26, 2014 at 12:25 pm #102484rschelMemberI can't get them to work independently of each other
add_filter( 'wp_nav_menu_items', 'custom_nav_item', 10, 2 );
/**
* Callback for Genesis 'wp_nav_menu_items' filter.
*
* Add custom right nav item to Genesis primary menu.
*
* @package Genesis
* @category Nav Menu
* @author Ryan Meier http://www.rfmeier.net
*
* @param string $menu The menu html
* @param stdClass $args the current menu args
* @return string $menu The menu html
*/
function custom_nav_item( $menu, stdClass $args ){// make sure we are in the primary menu
if ( 'primary' != $args->theme_location )
return $menu;// see if a nav extra was already specified with Theme options
if( genesis_get_option( 'nav_extras' ) )
return $menu;// additional checks?
// append your custom code
$menu .= sprintf( '<li class="welcome-audio">%s', __( 'WELCOME: <audio id="myAudio" <source src="http://willixhypnosis.com/wp-content/uploads/2014/04/welcome-audio-4.19.14-1.mp3" type="audio/mp3"> Your user agent does not support the HTML5 Audio element. </audio> <button type="button" onclick="aud_play_pause()" ></button> <script> function aud_play_pause() { var myAudio = document.getElementById("myAudio"); if (myAudio.paused) { myAudio.play(); } else { myAudio.pause(); } } </script>')
);// return the menu
return $menu;}
and the other audio clip:
( '<li class="spanish-audio">%s', __( 'BIENVENIDA: <audio id="myAudio2" <source src="http://willixhypnosis.com/wp-content/uploads/2014/04/audio-de-bienvenida.mp3" type="audio/mp3"> Your user agent does not support the HTML5 Audio element. </audio> <button type="button" onclick="aud_play_pause()" ></button> <script> function aud_play_pause() { var myAudio2 = document.getElementById("myAudio2"); if (myAudio2.paused) { myAudio2.play(); } else { myAudio2.pause(); } } </script>') );
I either get the spanish or the english welcome and even when I have them both up on the navigation bar.
Plus I am not sure how to get them both into the code for the functions.php I have tried one in the functions.php and the other in a link for the menu via wordpress backend.
confused not sure what's wrong.
April 26, 2014 at 2:03 pm #102499Brad DaltonParticipantPlease don't post raw PHP code in a web page as anyone else who copies it will break their site. Use Github Gists.
April 26, 2014 at 2:25 pm #102503rschelMemberoh, sorry I will try and put it up there shortly.
April 26, 2014 at 3:05 pm #102505April 26, 2014 at 8:01 pm #102523Brad DaltonParticipantYou can add 2 widgets in your nav menu.
Float one to the left and the other to the right and add text widgets to each with the url to your audio which will use the native WordPress audio player.
Some work is required on your behalf.
April 27, 2014 at 1:12 pm #102634rschelMemberFantastic thank you this will work out great
April 27, 2014 at 8:49 pm #102662rschelMemberHow do I get the widget inside of the menu wrap. I can float the widget left or right and it is in the navigation area far left or far right of menu, but not in the center wrap where the menu is. Can't figure how to get it into that area.
April 27, 2014 at 10:58 pm #102679rschelMemberAlmost there I posted what I have in the functions.php file now on gist HERE
Problem: The background of the secondary menu looses it's full width background. I tried moving the structual wrap close code, but with no good results.
April 28, 2014 at 12:01 am #102686rschelMemberI just discovered that the widget is going into a newly created wrap and not the wrap for the navigation, so that won't work either.
-
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.