Adding QueryLoader (‘LazyLoad’) Script For Blogger And Customize It.

Hi all hear visitors, It’s been a long time since i wrote my latest tutorial here, and sure this is because working on our new version, which released last week, i wish you liked it all,
Today we are going to learn a new tutorial about how to apply the QueryLoader (LazyLoad) script for your blogspot blog.

What is the QueryLoader (LazyLoad).

QueryLoader is a blank black ( can be changed ) screen that covers your blog till all content loaded, which means that your visitors won’t see the actual loading of your blog, instead of that, they will see a loading page with a bar and percentage of the overall blog loading, it’s build using j-query and css. easy to apply to your blogger blog, and customize able.

Step 1, adding the jave files.

In this step we will add a scripts files to your blogger template.
Please navigate to your dashboard >> Design >> edit html , and please find the following code,

</head>

And exactly before it add the following code

<script src='http://code.jquery.com/jquery-1.5.min.js' type='text/javascript'/>
<script src='http://blogger-loader.googlecode.com/files/queryLoaderpre.js' type='text/javascript'/> 

Step 2, adding the jave Codes.

And on the same page, please find the following code,

</body>

And before it add the next code,

<script>
 QueryLoader.selectorPreload = &quot;body&quot;;
 QueryLoader.init();
</script>

Step 3, adding the Css Codes.

now on the same page too, find this code,

]]></b:skin>

And before it , add this code,

.QOverlay {
 background-color: #000000;
 z-index: 9999;
}

.QLoader {
 background-color: #CCCCCC;
 height: 1px;
}

.QAmt {
 color:#FF530D;
 font-size:50px;
 font-weight:bold;
 line-height:50px;
 height:50px;
 width:100px;
 margin:-60px 0 0 -50px;
}

now Click Save Template
And your blog now have the script installed and ready, click preview or view your blog to see the script in action.

Additional Step, Customize the colors.

Now this is an extra step and you can do it or not, as you like,
If you want to change the colors, you have to change values in the css code, “step 3″
Please look at the following image to know what what you should change to get your own style.

If you wondering about how to get your own color codes, i think you should have a look at our amazing color codes tool here.

Demo, Credits, And files.

This script originally coded by gayadesign.com and customized for blogger by me , For a demo for this script please click here,
In case you wanted to host the file in step 2 on your own server or any where else, you can download it here, Download ( 155 hits )

Read more...

How To Use Google Custom Fonts For Blogger.

For years, Bloggers and web-designers were using those simple web fonts to style their blogs and templates. They didn’t had an option to change those fonts as there were only some fonts accepted world-wide as web fonts. It was impossible to use another fonts on web pages as they would appear in ten monitors in ten different styles ! Their appearance may change in  respect of the change in the OS, softwares … etc of that computers. So web-designers were trapped under those countable fonts…

But now Google has launched their new service Google web fonts with the slogan – ‘Making the Web Beautiful!’. This service will allow you to use custom fonts on google font directory on our blog/ websites without any sign-up or anything else. As it’s from ‘Google’, It doesn’t have any complications and it’s also completely free for commercial and private use.,No restrictions held or no harsh laws. This could make your blog look more stylish and is applicable for blogger blogs too. Don’t get amazed, It’s True ! I’ll show you how to do it with blogger.

Step 1 : Back-up Your blogger template

It’s always the first step for any blogger tutorial. I’ll be using this step as the first step for all my tutorials on allblogtools. You should always take a back-up of your blogger template before testing any hacks on blogger.
For this, go to Design or layout -> Edit HTML -> Download full template

Step 2 : Select your Font

For this, Go to Google Font directory and select any one of those stylish font, which you want to use on your blog.

Step 3 : Get the Code for your Font

In this tutorial I’ll be using the Tangerine font, Which I liked the Most. For this just click on the name Tangerine and a new windows will open. Select The tab named ‘Get the code‘.

Step 4 : Add the Code to your Blogger template

Now you have to copy the Code they provide and you have to add the code to your blogger template, just after

<head>

tag of your blogger template.
The code may look something like;-

<link href='http://fonts.googleapis.com/css?family=Tangerine' rel='stylesheet' type='text/css'>

Important : ?Please add a Forward slash (“/“) before the the end of the tag (“>”) of this code. i.e, The above code should look like ;-

<link href='http://fonts.googleapis.com/css?family=Tangerine' rel='stylesheet' type='text/css'/>

This is because blogger use XML for coding which won’t allow unclosed tags like this. So you have to close this tag by adding the forward slash.
Now Copy the code and paste it just after

<head>

. It should be the first code after the

<head>

section. Otherwise it could cause problems while displaying the text in IE and may be in Firefox.
Please remember to add the forward slash before the end tag. and now please click Save Template
now the code required for Google web font has been added to your blog. Now you have to can use google fonts in your blog by applying it on any widget tags.

Step 5 : Add the CSS code for Font to your Blog.

Now the last and final step. In this step, you have to specify where you want to add the font and have to add the css code for it.
If you want to make the font appear for a specific sentence only in your blog post, then use the HTML code ;-

<div style="font-family: 'FontName', serif;">Your text</div>

in the above code change
FontName : to the font name that you chosen it from google.
Your text : to any text you want.
If you want the font to appear for your

• Blog titile
• Post title
• post body
• sidebar fonts

you have to add the CSS code for it. Don’t worry, It’s very very easy.
Here I’ll tell you How you can change your post title. For this you have to search for the title css code

.post h3

or

.post-title h3

This is the common css code for post title in blogger. now we have to add the css code for the new fonts for this code,. For this, add/modify these lines below the above codes.

font-family: 'Your Font Name';

The code should look something like ;-

.post h3 {
font-family: 'Your Font Name';
}

Here I had added the css code for Tangerine. You should post the css code between the “{” and “}” tags of .post h3. Like wise you can add the css code for other position too by modifying the css code.
Here i’ll mention the main positions and the common css code for each position. Please note that it may change if you are using any custom template.

• Title : h1
• Post title : .post h3 or .post-title
• Post font : .post-body
• Sidebar : .sidebar h2

the above tags helps you to change the font for any position of the above 4 tags.
for example, if you want to change the post font,
in the above table, you can see that the tag to edit for the post font, is .post-body
so you have to search for .post-body in your template, and below it, add the following line.

font-family: 'google Font Name';

the final code should looks like
The code should look something like ;-

.post-body {
font-family: 'Your Font Name';
}

These above values may change in some custom themes. But these are the common seen tags. If you didn’t find the tags with this, try searching similar tags.

Demo

If you want a demo for this, try viewing the demo page of my new theme, I had changed it’s header into ‘Lobster’ and navabar and post body too to google fonts. have a look at it. click here to see a demo
I hopes that this tutorial was helpful for all of you. If you have any question regarding this, please feel free to ask them here, the comments page are open for it, isn’t it ?

Read more...

Prevent Content Theft and Copyright Infringement for Blogger

How annoying it is, spending an awful amount of time researching and writing articles for your Blog, only to find out that some people have stolen your articles and reproduced them in their blogs as though they wrote them. Over the weekend, we decided to take action against one of the several “thieves” and we relate our experience here so that you have an idea how you should proceed when you meet someone who steals your website or Blog contents. Our Blog is exactly 5 months old and if such incident can happen to new bloggers like us, it can happen to you too.

Copyright

You see this legal term often. Basically, what it means is that if you are the author of a piece of work (writing, drama, music score, art, etc.), you own the “copyright” to that work. Under the laws of many countries, your works enjoy copyright protection. You can authorize or prohibit others from reproducing, distributing, publishing, displaying or performing your works.

In U.S. for instance, you need not register your work in order to secure your copyright. Copyright protection is automatic i.e., it starts the moment your work is created. Unlike the previous laws, there is also no longer a need for you to insert any copyright notice in your site reminding people of the copyright protection. You can put a notice, but you don't have to. Essentially, ignorance of the law is no excuse.

Theft and Hijacking

These are how the internet thieves steal:-

a. Writing and Images

They block copy your original writing, paste it into their Blog post. They use your images, graphics and artwork as well. Nothing is mentioned about you. Readers will think they wrote these articles. They establish their pool of readers and earn revenue through their AdSense impressions or clicks. Even if there is a mention about you somewhere, all their contents are lifted from you. You put in the efforts but they enjoy the rewards.

These people even went so far as to ask us questions which their own readers asked them. Once we replied to these Anonymous queries, they in turn let their readers know, in the manner that the answers came from them.

b. RSS Feed

You can put other people's Feed headlines into your Blog. Go to Template -> Page Elements -> Add a Page Element and select “Feed”. Type in the RSS or Atom Feed URL of that site and you will have the headlines of their five recent posts displayed in your Blog. Some blogs have no original content, except for these Feed headlines from many different blogs.

Many of us don't mind having these headlines in other blogs. Readers who want to learn more about the article will click these links and be brought to our Blogs. However, these thieves go beyond that. Some of them reproduce the full post based on the Feeds. We saw commercial sites using Feed converters to save our contents and put the articles up for sale to interested parties.

We had therefore changed our Feed settings from Full to Short, so that feed readers will only get an excerpt of the articles. If they want to know more, they will have to visit our site to read the details. If you want to change yours too, go to Settings -> Site Feed and under “Allow Blog Feed”, choose “Short”.

c. Hijacking

Instead of just a couple of posts, these thieves can steal everything from the layout and design to the contents and links, thus the term “blog hijacking”. Your site is literally duplicated. When we obtained our first Google Page Rank, a PR5, we found this problem to be rather serious. People were trying to pass off their sites as if they were ours or related to ours.

Steps to take when contents are stolen

1. Stay calm

It is natural to be angry at the thief. Let not anger taint our decisions. We must act professionally. If you are tempted to spam the thief's blog with threats and insults, please don't. You may in the process get yourself into unnecessary legal trouble. Not forgetting, a person who has no qualms stealing your contents can probably do you lots of other harm if he/she wants to. In that same spirit, although we shall make references to the thief who stole our content, we shall not be naming him. We shall call the thief Mr X in this article.

2. Identify what has been stolen

Before making any claim, we should be certain as to what has been taken from us. In our incident, it was a clear-cut case of hijacking. Mr X used a Blog title that could mislead the public into thinking that it was related to us, the description of the Blog was exactly the same as ours, the posts and pictures were an exact duplicate, and the post titles, colors and labels were the same.

Excerpt of Mr X's Blog description:-


Excerpt of Mr X's post titled “Add Video Clip to Blog”:-


It is important to save these as evidence of infringement. Go to the offending Blog site, click a “Print Screen” button on your keyboard. If you have a printer, save the printed copies. Otherwise, if you have a Photo software, open a new image file, paste the image and save. Note down the date and time these images were taken. We took only a few samples because there were simply too many; all the 23 articles on Mr X's site were ours.

3. Find the thief

Most of them do not have email addresses or contact particulars in their blogs or profile pages. Even if they do, they are likely to be fake. Nonetheless, there are several ways to ascertain the identity. In this case, Mr X had several other blogs under his profile page. One of them was titled Mahathir bin Mohamad, the contents were an exact replica of the page at Wikipedia relating to the former Prime Minister of Malaysia. There was another blog titled “Kelantan history”. We went to our visitor stats, tracked by Statcounter and Google, zoomed in on the unusual visitor activities, and identified the IP address of one that was from Kota Bharu in the state of Kelantan, Malaysia. We could be wrong. The person could have routed his traffic through Malaysia. He could very well be a U.S. citizen interested in Malaysian politics. Be that as it may, we had a possible lead.

Next, we visited his source page. In Firefox, go to “View” and “Page Source” or press Ctrl+U. In Internet Explorer, go to “View” and “Source”. From the source code, look for “google_ad_client” to find out his Google AdSense publisher number. Most of these thieves steal your content so that they can earn advertising revenue from visitors to their sites. Invariably, they will have some form of advertisements. If it is not AdSense, just look for any other Ad codes. Take note of all these. Better still, save a copy of the source code as evidence.

Read all the blogs by this person. Often, the remarks made in the comments or chatbox may give you an indication as to who the person is.

Search the net for other links to this person's identity. The blog may be registered in some blog directories. Start with Technorati, and move on to social networking sites. All you want is to gather as much information as possible regarding this person or his internet activities. If the matter becomes contentious, a court action may have to be filed and notice served on the offending party.

4. Contact the thief

After you have done sufficient homework, write your first note to the person. If there is no email address, leave a message in one of the posts. Our first message to Mr X was polite and non-confrontational. This was what we wrote:-

While I am honored that you have found my guides useful, copying them wholesale and reproducing them as if they are yours is an outright breach of copyright. Please remove the articles immediately.

We waited for a day and checked back. There was no response and the blog was still what it was. That was when we adopted a stern tone, and our second message was this:-

I have written to you yesterday informing you that you have illegally copied and reproduced my articles from my blog. These are original content of which I, as the author of the articles, own the copyright. Your act in reproducing them without my permission is clearly illegal under the laws. If you do not take immediate action to remove all the 23 offending articles, I shall proceed to inform all the relevant parties, including but not limited to Google, search engines, advertisers and the authorities. I reserve as well my rights to claim for any damages and costs as a result of your illegal action.

Mr X responded and said in our chatbox, “hello bro..sorry.i still new blogger.i delete all that article already...sorry again.” [No, he is not our brother. As I understand, it is their form of greeting.] His excuse was that he was new to blogging. Our response was simple - “I don't think copying or plagiarizing has to do with new or not new blogger. And from the way you copied, I think you know enough about coding, maybe more so than us.” There is no excuse for committing illegal acts and we are not going to feel bad just because they call themselves new bloggers.

With that, we let the matter rest. However, we want to let you know what we had prepared in the meantime while we awaited his response.

5. Contact directories

The first place we searched was one of our favorites - Technorati. We saw Mr X's blog and contacted the staff. We highlighted the infringement and requested for a temporary suspension of the offending blog while we proceeded to take the necessary actions. The staff was very prompt in their response and upon their review, they temporarily suspended the blog. Note that in this instance, every one of the 23 articles he had were ours. If it had been just one or two articles copied, the staff may not readily agree to a suspension of the listing. Since the articles have now been removed, we had written to the staff updating them on the matter.

Locate all the listings in the various directories and keep them handy. Often, if it were a genuine case, the administrators will take action or advise you on the cause of action. This is a damage control step. We want to minimize the exposure of these stolen content to other net users.

6. Contact advertisers

We were prepared to contact the Google AdSense staff since we had on hand the publisher number of Mr X. Under the AdSense policies, there is a term that reads:-

“Copyrighted Material

Website publishers may not display Google ads on web pages with content protected by copyright law unless they have the necessary legal rights to display that content. Please see our DMCA policy for more information.”

You can report the incident to them, although in order for them to act, they are likely to request that you file the official notice of infringement.

The details can be found at the Google page on the Digital Millennium Copyright Act. We prepared a draft of the notice which we would have used if Mr X did not respond. You have permission to adapt from this draft if you have to serve a similar notice to Google AdSense in future:-

[Date] Google, Inc. Attn: Google Legal Support, AdSense DMCA Complaints 1600 Amphitheatre Parkway Mountain View, CA 94043 [or Via Fax: (650) 618-8507, Attn: Google AdSense Support, DMCA complaints] Dear Sirs Copyright Infringement Notification for AdSense I am the author and copyright holder of the original articles at [blog address]. Among the copyright protected material are these articles at:- [Titles and URLs of original articles] I found out that another site at [thief's blog address] bearing the AdSense publisher ID [number] had used the abovementioned material without my permission, namely by reproducing them in their site as follows:- [Titles and URLs of offending articles] I have a good faith belief that use of the copyrighted materials as described above is not authorized by the copyright owner, its agent, or the law. I swear, under penalty of perjury, that the information in the notification is accurate and that I am the copyright owner or am authorized to act on behalf of the owner of an exclusive right that is allegedly infringed. Yours faithfully [Name] [Signature] [Address and contact particulars]

If there are other advertisers, contact them too. No advertiser will want to be embroiled in a copyright infringement battle. Chances are that they will withdraw the advertisements, temporarily or otherwise. Without advertisement revenue, the theft of the content becomes worthless for the thief.

7. Ban from Search Engines

The offending blog can be removed from search engine listings too. You can find out what you have to do for search engines like Yahoo, Google, and MSN when you come across sites that have stolen your Blog contents.

Update: Thanks to all our readers for the support. Jonathan Bailey and The Beading Gem, who shared their comments below, had correctly pointed out 2 major areas which we have not included in this article. Here are the updates.

8. Contact Blog Host

The Digital Millennium Copyright Act Title II “creates a safe harbor for online service providers (OSPs, including ISPs) against copyright liability if they adhere to and qualify for certain prescribed safe harbor guidelines and promptly block access to allegedly infringing material (or remove such material from their systems) if they receive a notification claiming infringement from a copyright holder or the copyright holder's agent.” Although worded differently, a quick check on the Copyright Acts of Commonwealth and other jurisdictions suggest that the spirit of their laws are similar. Under the terms of service, most blog hosts and service providers, like Blogger.com, will act on notice of copyright infringement and take actions which may include “removing or disabling access to material claimed to be the subject of infringing activity and/or terminating subscribers.”

We have talked about contacting Google AdSense and Google search engine. Although Blogger.com is owned by Google, being a big company, there are certainly different sets of people handling complaints like this. If the person's blog is registered with Blogger.com, you may use the above draft letter but change the addressee to:-

Google, Inc. Attn: Google Legal Support, Blogger DMCA Complaints 1600 Amphitheatre Parkway Mountain View, CA 94043 [or Via Fax: (650) 618-2680, Attn: Blogger Legal Support, DMCA Complaints]

These are the links to the detailed copyright protection policies of some of the popular blog hosts:-

• Blogger.com
• Wordpress
• Xanga
• Multiply.com
• LiveJournal
• Typepad
• MySpace
• Yahoo 360°
• Soulcast

9. Creative Commons License

If you do not want a full copyright protection, you can use a Creative Commons License and give certain rights to people to use, distribute or build upon your work. Read the terms of the various types of Creative Commons Licenses that you can use and choose the one that best suits your purpose. Click on the logo and you will be brought to another page where they give you the HTML code to place the appropriate logo into your Blog. If you want the logo in your sidebar, login, go to Template -> Page Elements -> Add a Page Element at the sidebar, choose HTML/JavaScript and paste the code. With the logo, viewers will know what license applies to the material in your Blog.

Let us as Blog owners be united in protecting our legal rights. If we come across any infringing sites, keep each other informed. In that way, we can protect our works and justify the blood, sweat and tears that we have put into them.

Read more...

Better Commenting System And Form For Blogger, IntenseDebate.

The most common question i hear from blogger users is ( can i have a better comments form ? )
alot of blogger users just want that simple form for the comments area that looks elegant and have a name ,e-mail and website boxs only,
Today we’ll learn how to convert our blogger regular comments form to another professional widget, this widget is presented by intensedebate.com

Widget Features.

• Ease of use:, your visitors just have to type, name and mail only.
• Threading: Reply directly to a specific comment with nested replies.
• Email Notifications: Receive alerts for replies and new comments.
• Reply-By-Email: Respond to and moderate comments via email.
• Comment Voting: Multiple Admins illustration Bring the best comments to the front.
• Moderation: Auto-filter comments by keyword, email and IP addresses.
• Spam Filters: Akismet keeps the spam at bay.
• And really more great features…

How To Add It To Your Blog.

we’ll look through the steps in simple points then we’ll read full instructions on how to add it for blogger.
here is the steps in a simple points.

sign up an account in IntenseDebate.com, and confirm your email.

go to your blogger account and download your current blogger template.

go back to IntenseDebate.com and login, then type your blog url there.

upload your blogger template in your IntenseDebate.com account,

IntenseDebate.com will automatically modify your blogger template and give it ready for use to you.

you’ll go to your blogger account and replace your current template with the one that you just got it from IntenseDebate.com

and you are done.

now lets read how to do it in a detailed instructions.

Step 1.

go to IntenseDebate.com and click sign up, fill the form with a true mail, username, and password, then click signup.
you’ll need to verify your e-mail, so please go to the email account that you used to register, you’ll find a message from IntenseDebate.com, please check it, you’ll find an activation link, click on it, and you are done.

Step 2.

now go to your blogger account, and navigate to >> layout >> edit html >> and click Download Full Template, and save your template in a convenient place on your hard drive.

Step 3.

now go back to IntenseDebate.com and on the top right area click login, and log on to your account, after you are loged in your account, on the right side bar
you’ll see this title, Manage blogs/sitesbelow it please click Install IntenseDebate.
then you’ll be taken for a page asking you to type your blog url,
enter your blog url and click next step.

Step 4.

After clicking next step. in step 3, you’ll go to page separated for 2 parts. on the left hand, there is a sidebar contain 2 questions,

• - How would you like to install IntenseDebate?
  - Widget
  - Template
  please choose Template, ( check the box next to it )
• - Which blog posts should have IntenseDebate comments enabled?
  - Only on new posts
  - On all blog posts
  please choose On all blog posts ( check the box next to it )

and then scroll down till you see a button titled ” Browse ” click on it, and choose your blogger template that you downloaded in step 2, then click Upload file.

Step 5.

IntenseDebate.com will modify and generate your new template automatically , and on the next page, you’ll see your new template code, please see the next image.

as you see in the above image, please click on the box, then copy the new generated template code.
then go to your blogger account and once more again, navigate to >> layout >> edit html >>
but this time select all the current template code ( ctrl + A ), delete it, then paste ( replace ) your new template code, and click, Save Template now go to check any of your blog posts.

demo and final words.

please visit this blog to see this widget and try it.
please note that some custom blogger templates won’t be compatible with this widget.

Read more...

Add FaceBook Like Button For Blogger ( BlogSpot )

A great way to drive more traffic to your blog posts is to use Social Media sites like Facebook. There is an easy way to place a link at the end of everypost so that users can add it to their facebook profile.

You can see an example of this @ the facebook junkie blog.

It's very easy, all you have to do is edit your HTML template. First
make sure you have the "Expand Widget Templates" tab selected. Then find this piece of code: "<data:post.body/>", and Below that place this:

<b:if cond='data:post.url'>
<br/>share on: <a expr:href='"http://www.facebook.com/share.php?u=" + data:post.url'>facebook</a>
</b:if>

:D

Read more...

Submit Blog to Search Engines ( SEO)

Search Engine Optimization (SEO) aims at increasing the volume and improving the quality of traffic to a website from search engine results. Search engines work on different algorithms to analyze the contents and keywords, and present the search results. Google, for instance, assigns page ranks to the sites and sites that rank highly will appear early in the results. Of course, many other factors are considered by search engines, such as relevance, unique content, coding and quality of links. The major search engines know that revealing these factors will only encourage manipulation of the ranking system and have thus been secretive about how the ranking algorithms work.

While no SEO consultant can be absolutely certain about how each search engine views your site, the common agreement is that the more visible your site is on the internet, the higher your ranking will eventually be. Having your site linked to by many other sites and indexed by different search engines increase its exposure and visibility. We have given readers a list of Blog Directories and Feed Directories. In this article, we shall provide a list of search engines where you can submit your website or Blog URLs for Free and have your site or Blog indexed by the search engines.

Website Indexing

Unless you have created a private blog, it is a matter of time that your blog is indexed by the major search engines like Google, Yahoo and MSN. One of the fastest ways to have your site indexed is to get another site that is already in the search engine listings to link to you. When the search engine crawlers visit that site, they will find your site and index it. We tried this out by linking to our new Blog and it appeared in Google search listings within three hours. Hence, try this method if you do not want to wait for search engines to approve your site submission.

Before we proceed to the list of search engine sites, there are a few points to note:-

1. To check if your site has been indexed by a search engine, enter the full URL into their search query. For some search engines like Microsoft Live Search, enter site: followed by the full URL. If you see your site appearing in the search results, it has been indexed and there is no need to resubmit the site.

2. If your Blog has been linked to by Blog Directories, websites or Blogs, you may see these other sites that mention your Blog appearing first in the search results. More likely than not, they have a higher page rank. Scroll through the remaining search result pages and you will probably find a listing that is solely about your Blog.

3. When submitting your site, you do not need to submit the URL of each individual webpage. Submit only the top-level webpage and for Blogger Blogs, it will be an address like this http://blogname.blogspot.com without the www. before the blogname.

4. You can submit your sitemap to Google and login to Google Webmaster site to know the status of the indexing and view traffic statistics. Also, submit your sitemap to Yahoo! to find out more about the index and links to your site. Submit Blogger Sitemap to MSN and Ask.com too.


5. If you add your URL in Yahoo!, it will appear in their other search sites like AlltheWeb and AltaVista as well. Similarly, AOL Search uses the data by Google.

6. Some of the sites send advertisements and newsletters to you in exchange for free submission. If you don't want that, remember to opt out of it. Avoid having your regular email account filled with these mail by creating another free web-based email account just for website submissions.

7. Since search engines have different standards of content, design and technical specifications, submission of your site does not guarantee that it will be included in their database.

List of Search Engines

You may submit your site URL to these search engines for Free. If you lack the time, submit your site to the top few leading search engines.

• Google
• Yahoo! Search
• Microsoft Live Search
• Alexa Web Search
• Baidu (Chinese search engine)
• ExactSeek
• SearchSight
• Scrub the Web
• EntireWeb
• Gigablast
• Exalead
• SearchKing
• whatUseek
• AnooX
• Splat Search
• Walhello
• SearchIt
• email Mozdex
• Jayde
• Infotiger
• Abacho (European search engine)
• Submit-one
• TowerSearch
• HotLaunch
• Shoula
• The-search-site
• Websquash
• Unasked
• eVisum (educational resource)
• DinoSearch
• SearchRamp
• SearchtheWeb
• SearchWarp
• Mixcat
• BestYellow
• Beamed

Website Submission Services

There are many sites on the internet offering free website submission services to search engines. The list of search engines are by and large the same. For a fee, some of them offer to send your URL to more than a hundred search engines. Is it necessary to have your webpage listed in all the smaller search engines? We think that Google, Yahoo! and MSN have cornered such a large share of the market that it is sufficient just to have your website listed there. However, the decision is yours to make. For a start, you may want to use their free services and monitor the traffic.

• FastSubmit
• Submit Express
• AddMe
• Freesubmissionweb
• ineedhits
• Submitshop
• Searchengineoptimising
• AddPro
• Pageranklist
• Freewebsubmission
• Amfibi
• Burf
• Jerkasmarknad
• LocalSubmit
• SrSubmit

Read more...

Add Digg button to Blogger or Blogspot

This is a step-by-step guide to automatically place a real-time Digg count and vote button to every single blog post. Digg is a social content website where your readers or you can submit content to. If you have a good story, members will 'digg' the post and write comments. As a blog owner, you may want to make it easy for and encourage your readers to submit and digg your articles.

Automatic Count and Vote Button

Before you do that though, you would want to take note of the following:-

1. Your blog should be set to save Post Pages. Post Pages are archived blog posts published to their own web page. Each post will have a unique URL, which is required by Digg for the individual posts to be submitted. To verify or enable it, login to your Blogger Dashboard. Under Settings-> Archiving, set the “Enable Post Pages?” to “Yes” and save the settings.

2. This template hack will put a Digg button to every post. You are therefore not able to choose which post you want to include or exclude a button. If you would prefer to have a Digg button added only to some posts, read the later part of this article on “Button for selective posts.”

3. The code reads the URL of the individual blog page and this shall be the URL used for submission of the story to Digg.

Under “Template”, click the “Edit HTML” tab. Block copy the entire HTML code for your site and save it in a text file. You can also click the "Download Template" link. This is one of the two necessary steps whenever you want to change the template. The second step is of course to “Preview” the new changes, and save the changes only when you are satisfied. The backup you have saved in a text file will come in handy when you accidentally click to save the changes without previewing them. With a backup, you can easily restore the template to the prior state if need be.



Click the box next to “Expand Widget Templates”. Scroll about two-thirds down the template to look for the code that reads:-

<p><data:post.body/></p>

If you want the button to show at the top right corner of your post, replace the above code with this.

<div style='float:right; margin-left:10px;'> <script type='text/javascript'> digg_url=&quot;<data:post.url/>&quot;; </script> <script src='http://digg.com/tools/diggthis.js' type='text/javascript'/> </div> <p><data:post.body/></p>

This is what you get:-



If you would like the button to appear at the end of your post, replace with this following code instead.

<p><data:post.body/></p> <div style='float:right; margin-left:10px;'> <script type='text/javascript'> digg_url=&quot;<data:post.url/>&quot;; </script> <script src='http://digg.com/tools/diggthis.js' type='text/javascript'/> </div>

The result will be this:-



If you want to have the button at the top left corner of your post, change the alignment.

<div style='float:left; margin-right:10px;'> <script type='text/javascript'> digg_url=&quot;<data:post.url/>&quot;; </script> <script src='http://digg.com/tools/diggthis.js' type='text/javascript'/> </div> <p><data:post.body/></p>

The outcome is this:-



Digg has another compact button. If you insert this code:-

<div style='float:right; margin-left:10px;'> <script type='text/javascript'> digg_url=&quot;<data:post.url/>&quot;; digg_skin=&quot;compact&quot;; </script> <script src='http://digg.com/tools/diggthis.js' type='text/javascript'/> </div> <p><data:post.body/></p>

You will see a compact Digg count button like this:-



You can also change the background color of the button to blend with your site. For example, a code like this:-

<div style='float:right; margin-left:10px;'> <script type='text/javascript'> digg_url=&quot;<data:post.url/>&quot;; digg_bgcolor=&quot;#BDEDFF&quot;; digg_skin=&quot;compact&quot;; </script> <script src='http://digg.com/tools/diggthis.js' type='text/javascript'/> </div> <p><data:post.body/></p>

will give you this:-



You can insert the color code of your choice into the red portion. For a list of color values to insert, you may refer to the Hexadecimal HTML color code list.

Automatic Count Button in Blog Footer

[Update] This segment is added in response to user's request to have the Digg button in the Blog footer, i.e., after the labels. If you scroll through your template, you will see this chunk of code which gives the labels in your Blog footer.

<p class='post-footer-line post-footer-line-2'> <span class='post-labels'> <b:if cond='data:post.labels'> <data:postLabelsLabel/> <b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if> </b:loop> </b:if> </span> </p>

If you want a Digg button to appear just after the labels, add the appropriate Digg button code right after the above code. For example, if you want the compact Digg button, add this code below the labels code:-

<div style='float:right; margin-left:10px;'> <script type='text/javascript'> digg_url=&quot;<data:post.url/>&quot;; digg_skin=&quot;compact&quot;; </script> <script src='http://digg.com/tools/diggthis.js' type='text/javascript'/> </div>

The resulting layout is this:-



Move the Digg button code above the labels if you'd like. Experiment a little. Just remember to preview the template and not to save it unless you are satisfied.

Digg Button in Blog Footer

If you do not want to see an Automatic Count button, you can also place a link button into the template. This button will appear at the bottom right corner of every post and readers can click it to submit that post to Digg.

Scroll to this part of the template and insert the lines (in red):-

<div class='post-body'> <p><data:post.body/></p> <div style='clear: both;'/> <!-- clear for photos floats --> </div> <div style="float:right; margin-left:10px;"> <a expr:href='"http://digg.com/submit?phase=2&amp;url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'><img border="0" alt="Digg this" src="http://digg.com/img/badges/91x17-digg-button.gif"/></a></div>

With the code, this is what you will see at the end of every post.



You can change the position of this button. Go through what we discussed earlier in this article to understand where to place the code if you should want the button to be at the top of the article.

The button 91x17-digg-button.gif is simply an example. As the following section explains, there are many buttons you can use. To change the button to another design, replace the image URL with that of the new button.

Button for selective posts

The methods of manually adding a Digg button to selective posts are rather tedious and complicated. The problem is that Blogger does not allow you to simply insert a JavaScript into a blog post. Since this blog is targeted at the majority of us who are not computer experts, I shall suggest a method that I think is simple enough for us.

First, go to the Digg tools site to select a Digg button that you like. You will see a wide selection of Digg buttons.







Take note of the image URL. For example, the image URL of this button is

http://digg.com/img/badges/91x17-digg-button.gif

Write a post and publish it. Next, refresh the page and click on the title of your post. This will bring you to the post page. Take note of the new URL of your story. Insert it into the orange portion of this HTML code. If you want a different image, insert the image URL into the blue portion of the code.

<a href="http://digg.com/submit?phase=2&url=URLofyourstory" target="_blank"><img border="0" alt="Digg my article" src="http://digg.com/img/badges/91x17-digg-button.gif"/></a>

Now, go back to your article and Edit it. Choose the “Edit HTML” mode and not “Compose” mode. Copy the above code and paste it into whichever part of your blog article. “Preview” it, and if you are happy with it, “Publish” it.

For this article, I have manually inserted the Digg button. If you would like to Digg this article, or just to see how it works, click this button.

Read more...