Home » , , » Design a Professional Looking "About Us" Page

Design a Professional Looking "About Us" Page

    

3.  Now you need to add some rows/paragraphs where you can talk about your services, goals etc. I would advise that you create at most two-three rows and keep them short in length. Use passive voice and avoid using "I am this and that" rather use a tone that may sound as if someone else is describing the author.  Once you have written down the paragraphs then start enclosing each paragraph one by one between this code,

<div style="border: #686868 5px solid; padding: 10px; -moz-border-radius: 15px; -webkit-border-radius: 15px">
  <div style="text-align: justify"><img style="display: inline; float: right" align="right" src="ADD IMAGE LINK HERE" width="128" height="128" /></div>

  <div style="text-align: justify"><font color="#666666">

ADD PARAGRAPH TEXT HERE

</font></div>
</div>

<div style="text-align: justify">&#160;</div>

 

 

Do it for each paragraph. For example if you have written three paragraphs then enclose them in the codes like this,

<div style="border: #686868 5px solid; padding: 10px; -moz-border-radius: 15px; -webkit-border-radius: 15px">
  <div style="text-align: justify"><img style="display: inline; float: right" align="right" src="ADD IMAGE LINK HERE" width="128" height="128" /></div>

  <div style="text-align: justify"><font color="#666666">

ADD PARAGRAPH-1 TEXT HERE

</font></div>
</div>

<div style="text-align: justify">&#160;</div>

 

<div style="border: #686868 5px solid; padding: 10px; -moz-border-radius: 15px; -webkit-border-radius: 15px">
  <div style="text-align: justify"><img style="display: inline; float: right" align="right" src="ADD IMAGE LINK HERE" width="128" height="128" /></div>

  <div style="text-align: justify"><font color="#666666">

ADD PARAGRAPH-2 TEXT HERE

</font></div>
</div>

<div style="text-align: justify">&#160;</div>

 

<div style="border: #686868 5px solid; padding: 10px; -moz-border-radius: 15px; -webkit-border-radius: 15px">
  <div style="text-align: justify"><img style="display: inline; float: right" align="right" src="ADD IMAGE LINK HERE" width="128" height="128" /></div>

  <div style="text-align: justify"><font color="#666666">

ADD PARAGRAPH-3 TEXT HERE

</font></div>
</div>

<div style="text-align: justify">&#160;</div>

 

Make these changes:

  • To change the border color of the paragraph edit #686868  with your preferred color choice. Use our [a href="http://www.mybloggertricks.com/2008/01/color-code-generator-and-color-wheel.html" target="_blank"]color generator tool[/a].
  • Replace ADD IMAGE LINK HERE with the URL of your image. Try to you use a small image 128px by 128px in size.
  • To adjust the image size edit width="128" and height="128"

    4.    Finally save your page and publish it. Visit your About Us page to see it in action! :>

 

Hide Widgets

Now we need to hide all widgets that appear below post titles and at the bottom of posts. These widgets are normally the social bookmarking icons, AdSense code and related post widget which appears on all your posts. To hide them kindly follow these steps,

  1. Go To Blogger > Design > Edit HTML
  2. Backup your template
  3. Check the "Expand Widget Templates" box
  4. Search for ,

<data:post.body/>

and just above it enclose all your widget codes between the code below,

<b:if cond='data:blog.url != "ADD YOUR ABOUT US PAGE URL HERE"'>

WIDGET CODES

</b:if>

 

Add all your widget codes between these two bolded lines. Replace ADD YOUR ABOUT US PAGE URL HERE with your About Us page link.

    5. Do the same for all the widget codes below <data:post.body>

    6. Finally save your template and visit your blog to see the page loading in seconds with a neat and clean look.

 

Need Help?

If you needed any help just feel free to post your queries. I will reply the earliest possible. I just hope you succeed in creating an attention seeking About Us page that may let your blog stand out! Have fun. :>

Source: http://www.mybloggertricks.com/2011/06/design-professional-looking-us-page.html

0 comments :

Post a Comment

 
Play : Agame | Y8 Games | Y3 Games
Copyright © 2011. Blogger Tips And Tricks 2012 - All Rights Reserved

Proudly powered by Blogger