CSS Tips and Tricks for Blogger.

thumbnail
Here are some tips and tricks for Cascading Style Sheet (CSS) in your blog.......In old Blogger the css section is enclosed between tags. In new Blogger the css follows the same rules except that it is enclosed between and tags. For more details on how the template is structured see Parts of the Template. These are called as embedded style sheets since

Friend Connect OpenSocial Gadget.

thumbnail
var skin = {};skin['BORDER_COLOR'] = '#cccccc';skin['ENDCAP_BG_COLOR'] = '#e0ecff';skin['ENDCAP_TEXT_COLOR'] = '#333333';skin['ENDCAP_LINK_COLOR'] = '#0000cc';skin['ALTERNATE_BG_COLOR'] = '#ffffff';skin['CONTENT_BG_COLOR'] = '#ffffff';

Pinging Simplified.

thumbnail
Pinging is a process of attracting the search engines for indexing your blogs....A Blog is a special type of website which has dynamic content constantly being updated as opposed to a static website. A static website's content does not renew itself constantly. Hence it is difficult to attract the search engines repeatedly to index the site. It may take upto two months for a static website to

Google Docs & Spreadsheets in your Blog.

thumbnail
Google Docs and Spreadsheets can be embedded in your Blog. To do this.........go to http://docs.google.com/ and login with your GMail Account. You will see the Welcome Screen where click on New Spreadsheet. In the next page Click on Continue button in Get Started with Google Docs and Spreadsheets. This will lead you to the spreadsheet page where you create your spreadsheet. After creating the

Timeline in Blogger Beta.

thumbnail
A Timeline of your posts can be added to your beta blog. This shows the titles and links of all your posts against a horizontal scroll of dates published.........This is an intresting way to display all the links to your posts so that your viewers get a visual impression of how prolific you have been in posting to your blog.To do this you will have to get code from http://www.mytimelines.net/.

YouTube, Flickr in Blogger Beta.

thumbnail
YouTube videos and Flickr photos can be put inside your beta blog.........YouTube is a free video hosting and online video streaming service that allows users to view and share videos that have been uploaded by the members. Membership is free but there is a ten minute length limit on the video length. You cannot download the videos but you can view them in your browser. You can embed these

Technorati in Blogger Beta.

thumbnail
Technorati is the search engine for blogs and hence no blogger can afford to go without it in his/her blog................Google is the generalized search engine for the web. Technorati is a search engine which is specialized for blogs. Blogs in contrast to other web sites have ever changing content and Technorati focuses on them by searching them for keywords. Each blog is indexed and

Align Blog to Left.

thumbnail
You can push your whole blog body to the left in two steps.........First backup your template. Go to edit Html subtab of Template tab and click on Download Full Template link. Save the XML file to your PC with an appropriate name.Next scroll down in Edit Template text box till you come to :Content----------------------------------------------- */#outer-wrapper { padding-left: 200px;

Add a Recent Posts List after Every Post.

thumbnail
Add a Recent Posts List after every post in your blog so that any reader reading a single post can see at the end of the post this list and then if interested may go there..........To put a Recent Posts List in the sidebar see List Previous Posts.To do this we will use your blog's feed to put a list of recent posts at the bottom of every post. First we will have to turn on the blog feed. For

Presentation in your Blog.

thumbnail
You can put a presentation in your blog..........To do this go to spresent.com and create a presentation online. The interface is fairly intuitive with a toolbar and File menu at the top and a insert Object tab at the side. See image below (Click it to enlarge it). The files made are stored free at the spresent server.After making the presentation and saving it click on Publish----->Embed/HTML

Backup your Blog.

thumbnail
Backup your Beta blog regularly to your PC so as to be prepared for any emergency.....In Classic Blogger you could use WinHttrack utility from httrack.com to backup your blog. However in beta blogger the present version of this software takes a long time.Hence to backup beta blogs you can use Scrapbook extension of the Firefox browser. You will need Firefox Browser for this. Download it from

Britney Spears, Shakira, Sony Music Videos in Blogs.

thumbnail
Do you want Britney Spears, Shakira, Jessica Simpson Sony Music Videos in your blog.......To see the above player in action go to my blog Sony Music Video.You will first need to create a Brightcove account here. After sending them the url of your blog and other particulars your request is approved and sent back. Click on the link in the return email to get the Javascript code for the player.Go to

Google Video Search in Blogs.

thumbnail
By putting Google Video Search in your blog you can enable your reader to search for videos without leaving your blog. He/She can view the videos in your blog and even upload their videos from your blog. Click below picture to enlarge it.Above is a video of an octopus playing on my blog at Google Search Map site.In your blog you will need a space for the Video Search Control. I have chosen the

Reuters Video News in your Blog.

thumbnail
Reuters Video News can now be made available to beta blog readers.......Reuters is the world's largest international multimedia news agency, providing investing news, world news, business news, technology news, headline news, small business news, news alerts, personal finance, stock market, and mutual funds information available on Reuters.com, video, mobile, and interactive television platforms.

Video on Beta Blogger

thumbnail
To see a video tutorial on beta blogger...........This video shows how to rearrange Page Elements, customize blog colors and fonts and how to add rss feed content from another blog.You can also view it here :http://www.youtube.com/watch?v=A43AaMse2-MTechnorati Tags:utube, video

Add Google Map Search to Blog.

thumbnail
To add a Google Map Search to your blog.........go to http://www.google.com/apis/maps/ and click on the Sign up for a Google Maps API key button. It will take you to this page :http://www.google.com/apis/maps/signup.html. This key identifies your web site to Google and helps them track usage of Google Maps. A new and distinct key is needed for each directory on your website that includes Google

Add Widget to provide Button-Link to your Blog.

thumbnail
You can now add a widget to your blog with a button which when clicked adds a button link to your blog from the reader's blog. This is done automatically without the reader having to type in even a line of code.....First create a button by going to http://cooltext.com/Buttons and create a button for your blog. Then upload this button picture to a freehost like Googlepages and copy down the url

Where to Add Code in Beta Template.

thumbnail
You can add code to the template in beta at these places..........If you cannot see the full table below please go here.Where To Add Code in Beta TemplatesCODE TO BE ADDED PARTS OF TEMPLATE LANGUAGE DECLARATIONS createSummary("summary7418397328553362188");

Practical approach to Hacking Beta Templates.

thumbnail
You want your blog to stand out among the millions of blogs in the blogosphere then....you will have to learn how to hack the beta blogger template. Classic Blogger had HTML templates which were easy to hack. You could load them into various WYSIWYG site builders and customize them easily. This is not the case with beta blogger.Beta Blogger Templates are made of XML/XHTML. See What is

Download Three Column Beta Template.

thumbnail
Download Three Column Beta Template with the following features............This template is an original Stretch Denim Beta Blogger Template by Darren Delaye to which I have added a third column. The added features are : Third Column for Advertisements or other Page Elements. Add Page Element to Header Add Page Element to Footer Add Page Element to Posts Column Add upto 4 Page

Add a Country Map to your Blog.

thumbnail
To add a country map to your blog............first you willhave to follow the instructions in Add a Google Map to your blog. (Step 1) After having added the map to your blog you need the Latitude and Longitude of the point on earth where you want to center your map. Do this by entering the place name in Google along with the words 'latitude longitude' and pressing Search.Google will give the

Add a Google MAP to your Blog.

thumbnail
Skip to POST UPDATE.To add a Google Map to your blog go to ..........http://www.google.com/apis/maps/ and click on the Sign up for a Google Maps API key button. It will take you to this page :http://www.google.com/apis/maps/signup.html. This key identifies your web site to Google and helps them track usage of Google Maps. A new and distinct key is needed for each directory on your website that

Add a Google AJAX Search to your Blog.

thumbnail
To add a Google AJAX Search to your Blog go to.............http://code.google.com/apis/ajaxsearch/ and get a Google AJAX Search API key. Click onSign up for a Google AJAX Search API key button and you will be taken to this page:http://code.google.com/apis/ajaxsearch/signup.html. Put a check in the box where it says I have read and agree with the terms and conditions and paste your blog url in

How to Add a Google Custom Search Engine to Blog?

thumbnail
You can add a Google Custom Search Engine to your blog............like I have done at the top of the right sidebar. A Custom Search Engine can be used for the following purposes : To place a search box and search results on your website. To specify or prioritize the sites you want to include in searches. To customize the look and feel to match your website. To invite your

How To Add a Favicon to your Blog?

thumbnail
To add a Favicon to your blog you...............have to create one first. You can create a favicon in an icon editor software or generate one online. One useful free program to create it in is IconEdit32. Search for it in Google and download and install it. It can create 16x16 icons and 32x32 icons. The first is very small and so it is better to create one of the latter size.A Favicon is

How to Customize your Header?

thumbnail
To customize the header in a beta blog...........start with BACKING UP YOUR TEMPLATE as described in How to Change Template.The Blog Header in Beta blogs is described by two sections of code. The first section is in the CSS part of the template where the physical characteristics of the header are described. A sample header code in the CSS is given below :/* Blog Header---------------------- */#

How to Add a Banner Link in the Footer.

thumbnail
To Insert a Banner Link in the Footer you must first...............have a banner ready. You can create your own banner in an image editing program like I have done or go to an online banner generator. To find an online banner generator just type 'free banner generator' in Google's Search Box and hit Enter.Once you have made a banner upload it to a free host like GooglePages. At present

How to insert Banner Link to your Blog in each Post.

thumbnail
To Insert a Banner Link to your blog you must first...............have a banner ready. You can create your own banner in an image editing program like I have done or go to an online banner generator. To find an online banner generator just type 'free banner generator' in Google's Search Box and hit Enter.Once you have made a banner upload it to a free host like GooglePages. At present

How to Analyze Site Traffic with Google Analytics.

thumbnail
To analyze web site traffic with Google Analytics you will.....first have to add the Analytics code to your blog template. To do this go to Google Analytics and register with your Google account. It is free and has no limitations. On the Analytics Settings page click on '+ Add Website Profile' link in the top frame of the Website Profiles box. This takes you to the ' Create New Website

What is XML, XHTML?

thumbnail
XML and XHTML are two new terms popping up into the beta bloggers' lexicon and we consider them here.....First came SGML. Standard Generalized Markup Language (SGML) is a metalanguage in which one can define markup languages for documents. SGML is a descendant of IBM's Generalized Markup Language (GML), developed in the 1960s by Charles Goldfarb, Edward Mosher and Raymond Lorie (whose surname

Advantages of Beta Blogger.

thumbnail
The Advantages of the new Beta Blogger are...............many and I have tried to list a few of them here :ON THE SPOT EDITING. Login to your dashboard by going to Beta Blogger. Click on View Blog next to the name of your blog. Your blog opens as it would if you accessed it by goingdirectly to its URL. However there is a difference. Under each post and page element you will see a crossed

How To List Previous Posts by Title.

thumbnail
To list All Previous Posts by Title...............you will use your blog's RSS feed to put content into your sidebar. How to do this has already been described in the post : Add Content with RSS Feeds in a general way. This is a special case in which you can use this method to display the title of all your previous posts in the sidebar.STEP 1. The feed for your beta blog is of the format :http:

How To Submit Site to Search Engines?

thumbnail
To submit your blog/site to other Search Engines............heryou should know that there are free submissions and paid submissions. Copy and paste the following URLs to the address bar of your browser to go there and submit your site to them.For Yahoo go here. It is free but you need to have a Yahoo account which is also free. After logging in to yahoo.com click on "My Yahoo" button just

How to Submit Site to Google?

thumbnail
To submit your blog to the Search Engines..............After completing your blog and postings you have to submit your blog to the major Search Engines. This is because there are millions of sites out there on the world wide web and the search bots/spiders will not come to your site/blog unless you inform them that a site has been constructed and needs viewers.There are millions of sites on the

How to Add Adsense Ads. to beta blogs.

thumbnail
To add Adsense Ads. to beta blogs.............FIRST BACKUP YOUR TEMPLATE USING METHODS OUTLINED IN : Change your Template.Then login to your Adsense account and click on Adsense Setup. Click on type of Ad. you want to setup - Content, Link unit, Search unit or Referrals. MOST IMPORTANT LINK IN YOUR TEMPLATE SETTINGS is Download Full Template on Edit Html subtab of Template Tab.At present you

How To Add Picture to Background.

thumbnail
To add a Picture to the background of your blog...............Step 1. FIRST create a free account at Googlepages (http://pages.google.com) to host your image/picture. In the Page Manager go to bottom frame of sidebar and click on Upload. Browse to your file on PC and click Open to upload it to your Google Page Account. At the present they offer 100 MB free disk space. Right click on the

How to change width of blog.

thumbnail
To change the width of your blog.................you will have to change certain parameters in the CSS (CASCADING STYLE SHEET) part of the template. The CSS part is the fourth part of the template and is described in How to do CSS in Beta Blogger.To do this login to Dashboard and click on Layout under the name of your blog. This takes you to Page Elements. Then click on Edit Html tab next to

How to Refresh your Blog Page in Browser.

thumbnail
To refresh your blog page in browser...........you have to refresh the browser cache. What is 'cache'? Often referred to as the cache, the Temporary Internet Files folder contains a kind of travel record of the items you have seen, heard, or downloaded from the Web, including images, sounds, Web pages, even cookies. Typically these items are stored in the Temporary Internet Files folder.Storing

How to Change Post Order.

thumbnail
To change the order of your posts in Beta Blogger..............remenber that posts are ordered according to "LATEST POSTED FIRST ON PAGE" rule. Hence the newest posts are first with earlier posts lower down in the order. The first post you made when you created the blog is the last on the page. Your blog consists of a Main Page and Post Pages. The Main Page contains the number of posts you have

What is "Subscribe to: Posts (Atom)".

thumbnail
"Subscribe to: Posts (Atom)" is a link provided at.................the end of all your blog posts. This link is for viewers of your site/blog to view your blog without having to come to your blog. In the real world when we want to read a newspaper or magazine we go to the news-stand and buy it. If you wish to change the words "Subscribe to Posts Atom" go to Template------>Edit Html----->Backup

How to add Picture to Beta Blog Header.

thumbnail
To add a picture to a Beta Blog Header............FIRST BACKUP YOUR TEMPLATE USING METHODS OUTLINED IN : Change your Template.Then Upload your picture to a free host like Googlepages which offers 100 MB free space. Copy the url of your picture and keep it. Most Useful Link in Beta Blogger is Download Full Template in Edit Html subtab of Template tab.Log in to Blogger Beta---->In Dashboard

How to Add Widgets to your blog.

thumbnail
UPDATE : Blogger has now replaced the "Add Page Element" link with the "Add Gadget" link. Clicking on this link will bring up the "Add a Gadget" popup window. All the original Blogger widgets are listed under the Basics subtab in this popup window.Blogger widgets are now called as Blogger Gadgets. The rest are Google Gadgets which have now been integrated into the Blogger Layout----->Page

What are Widgets?

thumbnail
UPDATE : The Add Page Element link is now replaced by the Add Gadget link on Layout----->Page Elements tab.Page Element = Blogger Gadget.Code for a Blogger Gadget = A WidgetWidgets in Beta blogger are.............individual page elements such as a picture, a blogroll, or anything else you can add from the Page Elements tab to a Section of your blog. A Page Element is referred to as widget in Beta

Customizing your Blog.

thumbnail
Customizing your blog is done through..............the Fonts and Colors subtab under the Template tab. The code reponsible for customizing your blog resides in the third part of the template as shown in Parts of the Template. This is what the code looks like this :/* Variable definitions ====================

The Navbar in Beta Blogger.

thumbnail
The Navbar is the slim colored strip about 30 pixels in height..........running across the top of your webpage/blog. You are given an option in the Page Elements subtab under the Template tab to change its color but not to remove it. LEGAL ISSUESThe Terms of Service for Blogger can be found here. Iagree with Digital Inspiration what he say here about the legality of removing the navbar and I

Add Content with RSS Feeds.

thumbnail
To Add Content to your blog with RSS feeds.........First find the RSS Feed Icon. On many sites it is shown as "RSS" or "About Feeds". The icons are shown alongside. Right click any one of these and select 'Copy Link Location'. Now you have to convert the feed into Javascript code. There are many such convertors online which you can find simply by searching Google. One such convertor is located

How to put Adsense Link unit in your Header.

thumbnail
To put an Adsense Link Unit Ad. in the header..........Log in to your Dashboard. Click on your 'Layout' link under your blog name. This takes you to Page Elements under the Template tab. Click on Edit Html. Scroll down in Edit Template field till you come to :
Change the second line

How to Hack the Beta Blogger Template.

thumbnail
To Hack the Beta Blogger Template............ Create a Widget/Page Element. Sign in to Blogger Beta---->In Dashboard choose your blog and click on Layout------>This takes you to the Add and Arrange Page Elements page. Here click on Add Page Element. A new window appears which shows the choices for your page elements. The types of page elements you can make are shown in Widgets of Beta Blogger.

How to do CSS in Beta Blogger.

thumbnail
How to code CSS (CASCADING STYLE SHEET) in a Beta Blogger Template.......The Beta Blogger Template consists of the five main parts outlined in Parts of the Template.Of these the first part is where the HTML is declared.The second part consists of the title and the metatags.The third part is peculiar to the beta template and is where the Variable Definitions are defined. The fourth part is where

How to HTML in Beta Blogger.

thumbnail
How to code HTML in a Beta Blogger Template.......The Beta Blogger Template consists of the five main parts outlined in Parts of the Template. Of these the first part is where the HTML is declared. The second part consists of the title and the metatags. The third part is peculiar to the beta template and is where the Variable Definitions are defined. The fourth part is where the style of the

Parts of the Template.

thumbnail
The Beta Blogger Template consists of FIVE main parts..............NOTE that this is the new beta template and you do not get it automatically on migrating to beta. BACK UP TEMPLATE using Download Full Template link in Edit Html subtab of Template tab. After migrating go to Template---->Customize and there you will find a link to upgrade to the new template. Without this template you will not

How to Change the Template.

thumbnail
The Template is your blog's clothes and to change it....click on the Template tab after logging into the Dashboard and clicking on your blog's name. Ihe Template Tab has four subtabs : 'Page Elements', 'Fonts and Colors', 'Edit HTML' and 'Pick New Template'. The Page Elements subtab is the default and is used to arrange the various Page elements or Widgets in your blog. The Edit Html subtab is

Settings-Part 2.

thumbnail
Setting the Settings part 2......After setting the Basic Settings click on 'Publishing' subtab next to 'Basic'. Here there are only two settings. First setting enables you to change your blogspot address and hence your blog's address (URL) anytime you want. This is not advisable since people and search engines identify your blog by it's address and if you change it frequently you will have to

Set the Settings-Part 1.

thumbnail
Now that you have created your blog it is time to set the Settings......To customize your Settings click on the second 'Settings' tab at the top after having logged into the Dashboard and clicked on your blog name or click on Settings under Manage as shown in the image alongside. This will open the Settings page on the default 'Basic' subtab. Here you can set the settings for Blog Title and

Final Steps In Publishing.

thumbnail
The third and final step in creating your blog is to Choose your template......The template is the clothes your blog wears. The template you choose makes your blog stand out among the millions of blogs in the blogosphere. Make a wise choice from all the templates presented for your choice. Do not worry about anything as you can customize any template later on. You can also choose from among any

First Steps In Publishing.

thumbnail
Having decided on the subject and decided on blogging go to......http://beta.blogger.com/home OR http://www2.blogger.com/home and create an account which is free. Remember the link to old Blogger is http://www.blogger.com/. Do not go there as it is soon to close down and everyone will have to migrate to Beta Blogger. Hence it is better to start with Beta Blogger itself. If you have a gmail

How to start a Blog.

thumbnail
First you will have to think of a subject to blog about....An ideal choice is to blog about something you are passionate about. Something about which you cannot stop talking. It may be politics it, may be spirituality. It must be something you know a lot about. Be still when you have nothing to say; when genuine passion moves you, say what you've got to say, and say it hot. D. H. Lawrence (

Migration to Beta Blogger Imminent!

thumbnail
Skip to POST UPDATE.All Bloggers will be requested to migrate to Beta Blogger in a "few" weeks .......as per a reliable inside source.Beta Blogger debuted on 14 Aug 2006 and is now fast approaching the final stage. You will get warning before it's time to migrate over to beta. However, that time is coming up sooner than you expected.WHAT IS "ALPHA", "BETA"?Alpha is a first release of a software