Embedding a Zoho Creator Application in your Blog
December 7, 2007Howdy doody folks…it’s me again. Your friendly (non)contributing author, Alan Bradford. After the invitation from Pete last August, things have been pretty hectic around my place. You see, in August I also got a call from the ASU Technology Office in response to a blog post I had written about going back to school full time. Long story short, I am now officially getting paid to blog for ASU. Which is actually exactly why I have something to say here at LoZC.
One of the great features of Zoho Creator is the ability to easily embed an application (view or form) on a website or blog. I recently updated the contact page on my blog for ASU, so I wanted to show everyone here how easy it was. Once you have your application created, the fun begins. In my case, the application is a simple contact database. I will use this as the example in all the screenshots. So before I get started with fancy thumbnail images and steps, I’m assuming you have already learned how to create an application. For those of you who don’t know how yet, I’ll wait a few seconds for you to create a Zoho account and make your first application. (Seriously folks, it’s so easy.)
Okay. Ready? Let’s learn… (click the images for a bigger view)
Step 1: With your application open in edit mode, click on the big yellow button to access the application.

Step 2: At the top of your form (or view), there is a “more actions” button. Hover over it and then select the “embed in your website” button.

Step 3: A popup window will display. In this window is a field with a bunch of code. If you like the way the form looks, simply copy the code and paste it into a page on your blog or website.

Step 3a: You can also customize the look and contents of the form if you like. Click the “customize items” tab to change things such as the submit/reset button labels, set a URL for the page to point to after a user clicks submit, customize the message that displays after a form is submitted.

Step 3b: Crazy about customization? Don’t stop now! Click the “customize look” tab to change the color of the form border and heading. This is perfect for making the form blend into the existing look of your website or blog.

Step 4: After you’ve customized your form to your heart’s content, copy the code and paste it into a page on your website or blog that accepts HTML. In my case, I pasted the form of my application on my Contact page in Wordpress.

Sorry if you were expecting something more complicated, because we’re all done. Feel free to check out my finished product over at Geek Stew.
A couple of considerations when you’re building your application with the intent to place it on a website.
- You will probably want to know when a new record is added.
- Your customers/visitors will probably want to know that their information was received after they clicked “submit.”
Creator makes this easy by allowing you to set email notifications in forms. You can set your application to automatically email you letting you know there is a new record. You can also set an automatic email to be sent to the person filling out the form, provided an email address was one of the required fields on your form. From the edit interface, there is a familiar button at the top of your form that says “more actions.” Hover over it and select the “set email notification” button. I’ll give you a thumbnail to whet your appetite:

Stay tuned for a step-by-step tutorial on how to use the email notification features. It may have to wait a while though, because I need to study for finals…



