Showing results for 
Show  only  | Search instead for 
Did you mean: 
Community Participant

Embedded audio playback wihtout default thumbnail

Is there a way to add CANVAS embedded media player without the default thumbnail?

I want to use different icon image for audio to open embedded playback. We don't want students to download audio file.


Tags (1)
8 Replies
Community Champion

Hi  @sanida_supochta  - This comes up from time to time in our Community, and the short answer for both is, I believe, "no."  For a bit of past discussion on a similar topic (I realize it's mostly on video rather than audio) you may want to check here:

and here:

Audio files, I must say, look a bit trickier to download for the average user than the video files, since I noticed just now that even Chrome does not offer the ability to right-click and save the file, unlike it does for the Canvas-based videos.  But nevertheless, there is simply no way to ever guarantee the prevention of downloading of media files on the web, especially with all of the various browser extensions that are out there which allow one to do it.

As for the audio file icon, I'll leave it to others to discuss the ability to perhaps do that behind the scenes somehow, but I really do not think it is possible.

Community Participant

Thanks  @kblack  I found Canvas audio link size forum very helpful. 

I can now resize and add icon image I want by using the following code:

span.media_comment_thumbnail {
width: 50px !important;
height: 50px !important;
border-radius: 50%;
background-image: url("Image.jpg");

span.media_comment_thumbnail_play_button {
width: 50px;
height: 50px;
background-image: url("image.jpg");
background-size: 100%;

The result is as below.

256866_Screen Shot 2017-10-16 at 2.02.44 PM.png

However, I want the text to be next to the thumbnail - instead of above. I'm wondering if anyone knows how to do this. 

 @sanida_supochta ‌, I see you've tagged the‌, and am inferring that you want their eyes on the discussion, so I've shared this with that group. For future reference, you can share a discussion or question with any group of which you're a member by clicking on the Share link at the upper right of the page and typing in the group name. This has the effect of getting additional experts' eyes on a discussion while keeping responses unified in a single thread.

Thanks stefaniesanders. For some reason I can't share to CANVAS Developers group. The option is greyed out. I'm  new to CANVAS Community so not sure why it's greyed out on me. I'm currently following this group.

Community Participant

OK. My workaround to change play button icon doesn't go well. It also changes icon and size for video as well. *sign*

 @sanida_supochta , you'll need to join the group, not just follow it, in order to post content or share to the group. To join a group, navigate to the group home page and select Join Group from the Actions dropdown you'll see at the upper right of the page.

Community Coach
Community Coach

 @sanida_supochta ,

We are giving the Canvas Admins area a little bit of love (especially questions that are really, really old) and just want to check in with you.  This will also bring this question new attention. 


Were you able to find an answer to your question? I am going to go ahead and mark this question as answered because there hasn't been any more activity in a while so I assume that you have the information that you need. If you still have a question about this or if you have information that you would like to share with the community, by all means, please do come back and leave a comment.  Also, if this question has been answered by one of the previous replies, please feel free to mark that answer as correct.