How To Insert Audio In HTML Using Notepad
Last Updated : Mar 11, 2024
IN - HTML | Written & Updated By - Anjali
In this tutorial we will show you the solution of how to insert audio in html using notepad, in html today with the help of html5 we are able to insert audio files in html. Most of the browsers now days support audio files.
There are many types of audio files like .mp3, .ogg and others. Most of browsers supports all types of audio files, so you are able to insert audio files whichever you want.
But there is one problem that you don’t know how to insert audio files. That’s the reason we are today here to help you and hope that you understand this article properly.
Step By Step Guide On How To Insert Audio In Html Using Notepad :-
Now, there are many ways with the help of which you are able to insert audio files in html. So, you can use any one to insert audio in your website.
- With the help of audio tag
- With linking audio files in html
- By using object tag in html
- By using embed tag in html
Hence, there are some ways with the help of which you able to insert html files in html. You can use any one which want.
We will show you an example in which all the above methods are used. Here it is:
<!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>
<!-- in next a link is created which can used to link audio file -->
<a href="Rich Dad Poor Dad Audio Book in Hindi(MP3_320K).mp3"> click me to open your audio files</a>
<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>
- First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
- Secondly, the <html> tag is used to indicate the beginning of an HTML document.
- 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.
- Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here.
- Here, in body we create two audio tags, one link, one object and one embed tag. As described in our previous articles the use of object, embed and link tag.
- In link tag, we give a link to audio file, in object and embed, we embed audio files in html page. Now, the last one is audio take which one we did not discuss before.
- The audio tag is used to insert audio files in html. You can use direct audio tag with source attribute and you can also use source tags in audio tag.
- The difference in between them is, in only audio tag you can insert only one audio file to insert in webpage, whereas with the help of source tags in audio you are able to more than one audio files in html webpage.
- At last, the <body> and <html> tags are closed with </body> and </html> respectively.
Insert Audio Files With The Help Of Notepad: :-
For using notepad, you have to open notepad using the article in which we describe how to write code in html with the help of notepad.
After opening notepad, you just have to copy paste the above code and open in any browser to see the result. You can also modify and customize the code according to yours needs.
Conclusion :-
In conclusion, here we can say that we are able to insert audio files in html with different ways. The best way to insert is using link tag and audio tag.
I hope this tutorial on how to insert audio in html using notepad helps you and the steps and method mentioned above are easy to follow and implement.
About Anjali
