To add a button that plays a Sound in Squarespace, you can follow these.
#1. First, use the Squarespace ID Finder tool to find the ID of the Button
In my example we will have:
- #block-yui_3_17_2_1_1719049347948_6407
#2. Use this code to Page Header Code Injection (the page where you use Button)
Replace the ID in the code with your button block ID.
<audio id="player" src="https://www.madisonrowe.com/s/bossa-baden.mp3"> </audio>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
jQuery(document).ready(function() {
var playing = false;
jQuery("#block-yui_3_17_2_1_1719049347948_6407").click(function() {
if (playing == false) {
document.getElementById("player").play();
playing = true;
} else {
document.getElementById("player").pause();
playing = false;
}
});
});
</script>
#3. Replace the Audio URL in the code with your audio URL.