My Blog

HOW TO DRAW NARUTO FACE

noreply@blogger.com (faisal) — Tue, 16 Aug 2011 09:36:00 +0000

Naruto is a young ninja from the village of Konoha. His primary motivation throughout the series is to become the village leader of Konoha. During the series, Naruto evolves from simple-minded prankster who wishes for acceptance in the group to a much mature character, although he still retains some of his childhood traits. He is part of the Team 7, along with Sakura Haruno, Sasuke Uchiha, and their sensei, Kakashi Hatake.

How to draw Naruto in 9 steps.

Step 1

Step 2

Step 3

Step 4

Step 5

Step 6

Step 7

Step 8

Step 9

HOW TO DRAW SAKURA FACE

noreply@blogger.com (faisal) — Tue, 16 Aug 2011 09:27:00 +0000

We are going to learn how to draw Sakura. We’ll have a drawing guide in steps.

If you want to find out more about Sakura, then just go have a look at this list of Naruto characters. Cause we’re going straight to business… aaa drawing.

Step 1

Step 2

Step 3

Step 4

Step 5

Step 6

HOW TO DRAW SASUKE FACE

noreply@blogger.com (faisal) — Tue, 16 Aug 2011 09:08:00 +0000

We’re going to see how to draw Sasuke Uchiha. For those of you not knowing who Sasuke Uchiha is, i added these extra lines: Sasuke is a member of the Uchiha clan, whom he joined in order to revenge the destruction of his clan. He is cold and very quite, and has the habit of making Naruto the object of his ridicule and insults. That’s why Naruto is often annoyed with him and considers him his rival. With a struggling past, Sasuke is a very interesting character. His special techniques are “Barrage of Lions” and “Fire Styles” jutsu.

How to draw Sasuke Uchiha in 9 steps

Step 1

Step 2

Step 3

Step 4

Step 5

Step 6

Step 7

Step 8

Step 9

HOW TO DRAW KYUBI CUTE

noreply@blogger.com (faisal) — Tue, 16 Aug 2011 09:01:00 +0000

We are going to learn how to draw Kyubi Cute. It won’t be so hard, as our lesson contains only 9 steps.

How to draw Kyubi Cute in 9 steps

Step 1

Step 2

Step 3

Step 4

Step 5

Step 6

Step 7

Step 8

Step 9

That wasn’t so hard, was it?

Create Vertical Menu

noreply@blogger.com (faisal) — Fri, 15 Jul 2011 15:20:00 +0000

We have learned how to create horizontal menu before. Now we will try to make a vertical menu. We will make a vertical menu like the image. Ok let's do it

1. Login to blogger then choose "Layout-->Edit HTML"
2. Put the script below before this code ]]></b:skin> or put it in CSS code area.

.glossymenu, .glossymenu li ul{
list-style-type: none;
margin: 0;
padding: 0;
width: 185px; /*WIDTH OF MAIN MENU ITEMS*/
border: 1px solid black;
}
.glossymenu li{
position: relative;
}
.glossymenu li a{
background: white url('http://blog.superinhost.com/vertical/blue1.gif') repeat-x bottom left;
font: bold 12px Verdana, Helvetica, sans-serif;
color: white;
display: block;
width: auto;
padding: 5px 0;
padding-left: 10px;
text-decoration: none;
}
.glossymenu li ul{
position: absolute;
width: 190px;
left: 0;
top: 0;
display: none;
}
.glossymenu li ul li{
float: left;
}
.glossymenu li ul a{
width: 180px;
}
.glossymenu li a:visited, .glossymenu li a:active{
color: white;
}
.glossymenu li a:hover{
background-image: url('http://blog.superinhost.com/vertical/blue2.gif');
}

* html .glossymenu li { float: left; height: 1%; }
* html .glossymenu li a { height: 1%; }

You can change the menu color, look at the red text (blue1.gif and blue2.gif). Change it with some color menu below. For example, if you want to choose red color, then the code would be like this :

.glossymenu li a{
background: white url('http://blog.superinhost.com/vertical/red.gif') repeat-x bottom left;

dan

.glossymenu li a:hover{
background-image: url('http://blog.superinhost.com/vertical/red.gif');

Vertical Menu Color :

	blue1.gif blue2.gif
	green1.gif green2.gif
	red1.gif red2.gif
	pink1.gif pink2.gif
	black1.gif black2.gif

3. Save your template.
4. Then go to "Page Elements" menu
5. choose "Add a Gadget -->HTML/JavaScript" the insert the code below.

<ul id="verticalmenu" class="glossymenu">
<li><a href="/">Home</a></li>
<li><a href="http://trik-tips.blogspot.com">Trik Blog</a></li>
<li><a href="http://x-template.blogspot.com" >Free Template</a></li>
<li><a href="http://getebook.co.cc">Free Ebook</a></li>
</li>
</ul>

Note :
- The red code is the links.
- The Blue code is anchor text.
- If you want to add menu, just copy the blink code and paste it.

6. Then click "Save"

Introduction to Family Governance

noreply@blogger.com (faisal) — Thu, 14 Jul 2011 16:06:00 +0000

The family aspect is what differentiates family companies from their counterparts. As a consequence, the family plays a crucial role in the governance of its business. When the family is still at its initial founder(s) stage, very few family governance issues may be apparent as most decisions are taken by the founder(s) and the family voice is still unified. Overtime, as the family goes through the next stages of its lifecycle, newer generations and more members join the family business. This implies different ideas and opinions on how the business should be run and its strategy set. It becomes mandatory then to establish a clear family governance structure that will bring discipline among family members, prevent potential conflicts, and ensure the continuity of the business. A well functioning family governance structure will mainly aim at:

Communicating the family values, mission, and long term vision to all family members.
Keeping family members (especially those who are not involved in the
business) informed about major business accomplishments, challenges,
and strategic directions.
Communicating the rules and decisions that might affect family
members’ employment, dividends, and other benefits they usually get from
the business.
Establishing formal communication channels that allow family members to share their ideas, aspirations and issues.
Allowing the family to come together and make any necessary decisions.

Developing such a governance structure will help build trust among
family members (especially between those inside and outside of the
business), and unify the family thus increasing the viability chances of
the business. The major constituents of a family governance structure
are:

A family constitution that clearly states the family vision, mission, values, and policies regulating family members’ relationship with the business.
Family institutions, which can have different forms and purposes, e.g. family assembly, family council, and other family committees.

Corporate Governance Definition

noreply@blogger.com (faisal) — Thu, 14 Jul 2011 16:02:00 +0000

“Corporate governance refers to the structures and processes for the direction and control of companies. Corporate governance concerns the relationships among the management, board of directors, controlling shareholders, minority shareholders and other stakeholders. Good corporate governance contributes to sustainable economic development by enhancing the performance of companies and increasing their access to outside capital”.[1]

This definition focuses on three key elements:

- Direction refers to all the decisions that relate to setting the overall strategic direction of the company such as: (i) long-term strategic decisions; (ii) large-scale investment decisions; (iii) mergers and acquisitions; and (iv) succession planning and appointment of key senior managers, such as the CEO of the company.

- Control refers to all the actions necessary to oversee the management’s performance and follow up on the implementation of the strategic decisions set above.

- Relationship among the main governing bodies of the firm refers to the interactions among the shareholders, the directors of the board, and the managers. An important element of any good corporate governance structure is the clear definition of the role, duties, rights, and expectations of each of these governing bodies.

Family Member Roles in the Governance of Their Business

noreply@blogger.com (faisal) — Thu, 14 Jul 2011 16:01:00 +0000

In a typical non-family business, any involved individual can be an employee, a manager, an owner, a director, or some combination of these roles. In a family-owned business however, matters become more complex as an individual can have multiple roles and responsibilities. These multiple roles are usually associated with different incentives, which increase the challenges that family businesses face as opposed to their non-family counterparts.[1]

1- Owners (Shareholders)

Owners in a family business have several roles and motivations that can sometimes lead to conflicting opinions. For example, a decision to reinvest profits in the company instead of distributing them as dividends can be differently seen by the various owners depending on their other roles in the business. An owner who works in the family business might not object to such a decision since he/she is already receiving a salary from the company. On the other hand, this situation would look different from the perspective of an owner who does not work in the business and relies on dividends as a main source of income. This owner would actually be interested in receiving higher and more frequent dividends.

Matters usually get more complex as the family business grows and its owners hold different roles, with different incentives. Some of the roles that an owner in a family business can have are:

- Owner only.

- Owner/manager.

- Owner/family member.

- Owner/family member/manager.

- Owner/director.

- Owner/family member/director.

- Owner/family member/director/manager.

2- Managers (Senior Management)

Managers in a family business will also have different motivations depending on their other roles within the business. A common issue in this area is the unequal treatment of family and non-family managers. In many family businesses, part or all of the senior management positions are strictly reserved for family members. This could negatively impact the motivation and performance of non-family managers who know for a fact that no matter how hard they work, they will never be part of the senior management of the company. As a consequence, many family businesses find it very hard to attract and retain talented non-family managers. Setting up a clear and fair employment policy (for both family and non-family employees) will make it easier for family businesses to keep their very best employees motivated and interested in the growth of the company. Such policy would align the employees’ incentives to their performance regardless of whether they are part of the family or not.

3- Directors (Board of Directors)

When it comes to board membership, most family businesses reserve this right to members of the family and in a few cases to some well trusted non-family managers. This practice is generally used as a way of keeping the family control over the direction of its business. Indeed, most decisions are usually taken by the family-member directors. In the previous example of dividend distribution, family directors who are also managers in the business would naturally encourage reinvesting profits in the company so as to increase its growth potential. On the contrary, family directors who do not work in the business would rather make the decision of distributing the profits as dividends to family shareholders. These contradicting views can lead to major conflicts in the board and negatively impact its way of functioning.

4- Family Members (the Family and its Institutions)

As previously mentioned, family members can have different responsibilities, rights, and expectations from their business. This situation can sometimes lead to conflicts and issues that might jeopardize the continuity of the family business. One issue that can increase conflicts among family members is the level of access to information about the company and its activities. This can be problematic as the members who work in the business usually have access to such information in a timely manner while those outside of the business can’t access it in the same way.[2] Family businesses should establish the necessary communication channels and institutions to keep all family members informed about the business, strategy, challenges, and the overall direction where the company is heading.

Stages of Growth in a Family Business

noreply@blogger.com (faisal) — Thu, 14 Jul 2011 15:59:00 +0000

Several models have been developed to describe and analyze the different stages that family businesses go through during their existence. In this Handbook, we will use the basic three-stage model that summarizes the family business lifecycle as: (i) the Founder(s) Stage; (ii) the Sibling Partnership Stage; and (iii) the Cousin Confederation Stage.[1] Although this model allows for a good analysis of the three basic steps of evolution of the family business, it does not mandate that all family-owned companies will necessarily go through all three stages of development. For example, some companies will disappear during the early stages of their lifecycle because of bankruptcy or getting acquired by another firm.

The evolution of ownership and management within most family businesses goes through the following stages:

Stage 1: The Founder(s) (Controlling Owner(s))

This is the initial step of the family business’ existence. The business is entirely owned and managed by the founder(s). Most founders might seek advice from a small number of outside advisors and/or business associates but they will make the majority of the key decisions themselves. This stage is usually characterized by a strong commitment of the founder(s) to the success of their company and a relatively simple governance structure. Overall, this stage contains limited corporate governance issues compared to the next two stages since both the control and ownership of the company are still in the hands of the same person(s): the founder(s). Perhaps the most important issue that will need to be addressed during the life of the founder(s) is succession planning. For the family business to survive into its next stage, the founder(s) should make the necessary efforts to plan for their succession and start grooming the next leader(s) of the company.

Stage 2: The Sibling Partnership

This is the stage where management and ownership have been transferred to the children of the founder(s). As more family members are now involved in the company, governance issues tend to become relatively more complex than those observed during the initial stage of the business’ existence. Some of the common challenges of the sibling partnership stage are: maintaining siblings’ harmony, formalizing business processes and procedures, establishing efficient communication channels between family members, and ensuring succession planning for key management positions.

Stage 3: The Cousin Confederation (Cousin Consortium or Family Dynasty)

At this stage, the business’ governance becomes more complex as more family members are directly or indirectly involved in the business, including children of the siblings, cousins, and in-laws. Since many of these members belong to different generations and different branches of the family, they might have diverse ideas on how the company should be run and how the overall strategy should be set. In addition, any conflicts that existed among the siblings in the previous stage would most likely be carried to the cousin generation as well. As a consequence, this stage involves most family governance issues. Some of the most common issues that family businesses face at this stage are: family member employment; family shareholding rights; shareholding liquidity; dividend policy; family member role in the business; family conflict resolution; and family vision and mission.

Key Corporate Governance Issues – During the Development Cycle of Family Businesses

Ownership Stage	Dominant Shareholder Issues
Stage 1: The Founder(s)	- Leadership transition - Succession - Estate planning
Stage 2: The Sibling Partnership	- Maintaining teamwork and harmony - Sustaining family ownership - Succession
Stage 3: The Cousin Confederation	- Allocation of corporate capital: dividends, debt, and profit levels - Shareholder liquidity - Family conflict resolution - Family participation and role - Family vision and mission - Family linkage with the business

Each stage presents different challenges and issues that if properly managed can ensure the continuity of the family business. Most family-owned companies are successful during their infancy stage thanks to the tremendous efforts made by the founder(s) as they are implicated in all aspects of the business. In the longer term though, it becomes necessary to set up the right governance structures and mechanisms that will allow for efficient communication channels and a clear definition of the roles and expectations of every person involved in the family business.

Family Business Definition and Characteristics – Strengths and Weaknesses

noreply@blogger.com (faisal) — Thu, 14 Jul 2011 15:55:00 +0000

Definition: In this Handbook, a family business refers to a company where the voting majority is in the hands of the controlling family; including the founder(s) who intend to pass the business on to their descendants. The terms “family business”, “family firm”, “family company”, “family-owned business”, “family-owned company”, and “family-controlled company” will be used interchangeably throughout the Handbook to refer to family businesses.

Strengths: Several studies have shown that family-owned companies outperform their non-family counterparts in terms of sales, profits, and other growth measures.[1] A Thomson Financial study for Newsweek compared family firms to rivals on the six major indexes in Europe and showed that family companies outperformed their rivals on all of these indexes, from London's FTSE to Madrid's IBEX. Thomson Financial created a unique index for both family and non-family firms in each country, and tracked them over 10 years through December 2003. In Germany, the family index climbed 206 percent, while the non-family stocks increased just 47 percent. In France, the family index surged 203 percent, while its counterpart rose only 76 percent. Family businesses also outperformed their counterparts in Switzerland, Spain, Britain and Italy.[2]

This high performance is the result of the inherent strengths that family businesses have compared to their counterparts. Some of these strengths include:[3]

- Commitment. The family –as the business owner– shows the highest dedication in seeing its business grow, prosper, and get passed on to the next generations. As a result, many family members identify with the company and are usually willing to work harder and reinvest part of their profits into the business to allow it to grow in the long term. In dealing with its family business clients, IFC highly values having a committed set of shareholders at the core of the company.

- Knowledge Continuity. Families in business make it a priority to pass their accumulated knowledge, experience, and skills to the next generations. Many family members get immersed into their family business from a very young age. This increases their level of commitment and provides them with the necessary tools to run their family business.

- Reliability and Pride. Because family businesses have their name and reputation associated with their products and/or services, they strive to increase the quality of their output and to maintain a good relationship with their partners (customers, suppliers, employees, community, etc.).

Weaknesses: Perhaps the most often cited characteristic of family businesses is that many of them fail to be sustainable in the long term. Indeed about two-thirds to three-quarters of family businesses either collapse or are sold by the founder(s) during their own tenure. Only 5 to 15 percent continue into the third generation in the hands of the descendents of the founder(s).[4]

This high rate of failure among family businesses is attributed to a multitude of reasons. Some of these reasons are the same ones that could make any other business fail such as poor management, insufficient cash to fund growth, inadequate control of costs, industry and other macro conditions. However, family businesses also show some weaknesses that are especially relevant to their nature. Some of these weaknesses are:

- Complexity. Family businesses are usually more complex in terms of governance than their counterparts due to the addition of a new variable: the family. Adding the family emotions and issues to the business increases the complexity of issues that these businesses have to deal with. Unlike in other types of businesses, family members play different roles within their business, which can sometimes lead to a non-alignment of incentives among all family members. This point will be discussed in more detail in Section I of the Handbook.

- Informality. Because most families run their businesses themselves (at least during the first and second generations), there is usually very little interest in setting clearly articulated business practices and procedures. As the family and its business grow larger, this situation can lead to many inefficiencies and internal conflicts that could threaten the continuity of the business.

- Lack of Discipline. Many family businesses do not pay sufficient attention to key strategic areas such as: CEO and other key management positions’ succession planning, family member employment in the company, and attracting and retaining skilled outside managers. Delaying or ignoring such important strategic decisions could lead to business failure in any family business.

Introduction: Family Business Governance

noreply@blogger.com (faisal) — Thu, 14 Jul 2011 15:50:00 +0000

Family businesses constitute the world’s oldest and most dominant form of business organizations. In many countries, family businesses represent more than 70 percent of the overall businesses and play a key role in the economy growth and workforce employment. In Spain, for example, about 75 percent of the businesses are family-owned and contribute to 65 percent of the country’s GNP on average.[1] Similarly, family businesses contribute to about 60 percent of the aggregate GNP in Latin America.[2]

Family businesses range from small and medium-sized companies to large conglomerates that operate in multiple industries and countries. Some of the well-known family businesses include: Salvatore Ferragamo, Benetton, and Fiat Group in Italy; L’Oreal, Carrefour Group, LVMH, and Michelin in France; Samsung, Hyundai Motor, and LG Group in South Korea; BMW, and Siemens in Germany; Kikkoman, and Ito-Yokado in Japan; and finally Ford Motors Co, and Wal-Mart Stores in the United States.

It is also a fact that most family businesses have a very short life span beyond their founder’s stage and that some 95 percent of family businesses do not survive the third generation of ownership.[3] This is often the consequence of a lack of preparation of the subsequent generations to handle the demands of a growing business and a much larger family. Family businesses can improve their odds of survival by setting the right governance structures in place and by starting the educational process of the subsequent generations in this area as soon as possible.

This Handbook will focus on the unique corporate governance challenges that family businesses face and propose structures and practices that can mitigate these challenges and ensure the viability of the business. The Handbook gives an international perspective since it focuses on characteristics of family businesses that can be observed across countries. The suggested governance structures of the Handbook will need to be adapted to the local requirements and regulations of family businesses before being applied in a specific country.

How to Increase the Width of Comment Form in Blogger

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 06:54:00 +0000

In many Blogger blogs you may have found that the default comment
form’s width is much smaller than rest of the post body width. When you
are customizing the design of your blog then you must be also thinking
to increase the width of the Blogger’s comment form. In this simple tutorial I will tell how to expand it.

Normally, the default width for the comment form of blogger is fixed to 425 pixels. So we just need to override this with a CSS definition.

Step 1: Go to Dashboard > Design > Edit HTML tab.

Step 2: Find ]]></b:skin> and before it add:

.comment-form{
min-width: 100% !important;
}

As you can see that a minimum width has been set to let browsers know that the minimum width of the form should match with the width of the post body.

Step 3: Save your template and view your blog. After going inside of any of the post you will find that the size of the Blogger’s comment form has increased in size (width).

Normally this should work with any template.

Add Two Sidebar Columns Below Posts in Blogger

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 06:44:00 +0000

Today I will tell you how to add two extra widget sections / sidebar columns below Blogger post sections within main wrapper.

Step 1: Go to Design > Edit HTML tab and find for:

<div id='main-wrapper'>

<b:section class='main' id='main' showaddelement='no'>

<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>

</b:section>

</div>

Step 2: Add the following snippet before the closing DIV. It is </div> marked in bold in step 1.

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:section class='sidebar' id='col-left' showaddelement='yes' />

<b:section class='sidebar' id='col-right' showaddelement='yes'/>

<div style='clear: both;'/>

</b:if>

I have used the conditional tags highlighted in red to show these sidebar sections only in homepage of your blog. If you want these widget sections to be shown also on post pages then delete the conditional tags.

Step 3: Find ]]></b:skin> and before this add:

#col-left {

width: 48%;

float: left;

}

#col-right {

width: 48%;

float: right;

}

Step 4: Save you template and go to Blogger “Page Elements” tab.
You will find that there are two widget sections added just below the
post body. Now add some widgets to these and view your blog.

One more thing you will notice that the sidebar columns will be visible after the blog pager and blog feed links. Blog-pager links are “Older Post”, “Home” and “Newer Post” links and blog-feed
links are “Subscribe to: Posts (Atom)” and “Subscribe to: Post Comments
(Atom)” links that are visible in Blogger homepage and in item pages
below every posts.

If you think that it looks bad then you can hide or remove these links so that the two sidebar widget sections will appear only after the post body. So let’s do another step.

Step 5 (Optional): Go to Design > Edit HTML tab and find for “]]></b:skin>”. Immediately below it add the following styling properties:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style type='text/css'>

#blog-pager {

display:none;

}

.feed-links {

display:none;

}

</style>

</b:if>

Again note that here also I have used the conditional tags for homepage only. At last save you template

It’s done.

Add Two Sidebar Columns below Main Sidebar in Blogger

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 06:37:00 +0000

I have told you about creating three columns in Blogger template. Many of us try to avoid this as it may sometimes look clumsy but we need widget sections to add some blogger gadgets. Now if you want to add two small sidebar columns below main sidebar in your blogger template, then I will tell you how to do it.

So let's start!

First go to Design > Edit HTML and backup your template.

1. Find the below section:

#sidebar-wrapper {
width:220px;
float:right;
word-wrap:break-word;
overflow:hidden;
}

2. And just below it add the following codes:

#right-col {
width:48%;
float:right;
word-wrap:break-word;
overflow:hidden;
}
#left-col {
width:48%;
float:left;
word-wrap:break-word;
overflow:hidden;
}

3. Now find:

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'/>
</div>

4. And add the bold codes or replace the whole code with:

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'/>
<b:section class='sidebar' id='left-col' preferred='yes'/>
<b:section class='sidebar' id='right-col' preferred='yes'/>
</div>

These bold snippets are added which would actually add two widget sections below the main sidebar.

Preview your template for any errors and save it.

Update:
Some of you are having trouble adding the two small sidebar columns in
their templates and may be getting an XML error. So, here's the
solution:

You must be having widgets in your sidebar like:

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
< ..widgets here.. >

</b:section>
</div>

Put the bold codes below as shown below:

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
< ..widgets here.. >
</b:section>
<b:section class='sidebar' id='left-col' preferred='yes'/>
<b:section class='sidebar' id='right-col' preferred='yes'/>
</div>

Now go to Design > Page Elements and check for your newly added two small sidebars below you main sidebar.

To be Noted:

This works only with layout templates.

How to Make Footer Increase in Width in Blogger

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 06:27:00 +0000

In previous tutorial I have told you how to expand Blogger Header the width of the Browser. Now apply this same rule to increase the Blogger footer section the width of the browser.

Let's have a tutorial.

1. Go to Layout > Edit HTML. Backup your template.

2. The footer has 660px in width and may be different for other
templates, so we need to increase this width. Find this section of code
in your template:

#footer {

border: 1px solid #000000;

width: 660px;

margin:0 auto;

padding-top:15px;

line-height: 1.6em;

text-transform:uppercase;

letter-spacing:.1em;

text-align: center;

}

Replace it with:

#footer-wrapper {

border: 1px solid #000000;

width: 950px;

margin:0 auto;

padding-top:15px;

line-height: 1.6em;

letter-spacing:.1em;

text-align: center;

word-wrap: break-word;

overflow: hidden;

}

The changes are high-lighted in bold.

2. Add a new property just before #footer-wrapper section:

#footer-expand {

background: #333333;

}

3. Find this section on your template and delete it:

<div id='footer-wrapper'>

<b:section class='footer' id='footer'/>

</div>

4. Find the ending of the outer-wrapper. In an example of Minima template, it will be:

</div></div>

And just bellow it add the following codes:

<div id='footer-expand'>

<div id='footer-wrapper'>

<b:section class='footer' id='footer'/>

</div>

</div>

You can change the background color of the header and footer sections by changing the hex value #333333 according to your chosen hex value. And you can also add images to it, like:

#footer-expand {

background: #333333 url(your hosted image);

}

Now preview your template and save it.

So you got your footer customized and styled and increase the width of the Blogger template footer section across the browser also. Now style it accordingly.

To be Noted:

This works only with layout templates.

How to Make Blogger Header Expand the Width of the Browser

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 06:11:00 +0000

So in this segment, we will customize and expand the blogger's header section to the width of browser.

1. Go to Layout > Edit HTML, backup your template.

2. Find this section in your template code:

#header-wrapper {

width: 660px;

border: 1px solid #ffffff;

margin:0 auto 10px;

border:1px solid $bordercolor;

}

The bold code can be different in different templates.

And increase 660px to 950px. This will look like:

#header-wrapper {

width: 950px;

border: 1px solid #ffffff;

margin:0 auto 10px;

border:1px solid $bordercolor;

}

Also change the outer-wrapper and footer width to 950px.

3. Preview for errors and save it when it's done.

Advance Way to Increase Blogger Header's Width Across the Browser

If you want to expand the background color of blogger header section across the width of the browser, then apply this tutorial.

#header-expand {

background: #333333;

}

2. Find this section in your template code:

#header-expand {

background: #333333;

}

2. Find this section in your template code:

<div id='header-wrapper'>

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

<b:widget id='Header1' locked='true' title='Your Blog Title (Header)' type='Header'/>

</b:section>

</div>

And delete this.

Find:

<div id='outer-wrapper'>

And paste the following code just before it:

<div id='header-expand'>

<div id='header-wrapper'>

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

<b:widget id='Header1' locked='true' title='Your Blog Title (Header)' type='Header'/>

</b:section>

</div>

</div>

3. Now Preview your template for confirmation and save it.

You can change the background color of the header section by substituting #333333 for your chosen hex value or even by your image in the style of outer-header.
Like For example:

#header-expand {

background: #ffcc66 url(Your hosted image URL);

}

So you got your style and increased the width of your Blogger template header section with the width of the browser. Now all you have customize it accordingly to match your style.

To be Noted:

This works only with layout templates.

Add Three Columns in Footer to Blogger

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 06:05:00 +0000

Keeping you sidebars clean makes your blog look good. This is where the role of the columns in footer section comes in. Also it will give your blog a new style. For example, see at the bottom of my blog. This simple tutorial will explain how to do create and add three sidebar columns to footer section in Blogger templates.

1. Go to Design > Edit HTML and first backup your template.

2. Move your gadgets/widgets (if any) from the footer section to your sidebar.

3. Find the closing "]]></b:skin>" tag and immediately before this line, add the following styling definitions and properties:

#footer-left {

width: 33%;

float: left;

margin:5px;

text-align: left;

}

#footer-center {

width: 34%;

float: left;

margin:5px;

text-align: center;

}

#footer-right {

width: 33%;

float: right;

margin:5px;

text-align: right;

}

#footer-column-container {

clear:both;

}

.footer-column {

padding:5px;

}

3. Find the codes:

<div id='footer-wrapper'>

<b:section class='footer' id='footer'/>

</div>

And replace this section with the below codes to add three widget sections to blogger footer:

<div id='footer-wrapper'>

<div id='footer-column-container'>

<div id='footer-left'>

<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>

</div>

<div id='footer-center'>

<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>

</div>

<div id='footer-right'>

<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>

</div>

<div style='clear:both;'/>

</div>

</div>

5. Preview for any error and save it. Go to Design > Page Elements, you will find out that you have added three columns in Blogger footer section.

Now move and add some of the widgets there and see how it looks.

To be Noted:

This works only with layout templates.

Download 3 Sidebar Columns Minima Blogger Template

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 05:41:00 +0000

Blogger Layout templates, especially Minima, are still famous among the designers and developers as it can be highly customized. But Blogger don't have default three column layout Minima templates. So I have made two Minima Blogger templates with three sidebar columns for tutorial purpose and for those who want to make their own templates from the scratch.

Download Minima Template with Sidebar to Left

Download

Download Blogger Minima Template with Sidebar to Right

Download

Also don't forget to have a look at three column blogger template tutorial for Layout (XML) tempaltes.

How to Create Three Column Blogger Template

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 05:24:00 +0000

You must have seen many blogs having three columns. You may also want to make your own three column Blogger Layout Template and give your blog a new level in style. So let's do it with a simple tutorial.

You can see in Design > Page elements that you already have two column, one for the main body and the other is the sidebar. So you need to create and add an extra sidebar column.

Adding the Third Sidebar Column in Blogger Template

1. Go to Design > Edit Template and backup your template.

2. Find:

#sidebar-wrapper {
width: 220px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

And change float to:

float: right;

3. Bellow it add:

#left-sidebar-wrap {

width: 220px;

float: left;

word-wrap: break-word;

overflow: hidden;

}

This "float: left" will make the sidebar float to left. Thus you will be having a sidebar to the left of your blogger template.

4. Find and change the width of the outer-wrapper to 900px or more to avoid overlapping of sidebar over the main-wrapper.

5. Find #main-wrapper and replace it with:

#main-wrapper {

width: 410px;

float: left;

margin:0 20px;

word-wrap: break-word; /* fix for long text breaking sidebar float in IE */

overflow: hidden; /* fix for long non-text content breaking IE sidebar float */

}

Here a margin to left and right of 20px is
added to avoid overlapping of sidebars with the main wrapper. You can
change it accordingly to overcome the issue of overlapping of sidebars.

>

7. Find the section:

<div id='main-wrapper'>

And just before this add:

<div id='left-sidebar-wrap'>

<b:section class='sidebar' id='left-sidebar' preferred='yes'/>

</div>

8. Save your template and "Wallah", its done. You have created an extra sidebar for your Blogger template.

Now you have to do some adjustments yourselves. Adjust the widths by altering the pixels (px) of the "outer-wrapper", "main-wrapper", "sidebar-wrapper" and "left-sidebar-wrap". Adjust the margins, paddings and width by same way to "header-wrapper" and "footer-wrapper" to match the style.

See an example by downloading 3 sidebar columns Minima Blogger Template.

Static Pages are Now Available in Blogger

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 05:07:00 +0000

Static pages are now finally made available in Blogger. Now you can create a static 'About' page or 'Contact Me' page for your blogs. So it became easy to hide your "Contact Me" page and other pages from appearing in blog's homepage. It is simple to add static pages and create a page similar to how you write a blog post. But the limitation is upto 10 posts.

How to add static pages to Blogger

As posted on Pages come to Blogger In Draft, Go to Posting > Edit Pages tab and click New Page.

After making your desired static page and after publishing the page, you can link to it from the new Pages widget.

This widget lets you add links to your pages as navigation bar at the top of your blog, or in your blog's sidebar.

In the Pages widget, you can decide which pages will have links and the order that they will appear. By checking the "Add new Pages by default" box, you can also choose whether you want the links to be automatically created for static pages whenever you create them.

For those who have customized their template, they may not automatically support Pages as horizontal "tabs". So to add this feature, go to Layout > Edit HTML and check the Expand Widget Templates box.

Now find:

<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='no'/>
</div>

and change showaddelement='no' to showaddelement='yes'.

If the above HTML does not exist, then paste the following codes after <div id="content-wrapper"> (default position).

<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol' showaddelement='yes'/>
</div>

Lastly, Preview your template for any errors and save it. You will get horizontal links now.

Using Conditional Tags in Blogger

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 04:11:00 +0000

Conditional tags in Blogger are used to tell browsers what to do in certain conditions. For example, when we use:

<b:if cond='data:blog.pageType == "item"'>
Hello world
<b:else/>
Goodbye Cruel World
</b:if>

It gives the browser the condition that when it’s an item (post) page then show “Hello world” otherwise, for every other pages show “Goodbye Cruel World”. Interesting, isn’t it.

A conditional tag comes handy when you are designing your Blogger blogs and customizing it from the scratch to take it to the next level. But first you need to know how many types of pages are there in Blogger and then how to use the conditional tags respective to that type of page. In this tutorial I will try to cover most of it, so let’s start.

Type of Pages in Blogger and Conditional Tags For It

Item Page

Item page refers to the individual post pages. It’s the page when you click the tile of the post or the read more link in blogger to read the full post. The conditional tag:

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

Index Page

It refers to every other page except item (post) pages. The conditional tag:

<b:if cond='data:blog.pageType == "index"'>
Hello World
</b:if>

Archive Page

It’s for your archive pages in Blogger. The tag will be:

<b:if cond='data:blog.pageType == "archive"'>
Hello World
</b:if>

Static Page

For static pages in blogger it will be:

<b:if cond='data:blog.pageType == "static_page"'>
Hello World
</b:if>

For a Particular Page

If you want to do something on a particular page then the conditional tag for it will be:

<b:if cond='data:blog.url == "URL of the page"'>
Hello World
</b:if>

The only thing that you have to do is replace “URL of the page” with your page’s URL which you want to have.

Homepage only

It's for the homepage only.

<b:if cond='data:blog.url == data:blog.homepageUrl'>
Hello World
</b:if>

Alternative Condition

Now suppose you want a conditional tag that alternates every rule. Say, in example 1, I showed how to display something only in post pages but just an “!” mark can alternate the condition. For example, when we apply:

<b:if cond='data:blog.pageType != "item"'>
Hello World
</b:if>

It will set the condition that to show it on every page other than post page.

Conclusion

“Hello world” is an example, but if it’s implemented correctly, you can add conditions to particular widgets or gadgets to show them in specific pages. However, you can find in most of my tutorials that I have used it. Have a look at my getting social tutorials for blogger, you will find the tags.

How to Show HTML and JavaScript Codes within Blogger Posts

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 03:54:00 +0000

While writing my blog posts for my readers I noticed that every time I use "<" or ">" signs to show JavaScript or HTML codes and snippets within my Blogger post editor in "Edit HTML" mode, it's not visible. This happens because Blogger post editor recognizes it as snippets that should be used with your blogger template.

So to show JavaScript or HTML codes within Blogger posts or comments, use "<" instead of "<" and ">" instead of ">" (without quotes).

Now if there are big codes then go to Plus2net.com and convert your codes.

This is the simplest method to show JavaScript and HTML codes within blog posts.

Create and Add your Own Contact Form to Blogger

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 03:38:00 +0000

If you are a blogger then you must have your own contact form to communicate with your blog readers and visitors. You cannot post your email ID to public because you will get lot of SPAM massages.

Blogger don't give any contact forms for their blogs, so we need to create it and add it ourselves. You can create contact form through Google docs or the simple way is to get it easily from another source.

There are many contact form providers but I will go with Kontactr because it's easy. Register with them and they will give you the code.

Button Code

It is a text link or a button. When the link is clicked it will direct the user to your contact page which is provided by Kontactr. This can be useful when any person wants to contact you and his browser does not supports JavaScript or you want to use it in any other website, forums, etc.

HTML Embed Contact Form

This is best to use for your blog as it uses no JavaScript. It's based on HTML codes using table form, and can be seen in any Lynx based browsers.

Adding Contact Form to Blogger

Choose any one of the above told ways and after selecting and customizing the type of form you want, copy any one of the code that they will provide to your clipboard.

Now, to add the contact form, create a new post, write ‘when, why, how, etc.’ to contact you, paste the any one of the codes mentioned above and publish it. You will have your own contact form for blogger.

Hiding the Contact Me Page Appearing on Homepage of Blogger

You don’t want the contact page to be viewed on homepage. So while publishing the post, back-date it. For example: today’s date is 7/8/2009, then set the date to 6/25/2009 and then publish it. You can also create Static Pages which is now made available to Blogger, which will be easier. See an example of my contact me page.

Basic Settings for Blogspot

noreply@blogger.com (faisal) — Wed, 13 Jul 2011 03:03:00 +0000

New to Blogger? After creating your blog don't just start blogging because you need to know and configure some settings for your newly created blog on Blogger Platform. From your blogspot dashboard, click “Settings” which will lead you to do some basic settings and tweak your blog.

Under the Settings tab, the first thing you need to do is a basic setup for your blog. So let’s discuss the options.

Blog Tools: Here you can Import your blog, Export to another blog and Delete your blogger blog. It comes handy because you can backup your blog by clicking the “Import blog button”.

Title: Give a title for your blog. It will be better if you choose a title that matches your blog’s niche.

Description (Optional): Don’t forget to give a nice and brief description with some keywords in it. But I prefer to leave it blank as you may don't want to have same description for the posts that you write for SEO reason.

Add your blog to our listing: This will add your blog to Google's blog list. You will also find a navbar on top of your blog which enables you to search and go to next or previous blog that are listed and linked with Blogger.com. If you want others to come to your blog through these options, you may select “Yes” otherwise “No”.

Let search engines find your blog: If you want your blogspot blog to be found by the search engines then select “Yes” otherwise “No” if you want to blog privately.

Show Quick Editing on your Blog: This option will let you to automatically add a quick edit icon to your blog posts after they are published. Only you can see this button after logging in to your blogger account. This allows you to quickly edit your post form your blog directly.

Show Email Post links: Select “Yes” if you want to add a small “Email to Friends” button beneath your blog posts.

Adult Content: Select “Yes” if your blog contains adult content which will ask you blog viewers to confirm that they want to proceed to your blog, otherwise “No”.

Now comes to Global Settings that will be applied to all of your blogs.

Select post editor: There you will find “Updated editor”, “Old editor” and “Hide compose mode” which will not contain WYSIWYG editor. You may like to select the updated editor because it’s easy to write and format your posts accordingly.

Enable transliteration: If enabled, it will let you add a toolbar to the editor to convert English language to users selected language.

At last, save your basic settings for your blog.

Best Blogger Tempelates

noreply@blogger.com (faisal) — Tue, 12 Jul 2011 17:04:00 +0000

One of the popular features of Blogger Blogspot Templates is the Featured Post Slider or Slideshow Carousal.Not too long ago a very plain Image Slider was the best you could hope for and you were lucky to even get that.However now with so many awesome Free Blogger Templates and Designers creating templates and converting Css and Wordpress Themes to Blogger the options are fantastic.We constantly see templates of premium quality with stunning Image Sliders available for free download.In this post i will list 16 of the Best Blogger Templates With Featured Post Sliders, Image Sideshows and Picture Carousals.All the Sliders are created with jQuery which allows some cool features such as the transitions (The effect between each slide).

So in no particular order here is the list !

Free Blogger Templates With Fitted Featured Sliders

-Click On The Screenshot Of Each Template For The Demo and Download Details.

Namisan - Stunning Slider Blogger Template

Namisan has the latest jQuery Featured Slideshow from Cu3er with stunning transitions that completely slice up the images between slides.A well coded template packed with gadgets and features Namisan has a two column layout with right sidebar.

Ocenolis Magazine - Advanced Blogger Template

A colorful Three Column Blogger template with Two right sidebars.The Featured Slider, Image Slideshow Displays the images in a stacked fashion which rotate on click.

Nyke - Magazine Blogger Template

The Featured Slider, Image Slideshow has a very unique rounded bottom and a number of coll transitions between images.The template has a two column layout with right sidebar.

Game Madness - Assassins Creed Blogger Template

The Featured Slider, Image Slideshow on the Game Madness template spans the full width of the blog with nice transitions from each corner.The template has lots of extra gadgets and a gaming theme.

MoonLight - Clean Magazine Blogger Template

The Featured Slider, Picture Slideshow on Moonlight has a more simple design but fits neatly above the posts with auto scroll and manual scroll options.The template has a minimalist design with two columns and a right sidebar.

Simplex Buzz - Full Background Slideshow

Oracle - Advanced Magazine Blogger Template

Oracle has a beautifully fitted Featured Slider, Image Slideshow with the sides fading away.The slides auto scroll with a manual scroll option.The template also has a two column magazine design with a left sidebar.

Extreme - Portfolio Magazine Blogger Template

Extreme Portfolio has a full featured section below the header were users can scroll through featured posts.The template also has a second categories section and a two column layout with right sidebar.

Superb - Advanced Blogger Template

Superb has a really amazing and unique Featured Slider, Image Slideshow.The slides are stacked and move across with the titles listed vertically on the side.Superb has lots of other great features and a two column layout with right sidebar.

Modern Photography - Abstract Style Template

Modern Photography is a specialist Blogger template with a cool large Featured Slideshow, Image Carousal.The slider has a continues scroll and manual scroll option.The layout is two column with a right sidebar.

Calenotis - Photographers Magazine Blogger Template

Calenotis has a beautiful full width Featured Slider Slideshow that has a 3D design.The slides are on auto scroll with a number of different transitions.The template also has a professional magazine design with a two column right sidebar layout.

Magulesco -Featured Magazine Blogger Template

Magulesco has an extremely clean professional design.The Featured Slider Slideshow sits over the header and body with a wide crisp design.The slides have some neat transitions with description section on each.The template also has a two column magazine design with right sidebar.

Dimenzion - 3D Style Blogger Template

Dimenzion has a classic featured slider with the featured posts listed to the right of the slides for navigation.The templates design is bright and somewhat unique with a two column right sidebar layout.

Glow - Free Premium Blogger Template

Glow has a beautifully constructed Featured Slider Slideshow.The slides are visible as thumbnails on the left of the full size slider.The template also has a glowing two column magazine design with right sidebar.

Mahasoli Tribune - Magazine Blogger Template

Mahasoli Tribune features a stacked style image slider, each image has a description and all images overlap to open out when clicked.The template has a magazine design with a two column right sidebar layout.

That's the list have you a favorite ?

Here on Spice Up Your Blog i have more great templates lists including My Favorite Gallery Templates, Magazine Templates and Some Strange Odd Templates.

My Blog

HOW TO DRAW NARUTO FACE

HOW TO DRAW SAKURA FACE

HOW TO DRAW SASUKE FACE

HOW TO DRAW KYUBI CUTE

Create Vertical Menu

Introduction to Family Governance

Corporate Governance Definition

Family Member Roles in the Governance of Their Business

Stages of Growth in a Family Business

Family Business Definition and Characteristics – Strengths and Weaknesses

Introduction: Family Business Governance

How to Increase the Width of Comment Form in Blogger

Add Two Sidebar Columns Below Posts in Blogger

Add Two Sidebar Columns below Main Sidebar in Blogger

To be Noted:

How to Make Footer Increase in Width in Blogger

To be Noted:

How to Make Blogger Header Expand the Width of the Browser

Advance Way to Increase Blogger Header's Width Across the Browser

To be Noted:

Add Three Columns in Footer to Blogger

To be Noted:

Download 3 Sidebar Columns Minima Blogger Template

Download Minima Template with Sidebar to Left

Download Blogger Minima Template with Sidebar to Right

How to Create Three Column Blogger Template

Adding the Third Sidebar Column in Blogger Template

Static Pages are Now Available in Blogger

How to add static pages to Blogger

Using Conditional Tags in Blogger

Type of Pages in Blogger and Conditional Tags For It

Item Page

Index Page

Archive Page

Static Page

For a Particular Page

Homepage only

Alternative Condition

Conclusion

How to Show HTML and JavaScript Codes within Blogger Posts

Create and Add your Own Contact Form to Blogger

Button Code

HTML Embed Contact Form

Adding Contact Form to Blogger

Hiding the Contact Me Page Appearing on Homepage of Blogger

Basic Settings for Blogspot

Best Blogger Tempelates

Free Blogger Templates With Fitted Featured Sliders

Namisan - Stunning Slider Blogger Template

Ocenolis Magazine - Advanced Blogger Template

Nyke - Magazine Blogger Template

Game Madness - Assassins Creed Blogger Template

MoonLight - Clean Magazine Blogger Template

Simplex Buzz - Full Background Slideshow

Oracle - Advanced Magazine Blogger Template

Extreme - Portfolio Magazine Blogger Template

Superb - Advanced Blogger Template

Modern Photography - Abstract Style Template

Calenotis - Photographers Magazine Blogger Template

Magulesco -Featured Magazine Blogger Template

Dimenzion - 3D Style Blogger Template

Glow - Free Premium Blogger Template

Mahasoli Tribune - Magazine Blogger Template

Add Your Comments And Questions Below.