Fix broken Images on the website Automatically with a default Image

Have you ever been in a situation when you open your website or a blog and you see a broken image pic instead of the actual image? It is a painful sight to watch and replace each and every broken image is a tedious job.

We’ve come up with a Javascript trick that could replace all the broken or missing Images with a default image.

Here is the procedure to replace Missing, Broken 404 Images with a fall back or default Image

Here is an useful jQuery solution which automatically replaces broken, missing images with any preset(default) image. It involves calling a simple jQuery function when an image fails to load inside the webpage.

To implement this all you have to do is add a simple code to your webpage before the </head> tag.

[highlight color=”purple”] <script src=”http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js”></script> <script> $(document).ready(function() { $(‘img’).error(function(){ $(this).attr(‘src’, ‘default.jpg’); }); }); </script> [/highlight]

Replace default.jpg with the location where your preset(default) image is stored

It even works on Blogger, WordPress, etc, platform. Simply add this code to your template anywhere inside the </body> tag.

 

Shoot us a Mail if you have any difficulty.

The DNetWorks Team