Category: widget

Posted on

Zoho Creator :- Only intuition, no programming.

It has been a while since I posted anything here. I was waiting for something worthy enough that is usable and feasible. I must say, my wait did not go in vain. I came across Zoho Creator, and have been trying it out for the past 6 months before making my first post about it here. I proudly admit the fact that I have integrated Zoho into my actual working environment, which has taken the load of report maintenance off my shoulders. These days, I spend only 2 hrs a week to consolidate my report. I use the free version, but sure have the plan to switch to business version soon enough.

Zoho Creator is one of the many products in the Zoho Family. ( I shall be talking about each of them in upcoming posts). ZC allows you to create forms that can be embedded in website and blogs ( see below). The data collected via this form is stored within your Zoho-View section

The advantage of Zoho lies in the fact that

  1. There is no huge download or installation.. Because this is a WEB APPLICATION
  2. The Registration is free
  3. You need not have any programming knowledge
  4. The interface is exceptionally intuitive
  5. Drag – and – drop allows you to design custom forms
  6. Logical flow of events will guide you to do the scripting.
  7. Embed the form in your blog and collect data
  8. Various choices on how you wish to process the data collected ( HTML, Excel, JASON, AJAX, Pdf , ) for novices and advanced users alike.
  9. The feeds can be integrated into feed readers, HTML displayed wthin iframe,.. possibilities are immense.
  10. Applications can be shared with any number of users ( say you have created the application and want you friend to moderate the content… go ahead and share it)

Here is the catch :-

  1. Only 5 Applications allowed for free users
  2. Unlimited Application for premium users + Custom Logo integration.

What you see below is a Form that acts as my GuestBook. Feel Free to share your thoughts with me.

Application Name : – Personal ( This has abt 8 forms, one is shared with you here)
Form Name : – GuestBook.

All you have to do is, Enter the details and submit. Take a look at the HTML display of data collected using Zoho Form.

I shall tell you more about creating custom forms using Zoho in the coming days.


You can develop a simple form like Guest Book , which has minimum scripting ( auto date ), or , developing a complex form that allows you to generate and send email-verification code right from zoho form, which involves more complex scripting.

Bloggers have long loved interaction with their readers. After all, isn’t that why we enable comments? Here is something to take this level of interaction a step further. How about developing a custom application to cater to your needs?. Well, if you feel lack of programming knowledge, and the mind boggling software installation ( not to mention the price) is pinning you down, not anymore. Try Zoho Creator, I am sure you will eventually end up using it. So, how about hsaring what you have in mind… ? ?

Your appreciation is my motivation

From Deepa’s Template Tips

Posted on

Show your Pdf documents from inside your webpage

Those who are involved with lot of document exchange will probably agree with me that Pdf’s are great way to distribute your original document. With Pdfonline.com, the conversion of documents from the various formats {MS Word (DOC | RTF)–MS PowerPoint (PPT)—MS Publisher (PUB)–MS Excel (XLS)–HTML (MHT)–Text (TXT)–JPG , GIF,TIFF, BMP,PNG, EMF,WMF } to pdf is just a click away.

However, it has been in the wish list of many bloggers and e-publications , over some procedure to display the contents of the pdf documents by embedding them directly in a web page. Until now, the pdfs would be uploaded to some common file sharing network , and the link to the pdf would be specified in the web page. The person whoever wishes to read, has to download the pdf to his system.

Not anymore… now you can show the contents of the pdf right inside your blog / webpage. Surprised.. below you will see a pdf document that I have created as a test document and its content displayed for all of you to see ( without downloading). Use the slider near the ZOOM tool to get a closer look and the HAND tool to drag the page



This is now possible with the help of services from http://www.scribd.com.Not only with pdfs, Scribd allows us to upload and publish documents in other formats also (check out their FAQ)

You can also customize the document for private – public viewing, Allow – disallow printing, Allow-disallow comments, and even more.. Just explore and you get to know better. I personally find this extremly useful for pdf’s ( for other formats depending on the file size, the conversion might take a little longer).. so.. Liked this… Its simple and easy.. just follow the instructions closely

  1. Register with http://www.scribd.com

  2. Look for a link that says UPLOAD

  3. You may upload a document from your Hard Drive (or) specify the URL of the document

  4. Once upload is completed, it will start converting , so that your document is embedded in a flash player ( which is used in the webpage)

  5. Depending on the number of previous documents in queue, this might take some time

  6. Once the conversion is completed, you just have to click on the file to see it on Scribd

  7. On the LeftHand side of the document page ( in scribd), you will see various options to share the file

  8. There is also an Embed Option ( You may not see this immediately after the file upload.. I had to wait for abt 12 hrs to see the embed code… so just upload the files one day ahead of schedule, to be on the safer side)

  9. You may copy paste the Embed code to your blog to show the pdf

  10. The Advanced option allows you to change the height and width of the display area.. so that you may modify it suit the appearance of your blog / website

  11. Thats it… you have the embed code.. now all you need to do is Copy paste the code at the appropriate position in your blog for your friends to see

So you see… displaying the contents of a Pdf file in a webpage is not impossible after all… it just took us a little longer to know about Scribd. I prefer to use this exclusively for Pdfs .. perhaps, you may find other attributes of Scribd more interesting. Dont hesitate to share your thoughts with the rest of us. If you find this post has been helpful in some manner, do drop in a word at the comments page
Your appreciation is my motivation

From Deepa’s Template Tips

Posted on

Customizing Search Widget

Blogger has introduced its Search Widget so that we can search for terms that are not included in Labels but could be present in the posts. Just like any other widget, you may drag and drop this at any position at the Template – page elements section. Here I shall giving you some self-help instructions so that you can customize the appearance of the widget and the result to suit your blog’s color schema. Before I get into the widget-code and details of style sheet… let see which part related to which section of the code. Its possible to customize everything that appears here… however… I am going to emphasis mainly on the Tabs & Results pane

  1. THE SEARCH FORM

Once you add a search widget to the blog form the page elemets.. and see the HTML of the widget you will notice that
<div class=’widget-content’ style=’width:95%’>
<div expr:id=’data:widget.instanceId + “_form”‘>
<span class=’cse-status’><data:loadingMsg/></span>
</div>

<div class=’widget-content’ style=’width:95%’> Width =95 % determines that the search box occupied the 95% space of the area where you are placing this widget. Lets say you are keeping this widget in the sidebar .. then the search box & the search button together will occupy the 95% of the sidebar. Play around with this number .. you will see the search box decrease and increase in length accordingly

<div expr:id=’data:widget.instanceId + “_form”‘> Here you will notice “form” which means that the search box and the search button are put togather in a form when this widget was created… and the developer has deiced to make them appear in the same line. So If you feel like putting the search button below the search box.. then I am afraid.. it doesn’t seem to be possible now. However.. we can always play with the width and decide on the optimum width that suits your blog

<data:loadingMsg/>This is something that shows the “LOADING…..” message when the page is being downloaded in the browser… you can delete this tag and add you own custom message as …” Wait..” or something else

  1. TABS ( OPTIONS YOU CHOOSE WHILE CONFIGURING THIS WIDGET)

If you remember… while configuring the search widget in the Page Elements Section.. you have the options to allow search to be performed amongst the posts / texts in Your Blog – Links that you have given in your blog – The Entire Web. Now the results for these options appear as Tabs ( see pic). Blogger has provided us with the default style sheets for the search widget so that we can modify the appearance of the Tabs & Results ( after all this is what the reader sees after hitting the search button)

The Edit-HTML of your template ( Check the Expand widgets box) will have the following. You can give the color codes of your choice and see the difference it makes in the appearance of the tabs

For ..ACTIVE Title -TAB For…INACTIVE Title-TABS

#uds-searchControl .gsc-tabhActive
{
border-color:<data:borderColor/>;
border-top-color:<data:activeBorderColor/>;
background-color:transparent;
color:<data:textColor/>;
}
#uds-searchControl .gsc-tabhInactive
{
border-color:<data:borderColor/>;
background-color:transparent;
color:<data:linkColor/>;
}

  1. DISPLAY RESULTS

The Results pane is always displayed above all of your blog posts. You will see the following in your template which is responsible for the appearance of the Results in your blog . You may see that I have changed the background color to the value of the pale turquoise color

#uds-searchControl .gsc-results
{
border-color:#cccccc;
background-color:#D7FDFC;
color:black;
}
With a little customization.. the dull looking ( but very effective) search box can be given a total makeover so that it begins to look like a part of your blog.If this post has been helpful you… pass the word and dont forget to link back
Your appreciation is my motivation

From Deepa’s Template Tips

Posted on

Custom SearchBox – Blogger.Draft feature

This is a dream come true for all the bloggers who are apprehensive to incorporate the “Google Custom Search Box” in their blog.. Where search can be performed exclusively for your blog… Confused.. try searching for something in the Searchbox you see above. Watch how the results are displayed in Tabs..

  1. Results from This Blog

  2. Results from the Links used here

  3. Results from The Web

The Best part is.. the results are displayed separately for easier identification
This is the SearchBox widget being introduced by Blogger_Draft dont worry too much.. Blogger Draft is where blogger introduces its new features for us to try out and give our opinion… following which the widget will be introduced at the regular blogger dashboard

Inorder to be able to use the widgets introduced in draft.. you just need to type draft.blogger.com in your browser..Lo!.. you have your dashboard.. looks the same eh !..
Now go to TEMPLATE – PAGE ELEMENTS- ADD PAGE ELEMENTS… you must be able to see the SEARCH BOX as new widget amongst all other regular widgets

Just add the widget and give your choice towards searching.. you can restrict the search towards your blog only… or allow results from all over the web .. right inside your blog

You may move the SearchBox like any other widget… and the results are always displayed at the area just above your blog posts… so that the reader can see them at “eye-level”.. without having to scroll to the end of the page or so

Personally I would prefer to use this than the GoogleCustomSearchBox.. reason being.. i find the customization – incorporation – display of results to be very clumsy ( at least for me)…which is why I never had a search box in my blog all these days. Just try it out.. if you dont like it.. you can always remove the widget… what do you say ? ? ? ?
Your appreciation is my motivation

From Deepa’s Template Tips

Posted on

Show thumbnail Image preview of your Photoblog posts…using Blidgets

Photoblogs are a popular way of expression amongst bloggers. There are numerous photo hosting sites such as photoblog.com , Animus3.com , Flickr.com,slide.com.. etc etc.. the list is endless. But there are some Bloggers out here.. who have already established themselves among their blogzone. They would rather host their Photoblog in the same platform ( blogspot / wordpress ..etc etc)..due to established readership. Moving to a mew platform like flicker,photoblog et etc would mean.. they will have to network from square one.

Its a good idea to display your photoblog pics ( as an thumbnail image preview.) in your main blog.. so that the readers will know about your new Photoblog and can also see a preview of the images whenever you make an update.

You may see one such preview in my Left-side-bar. This Showing-Image-Preview for Photoblog was developed using the Blidget option of Widgetbox.com. Just follow the instructions if you wish to have such a widget for your photoblog too.

PHASE 1:- MAKE YOUR OWN BLIDGET

  1. Register yourself with Widgetbox.com

  2. Choose “Make a Blidget” ( meaning… convert your blog into a widget)

  3. Give the URL of your photoblog — continue

  4. Choose the “Layout” as Narrow (for sidebars) or Wide (to show below the header.. or above all posts)

  5. Choose the “Display” as Headlines only & ShowFirst image in each post ( oh Yeah… afterall this is a Photblog)

  6. Its Ideal to choose “Header Style” as Title only (for photoblogs)

  7. Just allow Listing in the Gallery and give a Description of your blog .. dont forget to add tags.. its really useful

  8. Then Publish the blidget at Widgetbox.com

PHASE 2:- ADDING THE BLIDGET TO YOUR BLOG

  1. They give  you a variety of options as to where you want to use the blidget you have just created.Just move the mouse over the image and see which one is for what

    2. TypePad   Blogger   MySpace   Facebook   Netvibes   Pageflakes   Google   Blogger PostFreewebs   Piczo   Widget Code

  2. You may direclty add your blidget using these options,,..
  3. Or you may use the "getcode option" to get the Javascript code and then add it manually to your blog through template – page elements – new elements
  4. Voila.. Now every one who comes to your active blog can see that You have a Photoblog and Such awesome pictures are sure to inspire them to visit your Photoblog to leave a comment

What do you say… Liked it.. C’mon.. go ahead and configure your blidget

AN APPEAL TO MY READERS

Widgetbox allows the display of english characters only.The boxes you see in my photoblog widget are Tamil (Unicode) characters. I have tried makig blidgets with blogs in other languages as well.. all come out as boxes. I have also written at the widgetbox forums ..Forum for using widgets and Forum for New features.. to allow the display Unicode characters also.

I hereby appeal to all my readers to kindly support this feature in blidget so that many Regional language Bloggers can also make use of this wonderful feature.Kindly register yourlseves with the WidgetboxForum and Give your support by replying to any one of the thread (To display Unicode Characters) Thread at Forum for Using Widgets or Thread at Forum for New Features.

This will hardly take a minute or two. Please voice your opinion on this at the forum. Your reply might get us one step closer towards the process of implimenting this feature

Thank you

Your appreciation is my motivationKindly link back to this post..of you are impressed by the information provided

From Deepa’s Template Tips

Privacy Policy - Terms and Conditions