How To Add AutoPlay Background Music Player to Blogger

By -

AutoPlay Background Music for Blogger

Background music adds the extra beauty to our blogs. When a visitor land on our blog posts/pages, he keeps reading our blog post in a silence environment like there is nobody exists around the blog and thus he sometimes feels alone. Therefore, when it comes to entertainment blogs like movies or music, background music play the major role in our blogs. In this tutorial, you will learn how to add background music to Blogspot blog. The choice is yours, you can either add this to specific pages/posts or in entire blog.

Check out: 22 Outstanding Marquee Text Effects For Blogger Blogs

Everybody loves the music. Your readers will come again and again to enjoy the music on your blog, as a result, they will fall in love with your blog. I can hardly say they will miss the music but the condition is; music should be the heart touching.

Adding Background Music to Specific Posts/Pages to BlogSpot Blogs

  1. Go to your Blogger Dashboard > Select the post or page where you want to add the background music
  2. If you have already published the post/page click Edit or just create the new post/page
  3. Switch to HTML and paste any music code inside the pos/page editor
<audio src="http://www.indiamp3.com/download.php?song_id=66803" autoplay loop>
</audio>
<audio src="http://www.tamilcutsongsfreedownload.net/ringtones/heart%20touch/download.php?file=Heart%20Touching%20Ringtones%201.mp3" autoplay loop>
</audio>
<audio src="http://www.tamilcutsongsfreedownload.net/ringtones/heart%20touch/download.php?file=Heart%20Touching%20Ringtones%202.mp3" autoplay loop>
</audio>
<audio src="http://www.tamilcutsongsfreedownload.net/ringtones/heart%20touch/download.php?file=Heart%20Touching%20Ringtones%205.mp3" autoplay loop>
</audio>
<audio src="http://www.tamilcutsongsfreedownload.net/ringtones/heart%20touch/download.php?file=Heart%20Touching%20Ringtones%206.mp3" autoplay loop>
</audio>
<audio src="https://www.yt-download.org/download/64-588e1bd83b24a-2248000/mp3/2sYyqnmVBcc/Taio%2BCruz%2Bfeat%2BPitbull%2B-%2BThere%2BShe%2BGoes%2B%2528Ibiza%2BBooomb%2BRemix%2B2016%2529.mp3" autoplay loop>
</audio>
<audio src="http://songs.sonymp3.com/file/113803250/there-she-goes-taio-cruz-ft.mp3" autoplay loop></audio>
<audio src="http://api.ning.com/files/oR3P*8h-GcHtb16mUnNMCBEXVUujbP3ILxLJoO6p1oOCW9nfUzTEK05vjuoJ6KyhXtz*XYxFGwLHofZdZ2OcMPLyaGpuVRvT/ThereSheGoes.mp3" autoplay loop>
</audio>

Note: You can replace the blue text with you favorite music URL

Adding Background Music to Entire Blogger Template

  1. Go to your Blogger Dashboard > Layout >  HTML/JavaScript  > Add a Gadget
  2. Select your favorite music code from the above-mentioned codes and paste it in the popup content area and hit Save

Every time, when you visit your blog, the background music will be played automatically. However, if you want to add the music controller like play and pause button, you need to add this code instead of the above-mentioned codes.

<script id="player_type" language="javascript" type="text/javascript">
var player_id=1;
var soundimage_player_start = 1;
document.write('<div id="soundimage_holder'+player_id+'" align="center">');
document.write('<div id="soundimage_player_main'+player_id+'"></div>');
document.write('<a id="soundimage_player_links'+player_id+'" href="http://www.soundimage.eu/" target="_blank" title="Royalty Free Music">Royalty Free Music</a>');
</script>
<script id="player_script" src="http://www.soundimage.pl/freemusic/soundimage_player_en2.js" language="javascript" type="text/javascript"></script> 

Important: If you are having trouble with the functionality of these codes, try another web browser. Your current browser may need to be upgraded to a newer version. It is highly recommended to visit your blog from Google chrome browser while enjoying the background music.

Conclusion:

If you are running an entertainment blog like movies blog or music blog, you can take good advantages of the background music plugin and it is a good practice to impress your blog visitors with background music. It adds the extra sweetness to your blogger blog.

Comments

  1. Tariq Khoker2 February 2017 at 01:23

    Very helpful and proper examples. Can i add this to wordpress?

    ReplyDelete

Post a Comment

Popular posts from this blog

List of Top 11 Social Bookmarking Sites for 2018

By -
Image
Today, I'm going to share with you the most popular and widely used social bookmarking sites for 2018. These sites will help you increase your content visibility on social media and search engines. The process begins with the content curation and content aggregation. But before you bag the list, you need to understand what social bookmarking is and why you should use them instead of browser bookmarks. What is Social Bookmarking? Social Bookmarking is the process of adding, storing, submitting and sharing your contents on those websites where people and search engines can see and access your work actively. It includes a webpage, an image object, a video or text-based links like services or products that you offer. When you share (bookmark) your contents on a social bookmarking site, it means your data has been whitelisted or stored for quick access in future if the original web page exists. Check out: Role of Social Media in Boosting Your Traffic Easily Why You Should Use...
Read more

6 Digital Marketing Strategies for Small Business

By -
Image
Revenue is the lifeblood of any business. To get enough sales, it is very important to market your business as well as the products and services which you are providing. Today, there are millions of potential consumers on the Internet. Therefore, digital marketing is highly necessary. This is an activity where the company's name, brand, products, and services are spread throughout the Internet so that online consumers can view them, make purchases and possibly make referrals. By boosting your company's brand awareness online, you can create an attractive, positive and profitable business. One of the most effective methods of achieving this is by using SEO methods and other useful techniques. Here is more on Search Engineering Optimization. What is Search Engine Optimization? (SEO) This is a specialized strategy where the online visibility of a website is grown in the organic search engine results. Involving a collection of technical and web-based strategies, SEO optimizatio...
Read more

How to Create Separate AMP Pages On Blogger [AMP Plugin]

By -
Image
Today, I am going to share an awesome technique by which you can install AMP version on your responsive blogger template. By doing this, your responsive theme will not get disturbed because with this method, you can add AMP snippets to the mobile version (m=1) instead of upgrading your whole template to AMP. So let get started! As we know, people are upgrading their responsive themes to AMP themes and this method has badly impacted their blog layout. But in this article, we will be learning to create a separate AMP page in a native manner that will keep your responsive design up. So creating a separate AMP page on Blogger's mobile URL m=1, we need to have valid AMP snippets in our Blogger template. Then we will make some minor changes to make AMP on mobile URL m=1. How to Easily Add Hreflang Tag to Blogger Steps to Add AMP Pages On Blogger Mobile Redirect URL Creating a separate AMP page in Blogger is not a difficult task as you think. In today's article, I am going t...
Read more