Underground Web Designs Blog

Recently I created two plugins for Tiny MCE, the WYSIWYG editor that MODx uses that allow you to easily add contact information and event information to your posts and webpages, using the hCard and hCalendar microformats. Unfortunately, installing these plugins on MODx is not quite as streight forward as it might be, so here are some step by step instructions:

1. Download the TinyMCE hCard and hCalendar plugins from UndergroundWebDesigns.com. Once the files are downloaded, unzip them. Inside the unzipped folder you will find a folder with the name of the plugin, and a readme file.
2. Download the TinyMCE 3 plugin for MODx and install it following the directions on it’s site. This is fairly easy, you just upload the files and run an install program.
3. Once TinyMCE 3 is installed on your MODx site, open your favorite FTP program, and upload the hCalendar and hCard folders you downloaded and unzipped in step 1 into http://www.yoursite.com/assets/plugins/tinymce309/jscripts/tiny_mce/plugins/
4. Log in to your MODx Admin area, and click on “tools - > configuration”.
5. In the configuration screen, click the “Interface and Features” tab, and scroll down to the bottom where the TinyMCE settings are.
6. Make sure the TinyMCE Theme is set to “Custom”
7. In the “Custom Plugins” box, move to the end of the list of plugins and add “hcard” and “hcalendar” (no quotes), to the list, separated by commas.
8. Add “hcard” and “hcalendar” (no quotes) to one of the “Custom Buttons” boxes, again separated by commas.
9. Save your changes.
10. Open a page to edit. You should see two new buttons in the Document Content edit window… one to insert hCard data, the other to insert hCalendar data.

Everybody wants better to make their website stand out on Google right? Well what if you could get a link to a map of where your business is located — in Google’s own search results? Think it can’t be done? Check out this live search results page.

Microformats are a way of adding extra data to the HTML on a web page so that both computers and humans can understand what the information means. This could be information about an upcoming event (date, time, location), or a person or business (name, address, email address, etc). In this case, Google is using contact information marked up using the hCard microformat to display an extra link in it’s search results that displays a map of the business’s headquarters.

Now, adding an extra link to the search results is cool, but it’s nothing compared to what can and will be done as microformats become more popular. Because they allow computers to understand the data on your website better, microformats can lead to smarter search engines, better organization of data, and less manual input of information.

The future of the internet revolves around programs doing their own research and sharing information with each-other, and one of the key technologies will be the use of microformats on the web. Best of all, using microformats has never been easier. If you use Wordpress, check out my recently released Micro Anywhere plugin for Wordpress. Install the plugin and you can be adding event and contact information to your pages and posts within minutes.

The internet has done great things by providing access to nearly unlimited information. The next stage of internet evolution will enable software to understand and process this information for us, so that we only see what we want to see, when we want to see it. Will your site be one of the first to make use of this exciting technology on a massive scale?