Visiting card Blogger template

1. Create a New blog for your visiting card
2. Create two posts, one for your "About" page and the other for your "Contact" page. In the "Contact" just put a word, what ever, it'll not appaer when you'll install the visiting card blogger template.

3. Show your blog in the browser and copy the link location of the two posts.

4. After that, go to edit the posts and delete titles then publish again.

5. Template installation

Extract Blogger Template - visitingcard.zip
After login, goto Layout > Edit HTML > Browse > choose Blogger Template - visiting-card-blogger-template.xml > Upload > Save Template

6. Posts pages

After login, goto Layout > Edit HTML > and check "expand widget"

Find this line :

<b:if cond='data:blog.url == &quot;http://yourblog.blogpost.com/about.html&quot;'>

Put your about page link instead of http://yourblog.blogpost.com/about.html

Find this line :

<b:if cond='data:blog.url == &quot;http://yourblog.blogpost.com/contact.html&quot;'>

Put your contact page link instead of http://yourblog.blogpost.com/contact.html

Save your template.


7. Menu links

Find these code :

<li><a href='http://yourblog.blogpost.com/about.html'>About</a></li>
<li><a href='http://yourblog.blogpost.com/contact.html'>Contact</a></li>

Replace the two links with yours (those you have copy in the step 3)

8. Picture or avatar

 <img alt='VisitingCardBlogger' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiAWmifDi2HuaUFodT8XrUAlvf0J3soEMobvtef0IL-oaakwUszY2IrPtZrCZ2i7wboAIOYjd45bk_egsCOacqhch0sb9diRVgxBGAZdMEzjPwDuqWoxvwHlB5zUKzPpBMzjnGznXH3C0n/s1600/person.png'/>
       
Put your Picture or avatar link to replace https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiAWmifDi2HuaUFodT8XrUAlvf0J3soEMobvtef0IL-oaakwUszY2IrPtZrCZ2i7wboAIOYjd45bk_egsCOacqhch0sb9diRVgxBGAZdMEzjPwDuqWoxvwHlB5zUKzPpBMzjnGznXH3C0n/s1600/person.png

Your picture must have 59px with and 60px height.

9. Title and description

Find these codes :

<h1>My visiting card</h1>
<p>A short description of your person</p>

10. Networks links

Find these codes and add your links between '' after href=

<li><a href=''><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFrzWet11a5ZWd5N0KXv3UgJ222R08zxIFY73qJJ_uv57g5JLt_XSvV_ViaSZxpOBT3BGYxATLzITOpfrhAlH3fi8LWKDU61QyjnrIgYTnX62_lIGzSaNaStZGfDadqWNaIdlEN_Rse1zO/s1600/i_twitter.png'/> <strong>Twitter</strong>twitter.com</a></li>
           
            <li><a href=' '><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjX7IxiaIlZ0ZGdyJW9eaTdfB4kQTvehOhpJr7MudcJmPcaZTxnVlcJMweTgFL6QyDzpZ1203jM8_1O2sqk2bLKiO8UWFdtjX38kSTsWefYjcaviV0izboCPq5xFrnjxY87UBvSbpQuOMHZ/s1600/i_facebook.png'/><strong>Face Book</strong>facebook.com</a></li>
           
            <li><a href=''><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjEsVv3ZIbUNnKLp9Aossf3bijULvXQMENxrvyEwBivl7BOjXojIDVjIEVOuaLsUdtvQeVgrQKFhS_izxEFk73OOVizUypbJ9lsVkGRYf-poyaZPr7yeKAORGmJZlNpdxEcWNX8TixkMTV9/s1600/i_stumbleupon.png'/> <strong>Stumbleupon</strong>stumbleupon</a></li>
           
            <li><a href=' '><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQLBSWE7Unini1W64CEcrvtTuqqX9BCvH85MPctcofeyC3CRgTCU1ugY8SmWP4XNRgOfq0Im3N9npLgi-hv2PbMQQ-GpYmd05YOuDBH-dz9cBSLbNKkJFVulEsKTl0D8ZZ2sksL_tWmQJ2/s1600/i_delicious.png'/> <strong>Delicious</strong>delicious.com</a></li>
           <li><a href=''><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIYqb9lT1YHbSHkkxzi8MDchhIMKDMAVBP_F18h9Vgtwj4q_9NrzCMsMdZijO8rN06Kfm6oz37Wje50oQWvJZSMl8yHascNYhsIZEheC5AELRqy_ILWPNhe2t3Rq4zhFVT2q-LaS32r_Lx/s1600/i_digg.png'/> <strong>Digg</strong>digg.com</a></li>
        
            <li><a href=''><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggnl-8GHB3NlDq3yqcnMvlJ9yrzROBjLJG0PRZ6nxX2pyqCPYJw5SXQMOPj7RwbJOEtU7rkgp0IOHx34daGlIkRQfooCV_iDiFNkoueNkvVB2c3sh6TV3Amdyl8zS0eNsWrZZvR3VytaE0/s1600/i_flickr.png'/> <strong>Flickr</strong>flickr.com</a></li>
            <li><a href=''><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj9KvmJ6zPxn7IDe_llJulhLieueRMK-o1q3mjZ5E8HtJuLZykdUwPi1QCeJiPqDW19NnwaMziC6P6LUnyPzXxifcUGdE45OwMECnlbR6GlhktJ19wV1cYIbOgN30wk7_Bxhkb5HAarPrG8/s1600/i_lastfm.png'/> <strong>Last.fm</strong>last.fm</a></li>
         
            <li><a href=''><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitj2Ey4w2ro0XF7YB52inHKN3utlgNrmt5yRYtgQXJaydYb176pSf4cldmv0URmmW04MgSXPBcV3iNVOuJfVd3gvER52rQTlM_XAPHnJqm6jwtAnKvzUYTtHF_5NCvl2WjqP2pt5SFuz2s/s1600/i_myspace.png'/><strong>My Space</strong>myspace.com</a></li>
           
            <li><a href=''><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPXu-lA7opgpiPIQagMpkE6izcSm2_zf3XGduTC8kPaGvsunKNayZXC2OSt4TRZ66GIROSQ6aTuESiBGrBo5ZDpJiE1PoI90jdj_r8yfnqgo0l1SNHzi1iX7yNUWDr4zi9k7DwiCiumsNr/s1600/i_reddit.png'/> <strong>Reddit</strong>reddit.com</a></li>

To add a new network link, just put this code after those one and fill it with correct informations.

            <li><a href='Your profil link in the social site'><img src='http://network-image-link.com/network.png'/> <strong>Social site name</strong>Socialsitelink.com</a></li>

Your network picture must be 30x30px.


11. Contact content

Find these codes and put your informations

<div class='row'><span class='field_l i_company'>Company:</span><span class='field_r'>Your Company Name</span></div>
        
          <div class='row'><span class='field_l i_location'>Location:</span><span class='field_r'>You Location (Town, Country)</span></div>
        
          <div class='row'><span class='field_l i_web'>Website:</span><span class='field_r'><a href='http://yourblogurl.blogspot.com'>Blog or website name</span></div>
        
          <div class='row'><span class='field_l i_mail'>E-Mail:</span><span class='field_r'>youremail@host.com</span></div>
         
          <div class='row'><span class='field_l i_mail'>IM :</span><span class='field_r'>YourIM</span></div>
       
          <div class='row'><span class='field_l i_mail'>Skype:</span><span class='field_r'>yourskype</span></div>

Save your template and Enjoy!
         

Categorie(s): Blogger template, hot, Personal page