How To Compatible Blogger Blog With Mobile Phones !!!

If you are using a Blogger Layout Template,this tutorial will helpful for you.But if your template is a blogger template,created by using Blogger Template Designer, usually this feature has already added to your template.This will really helpful to increase the number of mobile visitors of your blog.
Now follow the simple steps given below to ready your blogger blog for mobile phones.
 
1.Login to your blogger Dashboard--> Design- -> Edit HTML
 
 2.Scroll down to where you see below code:

<b:include data='blog' name='all-head-content'/>

3.Now copy below code and paste it just before the above line.

<meta content='IE=EmulateIE7' http-equiv='X-UA-Compatible'/>

<b:if cond='data:blog.isMobile'>

<meta content='width=device-width,minimum-scale=1.0,maximum-scale=1.0' name='viewport'/>

<b:else/>

<meta content='width=1100' name='viewport'/>

</b:if>

Please have some time to Drop comments on this article...

How To Speed Up Your Blogger/Blogspot Blog?

Basically, the speed with which your blog loads is inversely proportional to the time it takes to load. I have explained this post in terms of reducing the load time. More over, when browsing the net, I found an article which mentioned that even the site/blog load time contributes significantly to the Google PR. So, how do I find out whether my site load time is quick or slow. If you need an answer to this question, then v! isit the following link "Website Optimization Speed Report" and enter your URL to have a complete report about your site load time.

Scroll to the end of the report page and you will notice various sections say TOTAL_HTML, TOTAL_OBJECT and so on. Each section will be highlighted either in red or green or yellow. So, what do they indicate. The report will clearly explain the color and its significance. How ever, I would like to briefly say that, it indicates the areas where you need to concentrate so as to improve the speed of loading your website. Red indicates immediate attention while yellow indicates moderate attention and green signifies an optimal performance.

I suggest you to read each and every line of that report before you proceed with this post. The report will clearly specify what scripts or images can be compressed and how much bytes could be saved by doing so. Once you have analyzed the above report, it is time to take few steps to reduce the load time. Although, there are various methods through which the load time can be reduced, I restrict myself to the most effective methods in this post. Now, let's move on to the methods!!!
 
 1. SIMPLY THE CSS SECTION: This method involves the compression of the CSS section of your blogger template. To do this, just visit the following link "Free Web Based CSS Compressor" and paste the CSS part of your blogger template. Once you paste the code, hit the compress button and you will find the reduced version of the CSS code. Now, replace this code instead of the CSS part of your template and save it. Ensure that, there is no problem after replacing the code by having a preview of your blog.

(Note: Before trying this step, please make a back up of your template. M! ore over, the CSS part of your template is the code which lies between the  andcode.)

2. POSTS ON HOMEPAGE: The earlier versions of blogger/blogspot blogs did not include the "Read More" hack and people displayed the entire post on the blogs. How ever, this trend has reduced in the new version of blogger to some extent. Still, there are blogs where in , the home page includes so many number of posts that it becomes completely annoying for the visitor who visits the blog. Apart from losing a visitor, you lose the impressions and the bounce rate of your blog also increases.So, reduce the number of posts on your home page. To do so, navigate to Settings->Formatting from das! hboard and enter 4 or 5 for your blog with the "Read More" hack installed in your blog.
 
3. IMAGES OF YOUR BLOG: The images displayed in your blog play a very vital role in your site load time. The images when hosted at different sites say "Imageshack, Photobucket, etc.." contribute a significant load time. This is due to the diversity of your images, that is, your images have to be fetched from different servers. To avoid this, you may use a single server to host your images. Say use only Photobucket to host all your images. Thereby, you fetch multiple images from only one server and it reduces the load time drastically. Moreover, you may compress the images which you host, thereby the images will load faster than what it did, before compression.

4. AVOID SCRIPTS: The scripts that are included in your blog template also plays a vital role in the loading time of your website. Try to remove the scripts which you feel are unwanted. Apart from the scripts, remove the widgets which are unnecessary from your blog too. So, how do I decide a widget is important or not? Just ask the following questions to your self and you will have a conclusion. Firstly, Does the widget offer some value to your readers? Secondly, Does the widget match with your template, that is, provides an overall professional look? And lastly, Do you receive complains from your blog readers about the widget(say it disturbs them from reading the post)??? If you end up answering "No" to the first two questions or "Yes" to the last question, then I recommend you to remove that widget now!!

How To Show HTML/CSS Codes In Blog Posts

Today i am going to teach you how to add Html codes in blog posts.By default web browsers read the code as a program rather than showing the code which you like to show up to your visitors or any other.So,its makes much difficult to make that way of showing the Html/Css Code and it is the most common problem for Blogger beginner's and Intermediate users.So,Now when we come back to the topic.I am going to teach you how to show up the Html/Css Code in a Box with good looking background.


Let Us Start The Topic:

• First go to Blogger and then Sign-in
• Go to your Dashboard--Layout(Design)--Edit Html

• Now just copy the following code which is shown below and paste it before     ]]></b:skin>

--Note: Download your existing template Before you save changes in the template

.csscode {

margin : 15px 35px 15px 15px;

padding : 10px;

clear : both;

list-style-type : none;

background : #EEEEEE;;

border-top : 2px solid #AAAAAA;

border-right : 2px solid #AAAAAA;

border-bottom : 2px solid #AAAAAA;

border-left : 2px solid #AAAAAA;

}

For More Info you Can See How To Add The Code In The Below Image:

• Now save you template to make the changes apply

From Now whenever you like to add a code in your post just add the code between 

<div class="csscode"> and </div> like these as Shown below:

<div class="csscode">

HTML Code Here

</div>

That's it....!

Now you can show any of your code in a separate box easier to use

Please let us know if you any problem via comments

Have A Nice Day...!