Saturday, 9 June 2012

Protect all images in your Blog jquery trick

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.







Related Articles
How to protect images in your blog?
Do you want to see demo? Try to save picture in this blog.
----------------------------------------------------------
What's inside this article
 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 and save it

Protect all images in every post

I think you liked this article...please like and share..
Posted by at No comments:
Labels: , ,

Monday, 4 June 2012

Protect your images Blogger image hack

protect your images blogger trick
This is an awesome trick to protect your images.You can protect your images from copying with this Simple CSS Blogger Tricks.After applying this trick the person who save the image will get a transparent image instead of the original image.







Demo
Try to Save the below image


Protect your image Trick for all images (UPDATED VERSION)
What's inside this article
Protect your image Trick 1 -With overlap image
Protect your image Trick 2 -With span background image

Protect your image with CSS overlapping

  • Go to Blogger Account
  • Use the Following trick

NetOops protected image
  •  You can use this code anywhere, if you want to protect an image in your post. Add image and switch to HTML tab and copy the URL of image(eg- http://3.bp.blogspot.com/-xxxxx/xxxxx/s1600/name-of-image.jpg) and paste to that code mentioned above.
  • That's it.

Protect your image with SPAN background

  • Use the following code
NetOops protected Image. 

  • You are done..
If you liked this article please share and like....
Posted by at No comments:
Labels: ,

Friday, 1 June 2012

Awesome NetOopsblog Subscription Widget for blogger

NetOopsblog Subscription box Blogger
This post is about how to add a Subscription Box like our NetOops blog. Subscription box contains Facebook, Twitter, RSS Feed, e-mail subscription. This widget is based on a wooden theme. Facebook, Twitter, RSS Feed links are shown as Natural Wooden Sticky Boards. In this tutorial i am adding a new e-mail subscription box with wooden theme.




 
Demo is in the Right of this Blog

What's inside this article??

Subscription box with Fully Wooden Theme

  • Go to Blogger Dashboard
  • Go to Layout 
  • Select Add a Gadget
  • You can type title any
  • And Copy the following code in the content.
Demo of Fully Wooden Theme

 Important: If you don't want Mouse over effect of Images in the Subscription box, please delete the RED highlighted code,. If you want then leave it there.
    <style type="text/css">
     /* Delete form Here*/ 
    img.beintouch:hover {
        background: none repeat scroll 0 0 #D6D6D6;
        border-radius: 16px 16px 16px 16px;
        box-shadow: 0 0 10px #565656;
    }
    /* Delete to Here*/
    .emailtext {
        background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTTYM0QDeLvPd-lDCi0Elf-8X3ZS9bJsEVYdHZdi0np1KUpZBdLemv6jch8OJ4oJvUGnO0ODDyc4iZc6yZ3lNXAgm6BYT5jPtdNXw9yjgOg-_AxXW72MXEQ80t5tbY_04ReKS-J5EcwPk/s1600/mailbox.png") no-repeat scroll 4px center transparent;
        border: 1px solid #7E4E27;
        border-radius: 4px 4px 4px 4px;
        box-shadow: 1px 1px 4px #7E4E27 inset;
        color: #444444;
        font-weight: bold;
        margin-left: 2px;
        padding: 7px 15px 7px 35px;
        text-decoration: none;
        width: 176px;
    }
    .ebutton {
        background: -moz-linear-gradient(-45deg, #3C1F0E 0%, #D28A47 30%, #F9E183 30%, #D28A47 55%, #3C1F0E 100%) repeat scroll 0 0 transparent;
        border: 1px solid #D3D3D3;
        border-radius: 4px 4px 4px 4px;
        color: #FFFFFF;
        cursor: pointer;
        font-weight: bold;
        margin-left: -18px;
        margin-top: 5px;
        padding: 6px 15px;
        text-decoration: none;
        text-shadow: 1px 1px 0 #000000;
    }

    http://www.facebook.com/pages/NetOops-Blog/159796530791611">http://twitter.com/netoopsblog/" rel="nofollow">http://feeds.feedburner.com/NetOopsBloggerTricks" rel="nofollow">

    Get Latest Tips via e-mail

    netoopsbloggertricks', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" method="post" class="emailform" action="http://feedburner.google.com/fb/a/mailverify">






    Change the BLUE highlighted code with FACEBOOK PAGE URL, TWTTER, FEED URL, FEED ID respectively.

    Subscription box with Default Basic Wooden theme

    • Go to Layout 
    • Select Add a Gadget
     Important: If you don't want Mouse over effect of Images in the Subscription box, please delete the RED highlighted code,. If you want then leave it there.
    <style type="text/css">
     /* Delete form Here*/ 
    img.beintouch:hover {
        background: none repeat scroll 0 0 #D6D6D6;
        border-radius: 16px 16px 16px 16px;
        box-shadow: 0 0 10px #565656;
    }
    /* Delete to Here*/

    http://www.facebook.com/pages/NetOops-Blog/159796530791611">http://twitter.com/netoopsblog/" rel="nofollow">http://feeds.feedburner.com/NetOopsBloggerTricks" rel="nofollow">

    Get Latest Tips via e-mail

    netoopsbloggertricks', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" method="post" class="emailform" action="http://feedburner.google.com/fb/a/mailverify">






    Change the BLUE highlighted code with FACEBOOK PAGE URL, TWTTER, FEED URL, FEED ID respectively.

    I think this widget helps you, Please share and like...
    Posted by at No comments:
    Labels:
    Subscribe to: Comments (Atom)