Since the release of HTML5, audios can be added to webpages using the “audio” tag. Previously audios could be only played on webpages using web plugins like Flash. The “audio” tag is an inline element which is used to embed sound files into a web page. It is a very useful tag if you want to add audio such as songs, interviews, etc on your webpage. To embed audio in AMP pages you have to make use of the amp-audio tag.
Setup: To use the amp-audio, you have to import the amp-audio component into the head of the webpage.
- width: It defines the width of the audio division.
- height: It defines the height of the audio division.
- src: It defines the source of the audio file to be played.
- preload: Sets the preload attribute to the HTML audio tag.
- autoplay: If present automatically starts the audio when the page is loaded.
- muted: If present sets the volume strength to 0 by default.
- loop: If present automatically repeats the audio from starting when it ends.
Apart from the above attributes, there is a special attribute called controlsList which is used to set control for the audio file.
- Google Amp amp-ad
- Google AMP amp-accordion
- How to create Nested Accordion using Google AMP amp-accordion?
- How to create Hidden Header using Google AMP amp-accordion?
- How to create Dynamic Header using Google AMP amp-accordion?
- Google AMP amp-facebook-like
- Google AMP amp-carousel
- Google AMP amp-date-countdown
- Google AMP amp-brightcove
- Google AMP amp-bind-recaptcha
- Google AMP amp-autocomplete
- How to set custom media notification with amp-audio in Google AMP ?
- How to set an image placeholder for amp-anim in Google AMP ?
- How to set audio loop in amp-audio of Google AMP ?
- Google AMP amp-img
- Google AMP amp-image-lightbox
- Google AMP amp-lightbox-gallery
- How to calculate area of circle dynamically using amp-bind-macro in Google AMP ?
- What is Initialize state in amp-bind of Google AMP ?
- How to change/update image size dynamically using amp-bind in Google AMP ?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.