All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

How To Embed Audio Files In HTML

Last Updated : Mar 11, 2024

How To Embed Audio Files In HTML

In this tutorial we will show you the solution of how to embed audio files in HTML, in html there is also a method in which you able to embed audio files. In our previous article, we define that how we are able to insert audio files in html with the help of notepad.

In that session we also touch the concept of embed audio files, but not in brief. So, in this article we talk about how to embed audio files in html. We hope that you will understand the articles deeply.

Step By Step Guide On How To Embed Audio Files In HTML :-

Now, in previous session we define four ways with the help of which you are able to insert audio files in html. But in this article, we help you to embed audio files in html.

There are three ways with the help of which you are able to embed audio files in html. In next example we show you what are the ways and how to use them in html.

<!DOCTYPE html>
      <html>
        <head>
          <title> Title of the document<title>
	  </head>
	  <body>
<!-- first one is simple audio tag, which you can use to insert audios -->
    <audio src="Rich Dad Poor Dad Audio Book in Hindi(MP3_320K).mp3" controls>

    </audio>
    <br><br>
    <!-- the below is object tag used to open audio files  -->
    <object data="Rich Dad Poor Dad Audio Book in Hindi(MP3_320K).mp3" type=""></object>
    <br><br>
    <!-- here we embed the required audio files in html using embed tag -->
    <embed src="Rich Dad Poor Dad Audio Book in Hindi(MP3_320K).mp3" type="">
    <br><br>
        <!-- this below is used to add more than one audio files in html -->
    <audio controls>
        <source src="Rich Dad Poor Dad Audio Book in Hindi(MP3_320K).mp3">
        <source src="Rich Dad Poor Dad Audio Book in Hindi(MP3_320K).mp3">
    </audio>
	</body>
      </html>
  1. First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
  2. Secondly, the <html> tag is used to indicate the beginning of an HTML document.
  3. As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
  4. Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here. Here in body tag, we create, two audio tags, one embed tag and one object tag.
  5. These all are the ways to embed audio tags in html. In audio tags we use source attribute, whereas in other audio tags we use source tag.
  6. The difference in both of them is that with the help of source tag in audio tag, you are able to insert more than one file in html.
  7. In next embed and object tags, the code to embed audios is same like embedding videos. You just have to give source and data in both of tags respectively.
  8. At last, the <body> and <html> tags are closed with </body> and </html> respectively.

Conclusion :-

In conclusion, here we want to say that you are able to embed audio files in html. In next sessions, we will also teach you how to embed videos in html and also how to insert videos in html with the help of notepad.

I hope this tutorial on how to embed audio files in HTML helps you.

Author Image About Pragati

Experienced coding content writer who enjoys breaking down complex concepts in programming languages like Java, Python, C, and C++. Over three years of experience producing interesting and relevant content for a variety of entities. Committed to providing concise and easy-to-understand articles that assist readers in easily understanding technology and industry trends in the world of coding and software development.

Follow Pragati On Linkedin 🡪