Tec Maximum

Showing posts with label BLOGGING TRICKS AND TIPS. Show all posts

Show Adsense Ads in Homepage/Postpages only in Blogger

Earlier I have explained,

How To Add Adsense Ads Inside Posts or Between Posts In Blogger and
How To Add google Adsense In Blogger Post (bellow title,above title,at end of post)

Now I am going to explain you how to show adsense ads only on blog homepage or on blog post page.

Just follow the instructions,

Go to Dashboard > Layout > Edit HTML > Expand Widget Templates.

Recommended post What is google ranking.
To show ads on homepage only,

If you want to add your ads after post title but only show in homepage

<div class='post-header-line-1'/> <br>
<div class='post-body entry-content'> <br>
<b:if cond='data:blog.pageType != &quot;item&quot;'><br>
<b><span style="color: red;">

YOUR ADVERTISEMENT CODE

span>b><br>
</b:if> <br>
<br>
<p><data:post.body/></p><br>
<br>
<div style='clear: both;'/> <br>
<!– clear for photos floats –> </div>

To show ads on blog posts only, modify your code like this,

<b:if cond='data:blog.pageType == "item"'>

YOUR ADVERTISEMENT CODE

</b:if>

If you have any doubts,Feel free to ask here......

If You Like This Article Then Hit Like Button Bellow:)

Add SMSZE.COM wapsender to you blog

Now let your visitors send free sms from your blog.
Make a smsze.com wapsender yourself.

Steps
1.Copy that Html code,bellow

SMSZE wap sender
Send Free Sms..... Register to <a href="http://smsze.com">smsze.com</a>

<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
<font color="black"><b><img src="http://besttop.mobi/images/add.png" align="center" />Login Id/Mobile No</b></font><br /><label for="uid"></label><input name="uid" type="text" id="uid" size="45"/> <font color="black"><b><img src="http://besttop.mobi/images/add.png" align="center" />Password</b></font><br /><input name="pwd" type="password" id="pwd" size="45"/> <br /><font color="black"><b><img src="http://besttop.mobi/images/add.png" align="center" />Mobile No</b></font><br /><input name="phone" type="text" id="phone" size="45"/><br /><font color="black"><b><img src="http://besttop.mobi/images/add.png" align="center" />Message<br /></b></font><input type="text" name="msg" id="msg" /><br /><input type="submit" name="button" id="button" value="Send"/>

get it for your blog from <a href="http://riteshrockss.blogspot.com/2011/09/add-smszecom-wapsender-to-you-blog.html">here</a>

2.Just go to 'Design'-'Add a gadget-Html/-then paste that code,done

If you have any doubts,Fell free to ask here......
If You Like This Article Then Hit Like Button Bellow:)

Request For Template here

Guys, Request for your template here,With full specifications,what gadgets,widgets you want in it.I will make it for you,with full website and proffesional look in just 200 rs, and will delever to you within two days........

Thanks...... :)

If You Like This Article Then Hit Like Button Bellow:)

Google Chrome Brought 10 SEO Extensions

   Google Chrome has become one of the most popular and fastest growing browser in the world. With it’s simple looks and astonishing features, Chrome has really hit the bulls eye. From professionals to basic users, everyone is just gaga over this new web browser.
       Not to forget, that Firefox has gained a fame of the most SEO-friendly web browser due a huge number of excellent extensions that you can easily find and install in minutes.
       Without a doubt Firefox still holds strong positions in this field and it's hard to beat it, but we are sure that with the instant Chrome releases and updates, Google’s has all chances to compete with the leaders. Below are some of the most useful SEO chrome extensions for webmasters.

1. Chrome SEO

This is one of the most comprehensive SEO extensions available right now and certainly the most used one. The parameters are classified into various heads like Pages Indexed, Backlinks, Traffic Ranks, Bookmarks (social media), Cached Versions and Domain Details (including dns, whois, IP, etc). One of the best thing about this extension is that it contains all the basic information which a SEO person needs to see.

2. SeoQuake For Chrome

SeoQuake will give you information by the next parameteres (Google PageRank, Google Index, Yahoo links & linkdomain, Bing index, Alexa Rank, Webarchive age, Delicious index, Whois link, Page source, SEMRush rank). This one also contains all the basic information one needs, with some additional parameters such as the Internal/External Links display.

3. SEO Site Tools Extension

Well-composed extension informs you with various data concerning different metrics (On-Page / External metrics, Social Media info, PR / numbering on Yahoo, Bing, Google SERPs) and also gives access to Google Webmaster Tools and Yahoo Site Explorer. Since Search Engine Optimization is something which is very dynamic in nature and from time to time there are numerous parameters and tools which are introduced to enhance the performance of SEO. Keeping in mind such parameters, SEO Site Tools Extension includes some of these such as the SeoMoz Linkscape stats, Yahoo page links and Domain links separately, along with other conventional parameters. There is an option to highlight the nofollow links.

4. SEO & Website Analysis

SEO & Website Analysis extension for Chrome was created by Woorank. When you click on the WooRank icon, you will be sent to the full SEO analysis of the website covering
FEATURES
- SEO
- Alexa™ rank
- Compete rank
- Meta Description recommendation
- Dublin core
- Backlinks analysis
- DMOZ directory
- Yahoo Directory
- Delicious links
- Twitter account
- Number of tweets
- Readability level
- Load time ( website speed optimization )
- gzip
- WHOIS

5. SitezMeter

SitezMeter gives information about Google PageRank, also it displays traffic charts from Google Trends, Alexa and Compete.

6. SEO SERP

SEO SERP (Search Engine Result Pages) is a simple extension that enables you to quickly check the position of a list of sites given a keyword.

7. SEO Analysis Tool

This extension allows you to perform a basic analysis of a web page in your browser with a single click. It provides you with details including meta tags listing, meta tags analysis, the pages displayed within search engine results, keywords found in the anchor tags etc.

8. Google Global

Google global would be useful for those companies and SEO-masters that are interested in monitoring how Google search results appear in different countries, regions and cities.

9. Firebug

Firebug Lite is not a substitute for Firebug, or Chrome Developer Tools. It is a tool to be used in conjunction with these tools. Firebug Lite provides the rich visual representation we are used to see in Firebug when it comes to HTML elements, DOM elements, and Box Model shading. It provides also some cool features like inspecting HTML elemements with your mouse, and live editing CSS properties.

10. Screen Capture (by Google)

It's easy to use this extension to capture visible content of a tab, a region of a web page, or the whole page as a PNG image. You can also edit your captured image before saving it as a PNG image. Highlighting, redacting and adding text are supported.

Back To The Top Scrolling Widget For Blogger(Very Smooth)

Users sometimes get rid of scrolling pages on your blog if they are lengthy.Back To The Top Scrolling Widget is designed for user friendly scrollng of webpage. In this article I will explain you how to you can add a smooth scrolling back to top button on your blogger blog.

Basic:

Search for <p><data:post.body/> and paste the following code below:

You can change the † Back to Top link with an image file.

Advanced:

Step 1: Login to blogger
Step 2: Goto Design > Edit HTML
Step 3: Search for </body>
Step 4: Copy paste the following code just after the </body> tag

Step 5: Save your template and view your blog.

If you have any query or suggestions on Smooth Scrolling Back To Top Button For Bloggersplease feel free to comment below.

How To Customized Page Navigation For Blogger Blogs

This script is designed to allows users to navigate through blogger pages, just like those of books.It will replace the default "Older" and "Newer" page links with numbered pages, as seen in the image above. Just follow the steps below to add numbered page navigation.

Step 1: Login to your blogger account. Goto Design > Page element > Edit HTML and click on download full template

Step 2: Search for </b:skin> and add the following CSS code just before it:

.showpageNum a
{
    font:15px Arial,Verdana;
    text-decoration:none;
    background:#000;
    color:#FFF;
    border:1px solid #000;
    margin:0 4px;
    padding:4px 8px;
}
.showpageOf
{
    color:#cc0000;
    font:15px Arial,Verdana;
    margin:0 8px 0 0;
}
.showpageNum a:hover
{
    color:#FFF;
    background:#cc0000;
    border:1px solid #cc0000;
}
.showpageArea
{
    font:15px Arial,Verdana;
    color:#FFF;
    margin:10px 0;
}
.showpagePoint
{
    color:#FFF;
    font:bold 15px Arial,Verdana;
    border:1px solid #FFF;
    background:#cc0000;
    text-decoration:none;
    margin:2px;
    padding:4px 8px;
}
.showpageNum a
{
    font:15px Arial,Verdana;
    text-decoration:none;
    background:#000;
    color:#FFF;
    border:1px solid #000;
    margin:0 4px;
    padding:4px 8px;
}
.showpageOf
{
    color:#cc0000;
    font:15px Arial,Verdana;
    margin:0 8px 0 0;
}
.showpageNum a:hover
{
    color:#FFF;
    background:#cc0000;
    border:1px solid #cc0000;
}
.showpageArea
{
    font:15px Arial,Verdana;
    color:#FFF;
    margin:10px 0;
}
.showpagePoint
{
    color:#FFF;
    font:bold 15px Arial,Verdana;
    border:1px solid #FFF;
    background:#cc0000;
    text-decoration:none;
    margin:2px;
    padding:4px 8px;
}

Step 3: Search for </body> and copy paste the following code just after it

<script type='text/javascript'>
var pageCount=15;
var displayPageNum=5;
var upPageWord ='« ';
var downPageWord =' »';
</script>
<script src='http://dl.dropbox.com/u/23364774/iblognet/JS/page-navigation.js' type='text/javascript'/>

var pageCount=15; --> is the number of blog post on your main page
var displayPageNum=5; --> is the number of pages you want to show on navigation

Step 4: Save your template and view your blog.

Step 5: Reply me back if you don't see page navigation on your blog. Just upload the template back which you downloaded in Step 1.

If you have any query or suggestions on Customized Page Navigation For Blogger Blogsplease feel free to comment below.

Get About Auther Widget Bellow Each Post For Blogger

This widget will show article author, author image and about author, similarly like the widget bellow this post. The widget will also work for blogs with multiple authors. Before getting started, download your current template if anything goes wrong ahead.

1. Login to your blogger account > Design > Edit HTML.
2. Tick Expand widget Template.

3. Search for

<div class='post-footer'>

4. And paste the following code below it:

5. Change the CAPS letter in blue as reqiured.

6. IMP: AUTHOR_NAME_1 should be same as in the author blogger profile or the widget won't work. Profile can be updated from here > http://draft.blogger.com/edit-profile.g

7. If you have multiple authors copy the code in black color, italic and paste just before the last </b:if> tag . Don't forget to update the code for multiple author.

8. BLOG AUTHOR PIC should be of the size 64x85 pixels

Example of the widget for multiple authors:

<b:if cond='data:blog.pageType == "item"'>

<b:if cond='data:post.author == "AUTHOR_NAME_1"'>

<div style='background: #F9F9F9; border: double #DDD; padding: 5px;'>

<div style='font-size: 16px;'>
<b>Article By: <data:post.author/></b>
</div>

<a imageanchor='1' style='float: left;'><img alt='Blog Author' border='0' src='BLOG_AUTHOR_PIC'/></a><br/>
<b>LITTLE DESCRIPTION ABOUT AUTHOR</b><br/><br/>
If you like this post you can follow YOUR BLOG NAME on <a href='TWITTER_LINK' target='_blank'>Twitter</a> and on <a href='FACEBOOK_LINK' target='_blank'>Facebook</a>.<br/>
Subscribe to YOUR BLOG NAME feeds via <a href='FEEDBURNER_LINK' target='_blank'>RSS</a> or <a href='http://feedburner.google.com/fb/a/mailverify?uri=YOUR BLOG NAME&loc=en_US' target='_blank'>Email</a> to receive instant updates.

<br/><br/>

</div>

</b:if>

<b:if cond='data:post.author == "AUTHOR_NAME_2"'>

<div style='background: #F9F9F9; border: double #DDD; padding: 5px;'>

<div style='font-size: 16px;'>
<b>Article By: <data:post.author/></b>
</div>

<a imageanchor='1' style='float: left;'><img alt='Blog Author' border='0' src='BLOG_AUTHOR_PIC'/></a><br/>
<b>LITTLE DESCRIPTION ABOUT AUTHOR</b><br/><br/>
If you like this post you can follow YOUR BLOG NAME on <a href='TWITTER_LINK' target='_blank'>Twitter</a> and on <a href='FACEBOOK_LINK' target='_blank'>Facebook</a>.<br/>
Subscribe to YOUR BLOG NAME feeds via <a href='FEEDBURNER_LINK' target='_blank'>RSS</a> or <a href='http://feedburner.google.com/fb/a/mailverify?uri=YOUR BLOG NAME&loc=en_US' target='_blank'>Email</a> to receive instant updates.

<br/><br/>

</div>

</b:if>

</b:if>

If any error have occurred while installing the widget please comment below. If you have any query or suggestions on About Author Widget For Bloggers Similar To Wordpressplease feel free to comment below.

Automatic Read More And Thumbnel Widget For Blogger

The read more option gives the reader an ability to read an excerpt of the post on the homepage before reading the full article. You can add the read more section wherever you like. Recent changes to Blogger's functionality now enables us to add a read more section automatically in every post. In this post I will show you how to add automatic read more section on every blog post with and without using Javascript.

With Javascript:

Step 1: Login to your blogger account. Goto Design > Edit HTML > Tick Expand Widget.

Step 2: Find the </head> tag [Use keyboard- Ctrl + F]

Step 3: Copy the following code and paste it after the </head> tag

<script type='text/javascript'>
    var thumbnail_mode = "float" ;
    summary_noimg = 350;
    summary_img = 250;
    img_thumb_height = 120;
    img_thumb_width = 120;
    </script>
    <script src='http://spiceupyourblogextras.googlecode.com/files/auto-jump-break.js' type='text/javascript'/>

summary_noimg = 350; > The length of the summery if the post does not have a thumbnail.
summary_img = 250; > The length of the summery if there is an image in the post that will be converted into a thumbnail.
img_thumb_height = 120; > The height in pixels of the thumbnail.
img_thumb_width = 120; --> The width in pixels of the thumbnail.

Step 4: Find <data:post.body/> [Use keyboard- Ctrl + F] and replace with the following code:

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>");
</script>
<div style='clear: both;'/>
<span style='padding-top:5px;;float:right;text-align:right;'><a Title='Read Full Post' expr:href='data:post.url'><b>Reade More -></b></a></span>
</b:if>

Step 5: Save and view your template.

Without Javascript

Step 1: Login to your blogger account. Goto Design > Edit HTML > Tick Expand Widget.

Step 2: Search for </b:skin> and paste the following code before </b:skin>

thumb img {
float: left;
margin: 0 10px 10px 0;
}

float: left; > Will align the image to the left
float: right; > Will align the image to the right

Step 3: Search for <data:post.body/> and replace with the following code:

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<b:if cond='data:post.hasJumpLink'>
<data:post.body/>
<b:else/>
<b:if cond='data:post.snippet'>
<b:if cond='data:post.thumbnailUrl'>
<div class='Image thumb'>
<img expr:src='data:post.thumbnailUrl'/>
</div>
</b:if>
<data:post.snippet/>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
<b:else/>
<data:post.body/>
</b:if>
</b:if>
</b:if>
</b:if>

Step 4: Save and view your template.

If you have any query or suggestions on Automatic Read More For Bloggers With Thumbnail please feel free to comment below

How to add related posts widget below every post in blogger

1. Go to blogger,sign in.
2. Now go to "Design", then to "Edit HTML" section
3. Back up your present template, by "Downloading it"
4. Now click on "Expand widget templates"
5. Find this code:

How To Easily Add Random Posts Widget In Blogger

Adding a Random posts widget is very easy...
Simply log in to blogger, go to Layout, click on "Add a Gadget", and select it as "HTML/JavaScript" type.

And finally paste this code in to it:

How To add Floating Sharing Buttons To The Blogger

I. Adding the buttons

Login to your Blogger account.
Go to Design > Page Elements.
Click Add A Gadget.
In Add A Gadget window, select HTML/Javascript .
Copy the code below.

<!-- floating page sharers Start riteshrockss.blogspot.com-->
<style>
#pageshare {position:fixed; bottom:15%; margin-left:-71px; float:left; border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;background-color:#fff;padding:0 0 2px 0;z-index:10;}
#pageshare .sbutton {float:left;clear:both;margin:5px 5px 0 5px;}
.fb_share_count_top {width:48px !important;}
.fb_share_count_top, .fb_share_count_inner {-moz-border-radius:3px;-webkit-border-radius:3px;}
.FBConnectButton_Small, .FBConnectButton_RTL_Small {width:49px !important; -moz-border-radius:3px;/*bs-fsmsb*/-webkit-border-radius:3px;}
.FBConnectButton_Small .FBConnectButton_Text {padding:2px 2px 3px !important;-moz-border-radius:3px;-webkit-border-radius:3px;font-size:8px;}
</style>
<div id='pageshare' title="Get this from riteshrockss.blogspot.com">
<div class='sbutton' id='fb'>
<a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script>
</div>
<div class='sbutton' id='rt'>
<script src="http://tweetmeme.com/i/scripts/button.js" type='text/javascript'></script>
</div>
<div class='sbutton' id='su'>
<script src="http://www.stumbleupon.com/hostedbadge.php?s=5"></script>
</div>
<div class='sbutton' id='digg' style='margin-left:3px;width:48px'>
<script src='http://widgets.digg.com/buttons.js' type='text/javascript'></script>
<a class="DiggThisButton DiggMedium"></a>
</div>
<div class='sbutton' id='gb'>
<a class='google-buzz-button' data-button-style='normal-count' href='http://www.google.com/buzz/post' title='post on google buzz'>
<script src='http://www.google.com/buzz/api/button.js' type='text/javascript'></script>
</a></div>
<div style="clear: both;font-size: 9px;text-align:center;"><a href="http://riteshrockss.blogspot.com/2011/04/how-to-add-floating-sharing-buttons-to.html">Get this</a></div>
</div>
<!-- floating page sharers End -->

Save the gadget.
Drag the gadget and reposition it under Blog Posts gadget.
Click Save button on upper right corner.

II. Customizing

Vertical alignment
Change the value of bottom in code line 2. The code positions the button relative to the bottom of your browser window. To fix the distance even when window is resized, specify the value in px (pixels) instead of %.

Horizontal alignment
Change the value of margin-left in code line 2. Negative value pushes the button to the left of the main blog column, positive value pushes it to the right.
To position the button relative to the left or right edge of browser window, replace the margin-left with left (as in left:10px;) orright (as in right:10px;) respectively.

Adding more buttons
You can add any social bookmarking or sharing button to the bar. Just put each button code inside a div, like this:

<div class='sbutton'>
PUT BUTTON CODE HERE
</div>

and insert it right after line 27.

Enjoy!

How To Get Quality Articles for your Blog Website

Here we have listed some of the famous article websites to get quality content for your blog website. You can visit any of the below website and get the content of your interest. We reccommend you to select categories in the area of Home based jobs, Business, Investment or anything related to Earning money categories.

How To Add Meta Tags To Blogger eqasiest and effective way

One way to improve your blog SEO (Search Engine Optimization) is to add in description and keywords meta tags. They are placed inside the head section of your blog template HTML.

In description meta tag you put a description of your blog, telling what your blog is about. In keyword meta tag you put in key words relevant to your blog content.

How To Add Adsense Ads Inside Posts or Between Posts In Blogger

Adding adsense ads inside blog posts is a very good thing to do to increase your CTR.
CTR means"(the number of times your ad clicked) divided by (number of times it is shown).So,the more CTR you have,the more $$ you get

Recommended post What is google ranking.

As we know,there are more chances for the ads to be clicked when they are in the middle(blog posts) rather than at the sidebars(especially the right sidebar),footer,etc.So,

Keyboard Shortcut keys for Posting with Blogger

Keyboard shortcuts are a feature I find incredibly useful. Most of our favourite applications offers shortcuts to perform tasks, such as the generic CTRL+S to save or CTRL+B to generate bold text in word processing programs (the "Command"/CMD button for Mac users).

Blogger offers us a range of keyboard shortcuts we can use when creating and editing our blog posts to perform some most-used tasks without having to scroll around to find their appropriate buttons.

How To Add google Adsense In Blogger Post (bellow title,above title,at end of post)

This will explain how to Embedd adsense ads in between posts body.

1.Generate Parsed code for adsense code because we cannot put adsense code directly in the xml.So parse it using adsense converter.

2.After parsing,your ad code Should look like this.

How To Add A Rating Gadget Into Your Bloggers Blog

1. Log in to blogger account and go to Design >>Edit HTML

2.Mark check box "Expand Widget Templates"

3.Find this tag by using Ctrl+F <data:post.body/>

4.paste below one of code after the above tag ( choose style )

How To Place Google Adsense Ads Below Post Title in Blogger

This ad placement requires pasting the Google Adsense code directly into your Blogger template. While not difficult I have rated the skill level as intermediate as it requires parsing (conversion of the Javascript into a format readable by Blogger) of the Google Adsense code first before pasting it into your template. For the benefit of newbies and beginner Bloggers I have broken down the steps to simplify the process and make it more manageable. What follows is a detailed step by step tutorial on how to place Google

How To Add Multi color Title link for blogger

Add a multi color link in your blog. It gives cool effect to your links when your visitors hover it. you can see demo in my links.

So, let’s start with it.

Go to your blogger account.
Navigate to : Dashboard >> Layout >> Edit html

And find the following code

As you know, millions of people use their mobile phones to access internet. The mobile internet speed is also very fast these days with 3G's , mobile apps,etc.

From this, we can say many of your readers are coming to your blog through mobile phones..But, if you don't make your blog mobile friendly, .you may lose all your mobile readers because in a mobile phone, a normal blog takes lot of time to load and there are other issues that your site not fitting properly in the mobile screen.