Advanced Search

hCard with vcard download link via X2V

/ Published in: HTML
Save to your folder(s)
Use of the vCard(hCard) microformat, used to mark up contact details of
people, companies, organisations and places. Includes an download link via X2Vs hcard to vcard-service. Can be styled as a 2-column hcard via CSS (see CSS snippet)

inspired by the hcard implementation by Jon Tangerin (http://jontangerine.com/about/)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. #
  2. <!--
  3. Use of the vCard(hCard) microformat, used to mark up contact details of
  4. people, companies, organisations and places. Includes an download link via X2Vs
  5. hcard to vcard-service. Can be styled as a 2-column hcard via CSS)
  6. -->
  7.  
  8. <div class="vcard">
  9.  	<div class="fn">John Smith</div> <!-- FN = Full Structured Name -->
  10. 		    <ul class="communication">
  11. 		        <li class="tel">
  12. 		           <span class="type">Home/Phone</span>
  13. 		           <span class="numbers"> +44 (1234) 56789</span><!-- class "numbers" is for CSS Styling -->
  14. 		        </li>
  15.  		        <li class="email">
  16. 		           <span><a href="mailto:[email protected]" title="Write me an email!">email</a></span><!-- obfuscate email with http://www.zapyon.de/spam-me-not/ -->
  17. 		        </li>
  18. 		        <li class="url">http://thisisfake.com</li>
  19. 		    </ul><!--/end communication -->
  20. 		    <ul class="adr">
  21. 			<li class="street-address">Fake Street<span class="numbers"> 123 Fake Street</span></li><!-- class "numbers" is for CSS Styling -->
  22. 			<li class="postal-code">D-<span class="numbers">12345</span><span class="locality"> locality</span></li>
  23. 			<li class="country-name">Country</li>
  24. 		    </ul>
  25. 	</div><!--/vcard-->
  26. 	<div id="vcard-download"><a href="http://suda.co.uk/projects/microformats/hcard/get-contact.php?uri=http://yourcontactpage.com" title="Add my contact-details to your adressbook">Download my contact-details as a vCard (via X2V)</a>
  27. </div>

URL: http://suda.co.uk/projects/microformats/hcard/

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.