All blogger tools

How To Set Up Co.CC Domain hosting For Blogger

noreply@blogger.com (The Fox Multimedia) — Sun, 28 Aug 2011 09:15:00 +0000

As Kang Rohman promised before, Kang Rohman would discuss about how to set up the Co.CC domain for blogger. To do it is easy; you only need to do setting at the dashboard Co.CC. However, need to know that Kang Rohman suggest you to change your blogspot with Co.CC for your new blogspot blog, not for your old blog, why so? Because if you do the change to your old blogspot, whether with domain of Co.CC, .com, .net or anything else, your blog will be consider as the new blog.

I mean, what you have built to your old blog will be in vain and useless, for instance, the backlinks, your registration to several websites for the improvement of your blog, and more. You should start it again from the beginning or do the change to your registration setting. Therefore, Kang Rohman suggests you to change the blogspot domain only to your new blog. However, if you think you should do that due to any reason and consideration, just go on.

Well, let’s get our point, below is how to set up or change blogspot domain with Co.CC:

Click here if you have not yet had your Co.CC domain. Please register first if you haven’t has your own account.
After you have your account, please sign in to www.co.cc with your account.
Click the Getting A New Domain tab (with assumption that you haven’t had your domain name).
Type the domain name you want, click the Check availability button to check the availability of your domain name, repeat if unavailable.
If the domain name is available, click Continue to registration button as the screenshot below
Congratulations, you now have your own domain name of Co.CC. To be noted, you haven’t managed the setting to your new domain.

In order to do setting to your new domain of Co.CC you can follow these steps below:

As usual, you sign in first with your account, then click Domain Settings as you see at the screenshot below
Click Set up at your new domain name as seen at the screenshot below, then it will appear the wordsPlease domain setup now as the notification that your new domain name of Co.CC has not been set up.
Click the words Please domain setup now to set up your new domain name of Co.CC. On this page, you will choose one of the three domain setup as Manage DNS, Zone Record, and URL Forwarding. For those who want to change the blogspot domain name with Co.CC, you should choose the Zone Record by click it or its radio button.
After you choose Zone Record, there will appear the setting option as the screenshot below
At the dialogue box, fill the Host with your domain name of Co.CC, e.g. www.loanconsulting.Co.CC(the Host name of my Co.CC domain). Then at TTL let it as 1D, for Type, choose CNAME, and Valuefill with ghs.google.com. After all fields are filled out, click the Set up button. You can see the example of my setting as the screenshot below
Now you finish setting your new Co.CC domain, but usually you have to wait for about 48 hours until your new domain is active.

Well, now it’s time to change the blogspot domain with Co.CC domain. Please follow the steps below:

Log in to blogger with your account.
Click Settings at the dashboard
At the Settings page, click Publishing
When you are at the Publishing page, click Custom Domain
At the page of Publishing on custom domain, you are not asked to buy the domain (except you want it), but we will use the blogspot domain that we have made, then click Switch to advanced settings to change your blogspot domain with Co.CC domain.
At the page of Advanced Settings fill with your Co.CC domain at the field of Your Domain e.g.www.loanconsulting.Co.CC (it’s my Co.CC domain). The for Use a missing files host? Leave it asNo and at the field of Word Verification fill with the words that appear with blur (colored and unclear). After all fields are filled out, click Save Settings.
Be sure that Save Setting at Point 6 is successful with the sign as the words Settings Were Saved Successfully at upper right of the page
You have finished changing your blogspot domain with Co.CC domain.

Note: usually you have to wait for about 48 hours until your new domain is active as Co.CC regulation.

If you are interested in changing your blogspot domain with Co.CC domain, happy trying and good luck.

Make Free Dollars From Co.CC

noreply@blogger.com (The Fox Multimedia) — Sun, 28 Aug 2011 09:13:00 +0000

In the previous post, Kang Rohman posted about Free Domain from Co.CC. In the post, Kang Rohman promised to explain how to set up domain Co.CC for blogger, but before that, Kang Rohman would like to share information about how to get free dollar from Co.Cc.

There are two benefits we can get from Co.CC, the first you can get more than one free domain, and the second you can get free dollars by joining the Co.CC referral program. You will be paid $0.1 each time new referral joins through you. The payment can be delivered via Paypal.

Will you get the loss by joining this program? Not at all. In Kang Rohman’s opinion, you won’t get the loss, but in the contrary, you will get the benefits and profits because Co.CC doesn’t ask a payment from you. You only need to place link or banner from Co.CC (with your referral link code) on your blog or website, and then let Dollars flow to your Paypal.

So what keeps you waiting? Register yourself to Co.CC; click the banner below to join.

For those who have not yet had Paypal account, you can register freely as well; click the banner below to get your free account of Paypal.

Happy hunting free dollars from Co.CC

Notes: You have no obligatory to use Co.CC domain for your blog, you can use it for any web. If you want to get your Paypal account but you don’t have credit card to verify, you can use Virtual Credit Card, to get this, just do googling.

4 new translator widget style for blogger & website

noreply@blogger.com (The Fox Multimedia) — Sun, 28 Aug 2011 02:27:00 +0000

1.Log in to your dashboard--> layout- -> Edit HTML

2.Click on "Expand Widget Templates"

3.Scroll down to where you see this:

<data:post.body/>

4.Copy below code and paste it immediately after the line <data:post.body/>

style 1

<div id="translator_20027"><noscript>Javascript est desactiv&eacute; - <a href="http://www.supportduweb.com/">Support du web</a> - <a href="http://www.supportduweb.com/generateur-boutons-traduction-translation-google-gratuit-html-code=script-boutons-traduire-page-web.html">Boutons Traduction enligne site web</a></noscript></div><script type="text/javascript" src="http://services.supportduweb.com/translator/20027-1-yyyyyyyyy.js"></script>

style 2

<div id="translator_41552"><noscript>Javascript est desactiv&eacute; - <a href="http://www.supportduweb.com/">Support du web</a> - <a href="http://www.supportduweb.com/generateur-boutons-traduction-translation-google-gratuit-html-code=script-boutons-traduire-page-web.html">Boutons Traduction enligne site web</a></noscript></div><script type="text/javascript" src="http://services.supportduweb.com/translator/41552-2-yyyyyyyyy.js"></script>

style 3

<div id="translator_38715"><noscript>Javascript est desactiv&eacute; - <a href="http://www.supportduweb.com/">Support du web</a> - <a href="http://www.supportduweb.com/generateur-boutons-traduction-translation-google-gratuit-html-code=script-boutons-traduire-page-web.html">Boutons Traduction enligne site web</a></noscript></div><script type="text/javascript" src="http://services.supportduweb.com/translator/38715-3-yyyyyyyyy.js"></script>

style 4

<div id="translator_63473"><noscript>Javascript est desactiv&eacute; - <a href="http://www.supportduweb.com/">Support du web</a> - <a href="http://www.supportduweb.com/generateur-boutons-traduction-translation-google-gratuit-html-code=script-boutons-traduire-page-web.html">Boutons Traduction enligne site web</a></noscript></div><script type="text/javascript" src="http://services.supportduweb.com/translator/63473-4-yyyyyyyyy.js"></script>

5.Click on "Save Templates" and now you are done.

demo:

How To add Youtube Subscribe Widget on Blogger

noreply@blogger.com (The Fox Multimedia) — Fri, 26 Aug 2011 15:32:00 +0000

Everybody knows how Youtube works and it become the most popular place to search any video. Do you? So, HOW-TO HOUSE will guide how to embed Youtube Subscribe Widgeton your blog. It's simple and easy. You can add the widget in just 3 steps :

1. Go to your Dashboard >> Design >> Page Element >> Add a Gadget.

2. Copy and paste this code below in it :

<iframe src=http://www.youtube.com/subscribe_widget?p=YOURCHANNEL NAME style="overflow: hidden; height: 105px; width: 300px; border: 0;" scrolling="no" frameBorder="0"></iframe>

3. Save and DONE!

Customization

You can change the height & width edit the code in red.

And, the widget will look something like this.

Add Sharing is Sexy Social Bookmarking Widget in Blogger

noreply@blogger.com (The Fox Multimedia) — Fri, 26 Aug 2011 05:40:00 +0000

Social Bookmarking is one of the smart ways to increase traffic on your blog.In order to attract your readers to bookmark and share your posts,attractive and sexy social bookmarking icons are must.Now i will tell you how you can add sexy share the love social bookmarking widget to your blogger blog.These icons use the magic of jquery and show up on mouse hover.When mouse move away from icons they auto hide.To see how it works you can see the demo below.You can see the widget below the blog posts.

Installation

Go to Layout > Edit HTML from your blogger Dashboard select Expand Widget Templates.Insert the below code before </head>.
<style type=’text/css’>
div.sexy-bookmarks {
height:54px;
background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat left bottom;
position:relative;
width:540px;
}

div.sexy-bookmarks span.sexy-rightside {
width:17px;
height:54px;
background:url('http://i43.tinypic.com/2ueii3t.png') no-repeat right bottom;
position:absolute;
right:-17px;
}

div.sexy-bookmarks ul.socials {
margin:0 !important;
padding:0 !important;
position:absolute;
bottom:0;
left:10px;
}

div.sexy-bookmarks ul.socials li {
display:inline-block !important;
float:left !important;
list-style-type:none !important;
margin:0 !important;
height:29px !important;
width:48px !important;
cursor:pointer !important;
padding:0 !important;
}

div.sexy-bookmarks ul.socials a {
display:block !important;
width:48px !important;
height:29px !important;
font-size:0 !important;
color:transparent !important;

}

.sexy-furl, .sexy-furl:hover, .sexy-digg, .sexy-digg:hover, .sexy-reddit, .sexy-reddit:hover, .sexy-stumble, .sexy-stumble:hover, .sexy-delicious, .sexy-delicious:hover, .sexy-yahoo, .sexy-yahoo:hover, .sexy-blinklist, .sexy-blinklist:hover, .sexy-technorati, .sexy-technorati:hover, .sexy-facebook, .sexy-facebook:hover, .sexy-twitter, .sexy-twitter:hover, .sexy-myspace, .sexy-myspace:hover, .sexy-mixx, .sexy-mixx:hover, .sexy-script-style, .sexy-script-style:hover, .sexy-designfloat, .sexy-designfloat:hover, .sexy-syndicate, .sexy-syndicate:hover, .sexy-email, .sexy-email:hover {
background:url('http://i44.tinypic.com/1znbj83.png%27') no-repeat !important;
}

.sexy-furl {
background-position:-300px top !important;
}
.sexy-furl:hover {
background-position:-300px bottom !important;
}
.sexy-digg {
background-position:-500px top !important;
}
.sexy-digg:hover {
background-position:-500px bottom !important;
}
.sexy-reddit {
background-position:-100px top !important;
}
.sexy-reddit:hover {
background-position:-100px bottom !important;
}
.sexy-stumble {
background-position:-50px top !important;
}
.sexy-stumble:hover {
background-position:-50px bottom !important;
}
.sexy-delicious {
background-position:left top !important;
}
.sexy-delicious:hover {
background-position:left bottom !important;
}
.sexy-yahoo {
background-position:-650px top !important;
}
.sexy-yahoo:hover {
background-position:-650px bottom !important;
}
.sexy-blinklist {
background-position:-600px top !important;
}
.sexy-blinklist:hover {
background-position:-600px bottom !important;
}
.sexy-technorati {
background-position:-700px top !important;
}
.sexy-technorati:hover {
background-position:-700px bottom !important;
}
.sexy-myspace {
background-position:-200px top !important;
}
.sexy-myspace:hover {
background-position:-200px bottom !important;
}
.sexy-twitter {
background-position:-350px top !important;
}
.sexy-twitter:hover {
background-position:-350px bottom !important;
}
.sexy-facebook {
background-position:-450px top !important;
}
.sexy-facebook:hover {
background-position:-450px bottom !important;
}
.sexy-mixx {
background-position:-250px top !important;
}
.sexy-mixx:hover {
background-position:-250px bottom !important;
}
.sexy-script-style {
background-position:-400px top !important;
}
.sexy-script-style:hover {
background-position:-400px bottom !important;
}
.sexy-designfloat {
background-position:-550px top !important;
}
.sexy-designfloat:hover {
background-position:-550px bottom !important;
}
.sexy-syndicate {
background-position:-150px top !important;
}
.sexy-syndicate:hover {
background-position:-150px bottom !important;
}
.sexy-email {
background-position:-753px top !important;
}
.sexy-email:hover {
background-position:-753px bottom !important;
}

</style>
Now search for <data:post.body/> and insert below code after it.

</ul>
<span class=’sexy-rightside’/></div>

<div class=’sexy-link’> Distributed by <a href=’http://www.bloggertemp.com/’ title=’Blogger widgets’>Blogger Widgets </a>
</div>

The installation part is finished.I hope you will love this widget.If there is any problem in implementing this widget please do tell me.

add related post widget to blogger

noreply@blogger.com (The Fox Multimedia) — Fri, 26 Aug 2011 04:52:00 +0000

This widget is totally free for all platforms including Wordpress, blogger, Typepad etc there is no signup required to get this widget it takes a minute and having few easy step to running on your blog.

The steps below

1. Go to LinkWithin website.

2. Fill the form place on the right hand of the site by putting your Email address, Blog link, choose platform and number of stories you want to add. User can check the box according to condition.

3. Click on the "Get Widget!".

If you choose Google blogger blog a page on "install widget on blogger" will pop up. Then follow the instruction to get or install the widget on your blog.

Finally you see linkwithin widget installed on your blog pos

how to Add Facebook Share Button in Blogger

noreply@blogger.com (The Fox Multimedia) — Fri, 26 Aug 2011 00:20:00 +0000

Social media sites like Facebook & Twitter could be great source of quality traffic for any blog. You can also add a Facebook share button in each of your posts. This button will allow users to quickly share a post on Facebook.

Steps to Add Facebook Share Button Below Post Title

To add Facebook share button below post title, simply follow these steps:

Back up your layout/template.
Go to Layout then Edit HTML tab.
Check Expand Widget Templates. The page will automatically refresh.
Now find this code:
```
<data:post.body/>
```

Place the following code right before the code found in step 4:

<!-- Facebook Button -->
<div style='float: left; padding: 5px; '>
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='TYPE OF BUTTON'/>
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>
</div>
<!-- Facebook Button -->

The result should look something like this:

<!-- Facebook Button -->
<div style='float: left; padding: 5px; '>
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='TYPE OF BUTTON'/>
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>
</div>
<!-- Facebook Button -->
<data:post.body/>

Click Preview button to see the result and then save your template.

Add Facebook Share Button Below Post Body

To place the Facebook share button under each post, you have to follow the exact steps given above but step 5 is a little changed.

5- Place the following code right below the code found in step 4:

<!-- Facebook Button -->
<div style='float: left; padding: 5px; '>
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='TYPE OF BUTTON'/>
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>
</div>
<!-- Facebook Button -->

The result would look something like this:

<data:post.body/>
<!-- Facebook Button -->
<div style='float: left; padding: 5px; '>
<a expr:share_url='data:post.url' name='fb_share' rel='nofollow' type='TYPE OF BUTTON'/>
<script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'/>
</div>
<!-- Facebook Button -->

Button Modifications

You can also change the button type like adding a counter with the button. All you need is to replace TYPE OF BUTTON from the above code with:
button for a button like this:

button_count for a button like this:

box_count for a button like this:

icon for a button like this:

How to add SWF files to blogger posts

noreply@blogger.com (The Fox Multimedia) — Thu, 25 Aug 2011 23:23:00 +0000

Adding images and videos to blogs is as easy as pie. HTML already supports images through the IMG tag and videos can be inserted through the "Add Video" options in blogger. Even if your blogging platform doesn't give you an easy way to add videos you can do so by uploading the videos to video sharing sites like YouTube. YouTube will generate a link to the video which you can use to embed that video in your blog. But adding SWF files isn't such straightforward. For this you have to add a small code to your blog. It's very easy. Just upload the SWF files to ImageShack or any other image sharing site. Now add the following code wherever you want the flash file to appear in your blog post and then replace file_url with the actual link to the flash file.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash /swflash.cab#version=6,0,29,0" width="405" height="400">

<param name="movie" value="file_url">

<param name="quality" value="high">

<embed src="file_url" quality="high" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="405" height="400"></embed></object>

Note, that the "width" and "height" values in the above code needs to be changed too according to the size of the flash file. See this example below:

How to activate your bloger on mobile

noreply@blogger.com (The Fox Multimedia) — Thu, 25 Aug 2011 20:38:00 +0000

This year, Blogger's team added so many new features that it's difficult to count them:dynamic templates, comment spam filtering, a new way to manage comments, real-time stats, better post preview, static pages and so much more. Blogger is one the few Google products that have improved dramatically this year, after many years when it was neglected.

Since a lot of people use phones to browse the Web, it makes a lot of sense to add a mobile interface for Blogger and to create mobile versions for Blogger's templates. There's no mobile Blogger yet, but all Blogger blogs have a mobile version optimized for WebKit browsers. Just add ?m=1 to the URL of any Blogger blog, and you'll get a simplified version that works well on an iPhone, Android phone and probably other phones that use a browser based on WebKit. Here's an example:

http://allbtools.blogspot.com/?m=1

Bloggers can enable the mobile version of their blogs, so that visitors are automatically redirected to this version when they're using a supported mobile browser. This option is only available if you go to Blogger in Draft, click on "Settings", switch to "Email & Mobile" and enable "Yes, On mobile devices, show the mobile version of my template." This didn't work for me, so you'll still see the regular mobile version of this blog that uses a custom stylesheet.

Google says that the new feature only supports 12 existing templates (6 variants of the Simple template and 6 variants of the Awesome template) and that all the other templates will be rendered as the Simple template. The mobile version drops the sidebars and most of the gadgets, shows small excerpts from the posts on the homepage, hides the comment form (but you can still post comments), resizes images and videos, adjusts fonts and converts AdSense ads into mobile ads. Unfortunately, you can't customize mobile templates, at least not yet.

How to Add Wibiya Toolbar to Blogger

noreply@blogger.com (The Fox Multimedia) — Thu, 25 Aug 2011 19:27:00 +0000

I love the Wibiya toolbar. It's a great way to connect with your visitors and who doesn't love doing that!

So let's learn how to install this simple easy toolbar.

Step 1. Head over to Wibiya and create your account. (click on any of the images to enlarge)

2. Decide which features or tools you want added to your toolbar.

3. Choose to install on websites and other blog platforms. Yes we see that Blogger is there but, trust me :)

4. Copy the code given and head over to Blogger dashboard. Log into your blog and click on template.

5. Make sure you are under the template tab and scroll to the very bottom of all your code. Right above the body tag.

6. Save template changes and view your blog.

7. Pat yourself on the back for a job well done!

add best video player to blogger

noreply@blogger.com (The Fox Multimedia) — Thu, 25 Aug 2011 02:32:00 +0000

First of all, go to the setup tool and get the player ready. I found that the player fits best when resized to around 400x225, but you may like to try a few different sizes depending on your blog theme.
Copy the generated code and paste it into your "New Post" form — making sure you paste it into the HTML view, not the standard view.
Now here's the important part: If you post the code as is, blogger.com will automatically add unwanted tags to the code and stop it working (<br> tags to be exact). You need to remove all the line breaks so the code is effectively one long line. It should look something like this:

<script type="text/javascript">playerFile = "http://www.mcmediaplayer.com/public/mcmp_0.5.swf";fpButtonOpacity = "25";fpFileURL = "http://www.space-video.info/flv/mars/mer2003-sfx-dvd-24p-ac3.flv";fpPreviewImageURL = "http://www.space-images.com/video/images/previewImage_mer.jpg";playerSize = "400x225";</script><script type="text/javascript" src="http://www.mcmediaplayer.com/public/mcmp_0.5.js"></script>

You may need to post the blog before you see the video appear — I found that the preview is unreliable. If the video hasn't worked, check to make sure there are no line breaks in the code. You could try copying the code into Wordpad first so it's easier to see.
An alternative method is to change your settings so the line breaks aren't converted to tags. This is what I do and it works well, but it does mean that all formatting must now be done manually with HTML. For example, you need to add <p> tags for paragraphs. If you like full control this is the best option but if you don't fancy having to constantly enter HTML tags you probably won't like it.
If you still can't get it going try asking for help in the

demo:

Google +1 Button Code Generator

noreply@blogger.com (The Fox Multimedia) — Wed, 24 Aug 2011 04:13:00 +0000

sitmap Submitter

noreply@blogger.com (The Fox Multimedia) — Tue, 23 Aug 2011 19:07:00 +0000

Submit a Complete Sitemap of your Blogger Blog to Google for Better Indexing

noreply@blogger.com (The Fox Multimedia) — Tue, 23 Aug 2011 15:01:00 +0000

Sitemaps, in simple English, are text files (see example) containing a list of all web pages that exist on your site. It is important that you create a comprehensive sitemap as it will help Google and other search engines crawl your site better and that might mean more traffic coming your way in the long run.

The Problem with Blogger Sitemap Files

Ideally, the sitemap file should contain all URLs of a site but if your blog is hosted on blogspot.com (or if you are using a self-hosted version of Blogger with a custom domain), you'll be surprised to know that the default sitemap file (see example) contains only the 26 most recent pages of your blog.

That's a bad thing because some of your older blog pages, that are missing from the system-generated sitemap file, may never get indexed in search engines. There's however a simple solution to fix this problem.

Generate a Complete Sitemap for your Blogger Blog

Step 1: If you haven't done this already, sign-in to your Google Webmasters account and add your blog. For details, check this video tutorial on how to add a blog to Google.

Step 2: Once your blog is added to Google, open the Sitemap Generator and type the full address of your blogspot blog (or your self-hosted Blogger blog).

Step 3: What you get is list of sitemap files that contain each and every page of your blog. You now just have to ping Google, Yahoo and Bing to inform them about these XML sitemaps.

As shown in the video screencast below, you need to manually add each of the sitemap files into your Google Webmaster Tools dashboard but for Bing or Yahoo, you can simply click blue hyperlinks and these search engines will automatically download the relevant sitemap files from your blogspot site.

Once all the Sitemaps are added, your Google Dashboard should look something like this.

If you see a red cross or an orange exclamation symbol instead of the green tick, that means something is wrong with your XML sitemap. Verify that the file exists by typing the sitemap URL in your browser.

Sometimes media enclosures (like MP3 files) in blog posts can create warnings during sitemap submission. And if you have switched from Blogger to WordPress, it still makes sense to submit sitemaps of your old Blogspot blog as that will only help search engines discover your new WordPress pages. Good luck.

Migrate your Blog from Blogger to WordPress

noreply@blogger.com (The Fox Multimedia) — Tue, 23 Aug 2011 15:00:00 +0000

The Goal: Your current blog at abc.blogspot.com is hosted on the Blogger platform but you now want to move this blog from Blogger to WordPress (self-hosted) with a personal domain name (say abc.com).

The Problem: WordPress.org provides an easy option to automatically import all your old blog posts and reader comments from Blogger into your new WordPress blog but there are still some bigger problems that are hard to ignore:

1. Some of your previous articles on the blogspot blog could be ranking very high in search engines for certain keywords but once you shift these articles to a new address, you might lose all that organic search traffic.

2. You cannot use a 301 redirect with Blogger to inform search engines that your site has permanently moved a new web address thus losing PageRank and other Google Juice.

3. Not just search bots, human beings who come to read your old articles via links from other sites won't know about the new location of those articles unless you manually insert the new links in each and every blogspot article (impossible for large blogs).

4. When you switch blogging platforms, existing blog readers who are subscribed to your Blogger RSS Feed may be lost forever if they don't manually update their RSS readers with your new WordPress feed address (and most won't).

5. When you lose RSS subscribers and search engines rankings, the pageviews will drop and that will seriously impact your AdSense revenue in case you are running Google ads.

The Solution: Now that you are aware of the various issues associated with moving sites from Blogger to WordPress, the very good news is that there exists a simple solution to deal with all these problems in one go.

You can quickly and safely migrate any blog from Blogger to WordPress without losing RSS Subscribers or human visitors and there's also a way to pass all that Google Juice from the old blogspot.com address to your new WordPress blog.

How to Move a Blog from Blogger to WordPress

Important: Before you implement anything, it may be a good idea to run through these steps on a dummy blog first. Also, backup your Blogger blog including the XML template, posts and comments just to be the safe side.

If something doesn't make sense, just watch the screencast video below (download).

Step 1: In case you haven't done this already - register a new web domain, buy server space from some web hosting company* that offers PHP / MySQL hosting and and install WordPress software on your new domain.

*This site is hosted on Dreamhost.com but there are other good hosting options like GoDaddy, Blue Host, Media Temple and Knowhost - most services offer one-click WordPress installation so you don't need the help of a geek.

Step 2: Go to your WordPress Admin Dashboard -> Tools -> Import and select the Blogger option. Authorize WordPress to access your Google Account and within minutes, all your old blog posts and comments will be available on the new WordPress site.

Step 3: Copy this file into your WordPress themes directory and then rename the file from blogger.php.txt to blogger.php. You may use either Putty with wget or Web FTP to access your WordPress themes directory located on the web server. For credentials and other details, check your cPanel.

Here are the contents of that file.

<?php
 /*
  Template Name: blogger
 */

 global $wpdb;
 $old_url = $_GET['q'];

 if ($old_url != "") {
   $permalink = explode("blogspot.com", $old_url);

   $q = "SELECT guid FROM $wpdb->posts LEFT JOIN $wpdb->postmeta ".
        "ON ($wpdb->posts.ID = $wpdb->postmeta.post_id) WHERE ".
        "$wpdb->postmeta.meta_key='blogger_permalink' AND ".
        "$wpdb->postmeta.meta_value='$permalink[1]'";

  $new_url = $wpdb->get_var($q)? $wpdb->get_var($q) : "/";

  header ("HTTP/1.1 301 Moved Permanently");
  header("Location: $new_url");
 }
?>

Step 4. Open your WordPress dashboard and go to Pages -> Add New Page. Keep the title and URL of that page as blogger and select "blogger" from the Template drop-down. Save. There's no need to add any content to this page.

Step 5. Open the template generator, type the full address of your new WordPress blog (including http:// and the trailing slash) and this tool will create a new classic template for your blogspot blog that will look something like this.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" dir="<$BlogLanguageDirection$>">
<head>
<title><$BlogPageTitle$></title>
<script type="text/javascript">
 <MainOrArchivePage>window.location.href='http://labnol.org/'</MainOrArchivePage>
 <Blogger><ItemPage>
   window.location.href='http://labnol.org/blogger/?q=<$BlogItemPermalinkURL$>'
 </ItemPage></Blogger>
</script>

<MainPage><link rel="canonical" href="http://labnol.org/" /></MainPage>
<Blogger><ItemPage>
 <link rel="canonical" href="http://labnol.org/blogger/?q=<$BlogItemPermalinkURL$>" />
</ItemPage></Blogger>
</head><body>

<div style="border:#ccc 1px solid; background:#eee; padding:20px; margin:80px;">
<p>This page has moved to a new address.</p>

<h1>
<MainOrArchivePage><a href="http://labnol.org"><$BlogTitle$></a></MainOrArchivePage>
<Blogger><ItemPage>
 <a href="http://labnol.org/blogger/?q=<$BlogItemPermalinkURL$>"><$BlogItemTitle$></a>
</ItemPage></Blogger>
</h1>
</div>
</body></html>

<!-- replace labnol.org with your WordPress site URL --->

Step 6. Open your Blogger Dashboard -> Layout -> Edit HTML and choose "Revert to Classic Blog". Copy-paste the template generated in Step 5 in the "Edit Template" area and click "Save Template Changes".

Your are done. Open any page on your old Blogger blog and it should redirect you to the corresponding WordPress page. On the WordPress side, since we are using a permanent 301 redirect with the redirection URLs, all the Google Juice will probably pass to your new WordPress pages with time.

Update your RSS Feed: When you move from Blogger to WordPress, the address of your RSS feed will change as well. Go to Blogger -> Settings -> Site Feed, type the address of your new WordPress RSS feed here and Google Reader, Bloglines, etc. will automatically move to your new feed. Check this FeedBurner FAQ for some more ideas.

Video Tutorial - Move from Blogspot to WordPress

Now that your new WordPress site is up and running with all the old Blogger posts, here are a few important things you should do:

1. Add your new WordPress site to Google Webmaster, verify ownership and and submit a Sitemap listing the URLs on your new site.

2. When you migrate from Blogger to WordPress, all your pictures and screenshot images hosted on Blogger / Picasa Web Albums will not get imported into WordPress. Therefore never delete your old blogger blog as it will break images that are now embedded in your WordPress posts.

3. Once the search bots and human beings start flocking to your new site, you may update the homepage of your blogspot blog with links to some of your best posts.

4. To know how Googlebot will view your existing Blogspot blog, just turn off JavaScript in the browser and try visiting any of your old blog pages. It's a single link under H1 that points to your new address that internally does a 301 redirect.

Instructions: How to Upload a Blogger Template on your Blogger

noreply@blogger.com (The Fox Multimedia) — Mon, 22 Aug 2011 17:02:00 +0000

Step 1. Un-zip the zip file that you downloaded from http://www.bloggertemplatesblog.com/, in order to extract the XML template from it.

Step 2. Log in to your Blogger’s dashboard, then go to LAYOUT -> EDIT HTML

Step 3. It’s best that your backup your old template (just in case any thing goes wrong), by clicking on the “DOWNLOAD FULL TEMPLATE” link and then save the file to your hard disk drive.

Step 4. Once you have created a back up, upload the new template by clicking the ‘Choose File’ button. Select the file’s source and click ‘UPLOAD’,

Step 5. After the upload is complete , you can either which to preview your template or click on the ‘SAVE TEMPLATE’ button to start using it.

In case you are unable to upload or encounter other problems, simply drop a comment and I’ll help you out!

Need a web host? Be sure to secure your blog with the best web hosting solutions

Google Pagerank Button

noreply@blogger.com (The Fox Multimedia) — Mon, 22 Aug 2011 13:02:00 +0000

hex color code generator

noreply@blogger.com (The Fox Multimedia) — Mon, 22 Aug 2011 05:16:00 +0000

tutorial HTML and XHTML

noreply@blogger.com (The Fox Multimedia) — Mon, 22 Aug 2011 01:04:00 +0000

When inserting codes into the Blogger template, page element, or blog post, you may have seen error messages that the code could not be parsed, was not well-formed, was broken, or that the elements were not closed properly. These errors can be corrected if you understand the rules that must be adhered to in XHTML documents. Blogger templates use the XHTML 1.0 Strict Document Type. In this article, we shall explain some of the XHTML syntax or rules, so that you may troubleshoot and resolve the problems if these error messages should occur.

XML, HTML and XHTML

We shall keep this short. Just so as you understand what we said about document type, view the Page Source or Source of your Blogger blog. You should see this document type declaration at the very top:-

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

The terms – XML, HTML and XHTML - refer to the markup language used to write the web pages. Many of us would have heard of HTML (Hypertext Markup Language), invented by Tim Berners-Lee, and used since the early days of internet. XML (Extensible Markup Language) is a meta-language, used to create other markup languages. The traditional HTML was later recast to use the rules of XML and that resulted in a new XML application, called XHTML (Extensible Hypertext Markup Language). Because XHTML rules are strict and unforgiving, not conforming to them when attempting to modify the template would result in error messages. So, what are these rules that Bloggers like us should take note of?

Basic Rules of XHTML

1. Codes to be in lowercase

Since XML is case sensitive, all the element keywords and attribute names used in XHTML should be in the lowercase. For example, the template code is not this:-

<TITLE>Tips for New Bloggers</TITLE>

but this:-

<title>Tips for New Bloggers</title>

If you have noticed, the elements and attribute names between the lesser than (<) and greater than (>) signs have to be in the lowercase. However, the value, which in this case is “Tips for New Bloggers”, can be in the uppercase, lowercase, or mixed case.

2. Attribute values to be in quotation marks

All the attribute values have to be enclosed either in single or double quotation marks. The following examples are not accepted by XHTML:-

<div id=header-wrapper> <a href=http://tips-for-new-bloggers.blogspot.com>Text Link</a> <img src=photo.jpg/> <table width=200 border=0 cellpadding=2>

Instead, they should be written as such:-

<div id='header-wrapper'> <a href="http://tips-for-new-bloggers.blogspot.com">Text Link</a> <img src="photo.jpg"/> <table width="200" border="0" cellpadding="2">

3. Container elements must have closing tags

This is not correct:-

<p>A paragraph.

In XHTML, there must be a closing tag with a forward slash (/) at the end:-

<p>A paragraph.</p>

Examples of the many non-empty elements that have opening and corresponding closing tags are:-

<ul> ... </ul> <li> ... </li> <table> ... </table> <h2> ... </h2> <div> ... </div> <span> ... </span> <dt> ... </dt> <dd> ... </dd> <a href> ... </a>

4. Standalone elements to be closed

Some of the elements are empty or standalone. They do not have associated closing tags. Common examples are:-

<br> <img> <input> <frame> <hr> <meta> <link>

Nonetheless, in XHTML, these elements must be terminated or closed. There are two ways to do that. One way to terminate the element is to put a forward slash (/) at the end like this:-

<br/> <img/> <input/> <frame/> <hr/> <meta/> <link/>

The second way is to add a corresponding closing tag like this:-

<br> ... </br> <img> ... </img> <input> ... </input> <frame> ... </frame> <hr> ... </hr> <meta> ... </meta> <link> ... </link>

5. Elements to be properly nested

This means that elements must be closed in the reverse order. For example, this code is not accepted in XHTML:-

<form><table> ... </form></table>

It is improperly nested because the form was created first followed by the table. To close them in the proper order, the table must be closed before the form, like this:-

<form><table> ... </table></form>

6. Document to have only one root element

In the XHTML document, you will see that except for the document type declaration, all the codes are nested between <html> and </html>. This is the root element and all other elements or sub elements are in between. The document structure will look like this:-

<html> <head> ... </head> <body> ... </body> </html>

7. Attribute minimization is not allowed

In XHTML, all attributes should be in the form name="value". Even if the value is the same as the name, it cannot be minimized to one word. Hence, in our Add Text Box and Textarea article, the textarea code is not this:-

<textarea readonly>Hyperlink Code</textarea>

but this:-

<textarea readonly="readonly">Hyperlink Code</textarea>

XHTML Character Entities

Quite a number of readers had asked why they were unable to display HTML codes in their blog posts or why their codes were not well-parsed when inserted into the template. If you have noticed by now, the codes are wrapped in the lesser than (<) and greater than (>) signs. The moment these are posted, they will be interpreted as codes and will trigger an action by the browser. Should you want to display these as part of the text, use their character entities instead.

"	"
&	&
<	<
>	>

The next time you see an error message to the effect that the code is not well formed, not well parsed, not properly closed, etc., take a look at this guide, troubleshoot the problem and try out the possible solutions.

How to add Google Translate Widget in Blogger

noreply@blogger.com (The Fox Multimedia) — Mon, 22 Aug 2011 00:08:00 +0000

The Google Translate Widget (Google Translate Web Element) is a great tool to place in your blog which gives the opportunity to your visitors to translate your blog content in their native language. Weeks ago, Chakie also has written an article for a great website translation widget with flags from Free Website Translations, so if you want you can check it here. Ok, here we go now:

Google gives 3 different styles of Google Translate Widget:

1) Vertical

<div id= google_translate_element ></div><script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: en
}, google_translate_element );
}
</script><script src= //translate.google.com/translate_a/element.js?cb=googleTranslateElementInit ></script>

2) Horizontal

<div id= google_translate_element ></div><script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: en ,
layout: google.translate.TranslateElement.InlineLayout.HORIZONTAL
}, google_translate_element );
}
</script><script src= //translate.google.com/translate_a/element.js?cb=googleTranslateElementInit ></script>

3) Dropdown only

<div id= google_translate_element ></div><script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: en ,
layout: google.translate.TranslateElement.InlineLayout.SIMPLE
}, google_translate_element );
}
</script><script src= //translate.google.com/translate_a/element.js?cb=googleTranslateElementInit ></script>

Chose which widget you like and copy the code.

1. Login to your blogger account, and open the Design section.

2. Under the Page Elements Section go to Add a Gadget.

3. From the given list find and choose HTML/JavaScript.

4. A new window will appear, paste the code there and click Save.

Your Google Translate Widget is ready. Go back and preview your blog and see how it looks. Happy Blogging!!!

Free Website Translation Widget (Button)

noreply@blogger.com (The Fox Multimedia) — Mon, 22 Aug 2011 00:04:00 +0000

In our job the main issue is how to increase the number of our visitors. We use different tips and tricks, widgets and etc. to achieve our goal. There is a widget that helps you to increase the number of visitors in you site. So as Dip In It we are recommending Free Website Translations, because it offers you a great widget for translations, it is for free and without registration! This widget allows visitors of your site to translate the website into their own language very easy and fast. With this website fully automatic translation is now possible.

First step browse http://free-website-translation.com/

�

Free Website Translations

After you browse this web site click at Get Your Button

Get Your Button

Then choose the language of your website or blog.

Select a Website Language

After you have select the language of your website, in the left square it will appear the HTML code of the widget.

HTML Code

And the last step, highlight (copy) the code, login to your blogger account, go toDesign and click Add New Gadget paste your code and click save.

Under the Page Elements Section go to Add a Gadget.

From the given list find and choose HTML/JavaScript.

Paste the code in the new window and click Save.

Below is a picture of the widget that will appear at your blog.

Example Intergation

How to track your blog visitors?

noreply@blogger.com (The Fox Multimedia) — Sun, 21 Aug 2011 23:53:00 +0000

As a new blogger(webmaster),it is always interesting to know how many people are visiting your blog/site,pageviews,where they are coming from,which sites are referring,how many are coming via Search Engines(google,yahoo,etc) and what they are typing in the search engines to visit your site.
These stastistics are very handy interms of improving your blog and it is for FREE

If you search the google,you will find hundreds of sites which will track the visitors of your blog/site.But,some sites will provide more information about your visitors than the others.
So,how to do this?
Here are the best tracking sources interms of the feautures they provide.

Note:One thing is common for all the tracking sites.First you need to register,and provide the necessary information about your blog/website.Next,they will give you a html code and you have to embed it in your blog.
How to do that in blogger?
1.Sign in to your blogger dashboard.
2.Click on the 'layout' link next to your blog name.
3.Click on the "Add a Page element"
4.Select "html/javascript" and past the code they provide and SAVE THE CHANGES.

From then,your blog will be tracked and you can check your blog stats from time to time after logging in to your registrate's website.

So,here are the good ones:-

Sitemeter.com:This one is one of the Most Popular tracking source.This is as simple as 123. Just create an account,copy the code from your account and paste it in your blog as suggested above.
You have also the option to keep your blog stats PRIVATE.
They will give you the stats on how many pageviews(hits) per day,unique visitors,geolocation of the visitors,how many users online,and much more...As it is simple(not much animation),you site will load as fast as it is before.Stats are updated hourly.
You can setup a Free Account here

Histats.com:Unlike the Sitemeter which is very simple, this site will have very cool and animated counters.

Tracking is updated every 5 minutes.I personally using this site for my blogs.Like Sitemeter,
this is also have the option to keep your site stats PRIVATE.
They will provide Animated graphs about your site visitors and fully animative.
You can register with them here

Statcounter.com:Same here!As in the name,it is a stats counter.It is fast,free,and quick loading.
Invisible tracking is available and no ads on your site.All the stats are in real time and super fast.It is not much animated as histats.com.They will provide pageviews,unique vistors,visitors activity,search engine wars,keyword analysis,and many more..
Register a free counter for your blog here

How to add Music,MP3,Audio Player to your Blogger Blog

noreply@blogger.com (The Fox Multimedia) — Sun, 21 Aug 2011 21:33:00 +0000

This article explains how to add music,mp3,audio to your Blogger (blogspot) Blog :

" Music expresses feeling and thought, without language; it was below and before speech, and it is above and beyond all words. ~Robert G. Ingersoll "

Adding a nice music track to your blog may enhance the pleasure of reading your blog or annoy your visitors depending on the kind of blog you have. For example, if you have a music blog, adding some nice song tracks to your blog sidebar can make your visitors to stay longer which benefits you.
So, let's learn how to add mp3 to your Blogger Blog:

Step 1 : First, upload the music file to any free file hosting servers on the net. There are tons of sites that provide free music file hosting. Just google "Free music hosting". Once you upload, they will provide you with a direct link to that music file.
ex: the file looks something like this :



http://---------- .com/yourmusicfile.extension

(extension can be .mp3 or .wav or .mid or any other audio extension).
I uploaded a sample mp3 file to my server..



http://myblogtalk.com/uploads/billu.mp3

Step 2 : Here is the code you need to add music to your blog



<embed width="250" height="50" autostart="false" src="MUSIC FILE URL"/></embed>

width : width of the music player
height: height of the music player
autostart : you want the music to start playing automatically ? or leave it to visitors choice..? (values : false or true)
MUSIC FILE URL : the direct link to your music file
In this example, MUSIC FILE URL is



http://myblogtalk.com/uploads/billu.mp3

So, if you add that code, the output will be like this
(I used the autostart: false, so you have to click on the play button to start playing music)
Click on the Play button to test

If you use the autostart value: true, the music automatically plays.. but, it annoys many readers

Few more attributes :
loop : true (or) false
If you want to continue playing the same track again and again until the visitor click on the 'STOP' button (or until he/she leaves your site), set the value to 'true'.
If you want the music to stop once the track is completed, use 'false'

playcount : n (n= any positive number)
suppose.. if you put playcount: 2 , the music will play two times and stop

If you want to use these two more additional features.. the code look something like this:



<embed width="250" height="50" autostart="false" loop="false"playcount="2" src="MUSIC FILE URL"/></embed>

Now What ?
You can add the music player anywhere you want in your Blogger blog..
Sidebar : If you want to add in sidebar, go to Layout » Add a gadget » html/javascript
and paste the code and save it.

Blog Posts :
If you want to embed music file to any specific blog post..
Paste the code in 'Edit html' mode and save it.

How to instal music players on blog

noreply@blogger.com (The Fox Multimedia) — Sun, 21 Aug 2011 21:31:00 +0000

Music Player By posting your blog, then your blog will feel alive, youcan simply listen to your favorite songs, not just your , visitors were also able to enjoying.Widget is very useful for blog-related music.

This time we will use a widget from the music-live.net [screenshot itlike this]

1.Buka your browser and typing http://www.musik-live.net/

2.Lalu click Mp3 Player Skin

3.Pilih Skin / look you want, click Preview to see how it looks skins

4.Copy code

5.Masuk to Blogger with your ID

6.Klik Layout menu -> Page Elements

7.Klik add widget templates

8.Pilih HTML / Javascript

9.Pastekan in town HTML / Javascript

10.Save, finished

Note: Oh yes in a way that appears above song is a song that has been provided, if you want to choose their own songs that you want to display the following way:

1. On the front page of Music-Live, find your favorite song with the search box.

2. Then click the Play & Embed code to display the code

3. Copy the code and paste it into the menu HTML / Javascriptblogger.

4. Completed

Note: This only able to play 1 song only. If you want to play moresongs then use eSnips.

Add Numbered Page Navigation Widget To Blogger Blog

noreply@blogger.com (The Fox Multimedia) — Sun, 21 Aug 2011 09:00:00 +0000

One of the important features of a good blog or site is that it is very easy for the blog visitors to navigate throughout the site. A site which is structured in such a way that the visitors have to take efforts to move from one page to another is seen as a poorly designed site.

Having proper navigation is important as it also helps to increase the page views for your blog. Blogger users are aware of the Newer Posts and Older Posts links at the bottom of the blog.

It is pretty irritating at times for visitors when they want to check posts that are present on the 5th or 11th page. They have to click on the Older page link 5 or 11 times. It is obvious that in such a situation many visitors wont even try to go that far and may visit another blog. This results in less Page Views for your blog. Here is what Lauren of Nymfont has to say about the default links.

Sweet, I think I am going to try to implement numbered pagniation in my blog right now then! "Older" "home" and "newer" links are such a "Blogger-blog" dead giveaway!

That's why Numbered Page Navigation widget is important for Blogger/Blogspot blogs. This makes life easier for the blog visitors and at time for the blog owners as well. There are many wonderful bloggers who have created Numbered Page Navigation widgets for blogger blog. But I found the one created by Anshul Dudeja the best. I am using the widget created by him on this blog and its wonderful.

He has posted a simple and easy tutorial to add a Numbered Page Navigation to your Blogger blog. It has two parts and proper instructions have been given so that you wont have any problem while adding it to your blog. Check the Numbered Page Navigation tutorial by Anshul.

If you are facing any problems, then you can use the comments section and I will try to solve your problem. I hope that you will love the Numbered Pagination widget.