Click Header Icon – Play SoundCloud

Description:

• Click Play icon in Header >> Play SoundCloud >> Play icon turn to Pause icon
• Click Pause icon >> Pause Soundcloud >> Turn pause icon to play icon

#1. Use this code to Code Injection Header

#2. Use this code to Code Injection – Footer to add Play/Pause Icon to Header.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('<div class="play-sc"><i class="fa-regular fa-circle-play"></i><i class="fa-regular fa-circle-pause"></i><div>').insertBefore('a.btn');
});
</script>
<style>
.header-actions.header-actions--right {
    align-items: center;
}
.header-actions-action.header-actions-action--cta {
    display: flex;
    align-items: center;
}
.play-sc {
    margin-right: 1.2vw;
    position: relative;
    width: 30px;
    height: 30px;
}
.play-sc i.fa-regular {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}
i.fa-regular.fa-circle-pause {
    display: none;
}
</style>

#3. Edit Site Footer > Add a SoundCloud

#4. Use this code to Code Injection – Footer, to make SoundCloud play on click Play/Pause icon