Tuesday, October 25, 2011

Protect all images in your Blog jquery trick

Protect all images in your Blog jquery trick 

 

NetOopsblog protected image
Here is a most important trick every blogger need. This trick is about how to protect all your images in your blog with a transparent image covered on it. I recently posted an article about How to protect images? .This article about to protect all images.







                                                                        


                
         
             
            
              
          
Step 1: Add jQuery plugin (if your blog have a jquery plugin,ignore this step)


  • Go to Template->Edit HTML [A dialog box appears click Proceed]
  • Copy and paste the below code <head> and save it

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
  • Go to Blogger Account
  • Template->Edit HTML [Click Proceed]
  • Copy the code above </head>

    Protect only First image in every Post

    <script type='text/javascript'>
    //<![CDATA[
    $(function(){
    $(".post-body img:nth-child(1)").after("<img src=\"http:\/\/2.bp.blogspot.com\/-lQW7QlMoz10\/T8yL_5IPF6I\/AAAAAAAAAQU\/5R8ngq17xzw\/s1600\/transparent.png\" alt=\"NetOopsblog protected image\" style=\"margin-left: -212px; opacity: 0; position: relative; top: 0;\" \/>");
    });
    //]]>
    </script>

    Protect all images in every post

    <script type='text/javascript'>
    //<![CDATA[
    $(function(){
    $(".post-body img").after("<img src=\"http:\/\/2.bp.blogspot.com\/-lQW7QlMoz10\/T8yL_5IPF6I\/AAAAAAAAAQU\/5R8ngq17xzw\/s1600\/transparent.png\" alt=\"NetOopsblog protected image\" style=\"margin-left: -212px; opacity: 0; position: relative; top: 0;\" \/>");
    });
    //]]>
    </script>
     




0 comments:

Post a Comment

Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Design by Free WordPress Themes | Bloggerized by Lasantha - Premium Blogger Themes | Web Hosting Coupons