Wednesday, February 23, 2011

Blogger: move Adsense to the end of post and above comments


When hosting your blog at blogspot.com, it is very easy to add Ads to your blog. Just go to the Dashboard, click on the Monetize tab and follow the instructions. You could add Ads at the end of each post and the sidebar.

But there is a major "flaw" of adding the Ad to the end of the post. The Ad is added below the comments. When your readers are reading that single post (not the homepage of the blog which may contains multiple posts), they first see the post itself, then the comments, and the last, the Ad. That means your best and most popular posts get punished because they tend to have too many comments (such as this post). The readers would not have the patience or interest to go over all the comments, until when they could see the Ad.

In this tip, we show you how to move the Ad before the comments area. The template we are using may not be the same as yours, but the idea should be similar. You should also remember to make a copy of the current template before doing any changes to it, because what works for us may not work for you. To make a copy of the current template, go to the Dashboard, click on the Design tab, then the Edit HTML sub-tab, you will see the Download Full Template link.

Now let us begin.

Step 1: go to the Dashboard, click on the Design tab, then the Edit HTML sub-tab.

Step 2: in Edit Template section, check the Expand Widget Templates option.

Step 3: in the textbox of the current template, look for this piece of code:
        <div class='post-outer'>
        <b:include data='post' name='post'/>

        <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
          <b:include data='post' name='comments'/>
        </b:if>
        <b:if cond='data:blog.pageType == &quot;item&quot;'>
          <b:include data='post' name='comments'/>
        </b:if>
        </div>
        <b:if cond='data:post.includeAd'>
          <b:if cond='data:post.isFirstPost'>
            <data:defaultAdEnd/>
          <b:else/>
            <data:adEnd/>
          </b:if>
          <b:if cond='data:mobile == &quot;false&quot;'>
            <div class='inline-ad'>
              <data:adCode/>
            </div>
          </b:if>
          <data:adStart/>
        </b:if>

To better explain the code, we have colored them.

You can see the second line (in yellow) includes the post itself. After that are the comments (in green). The Ad section (in red) is below the comments section.

Step 4a: move the code in red to between yellow and green. The Ad should be below the post and above the comments now. Click the PREVIEW button. If you are satisfied, go to step 5. (Note: you could not see the result of a single post in the preview. You have to save the template first.)

Step 4b: Each post usually has a footer. If you want to move the Ad above the footer and right at the end of your post to get better attention, skip step 4a and do the following:

  Step 4b-1: cut the red piece of code off its original location.

  Step 4b-2: in the textbox of the current template, look for this piece of code:
    <div class='post-body entry-content'>
      <data:post.body/>
      <div style='clear: both;'/> <!-- clear for photos floats -->
    </div>

  This piece of code is the pure post body.

  Step 4b-3: paste the code you just cut (the red one) right after this piece of code. Now it looks like this.
    <div class='post-body entry-content'>
      <data:post.body/>
      <div style='clear: both;'/> <!-- clear for photos floats -->
    </div>
        <b:if cond='data:post.includeAd'>
          <b:if cond='data:post.isFirstPost'>
            <data:defaultAdEnd/>
          <b:else/>
            <data:adEnd/>
          </b:if>
          <b:if cond='data:mobile == &quot;false&quot;'>
            <div class='inline-ad'>
              <data:adCode/>
            </div>
          </b:if>
          <data:adStart/>
        </b:if>

  Click the PREVIEW button to see the result.

Step 5: Click the SAVE TEMPLATE button to activate it.

Wednesday, February 16, 2011

Firefox Extension: Packed Menu 2 Nav


(For Firefox 4 only.)

This extension is very similar to another extension Packed Menu except that it puts the button on the Navigation Toolbar instead of the Menu Bar.

This extension conflicts with the extension Packed Menu, so I self-host it. You must read this and uninstall Packed Menu before you can use this extension.

This extension adds a button "M" to the Navigation Toolbar. And the original main menus are hidden. When you click the "M" button or press Alt-M, the original main menus are shown under the "M" button.

After the installation, the Menu Bar may become empty. You can choose to hide it by unchecking View|Toolbars|Menu Bar.

This extension has nearly no impact to the Firefox's performance. All it does is just adding a menu "M" to the tool-bar and moving the original "main menu bar" to the popup of the menu "M".


This extension can be downloaded and installed from: http://code.google.com/p/packed-menu-2-nav/

Install another extension Autohide Tabbar together and you would get a neater interface.

Thursday, February 10, 2011

Google Chrome: What to do if a problematic extension crashes Chrome


If after you install an extension, your Chrome can not start and run, you want to run Chrome in a safe mode so that you can disable the extension which causes the problem.

Method 1

Right click on the icon of the Chrome, and select Properties on the context menu. In the Shortcut tab, look for the Target box. Append the argument "--incognito" to it. It will then look like:
        "C:\\...\Google\Chrome\Application\chrome.exe" --incognito

Click OK to accept the change.

Start Chrome.

Click the Tools icon at the top left corner and select Tools|Extensions.

You can uninstall the problematic extension.

Last step, don't forget to go back to the Properties of the Chrome icon to remove the argument "--incognito".

Method 2

The above method will not work if you enable the extension in the incognito mode. If that is the case, you need to manually remove it.

Right click on the icon of the Chrome, and select Properties on the context menu. In the Shortcut tab, look for the "Find Target ..." button.

Click the "Find Target ..." button to go to where Chrome is installed.

Go up a directory and you will see there are two folders: Application and User Data.

Enter User Data/Default/Extensions. All the extensions you have installed are listed here.

If you are not sure of the id of the problematic extension, look for the most recent one by the Date Modified field. Go into it and read the file "manifest.json". There should be a field named "name" in the file.

When you identify the folder of the extension, just delete it.

Start Chrome.

Note: if the extension was loaded as an Unpacked Extension, you don't need to go to the above location. Just go to where you loaded it (where the source code is) and move it away.

 
Get This <