Amazon

Sunday 2 October 2011

Free Tamil Typing Widget For Your Blogger

1. Copy your Widget code

Let's start with the basics. You use the FeedSweep editors to produce embedding code for your widget. Your widget embedding code will look something like:
<title>Tamil Writer</title>
<script src="http://rpost.googlecode.com/files/nila.js">
</script>
<script language="JavaScript">
<!-- Begin
function toForm() {
document.ezilnila.box1.focus();
// Replace field1 in the script with the field name of which you want to place the focus.
}
// End -->

</script>
<script language="JavaScript">
<!-- Begin
function copyit(theField) {
var tempval=eval("document."+theField)
tempval.focus()
tempval.select()
therange=tempval.createTextRange()
therange.execCommand("Copy")
}
// End -->


</script>


<link href="stylesheet/unicodewriter_stylesheet.css" rel="stylesheet" 
type="text/css"></link>

<div id="wrapper">
<div>
<div id="content">
<form name="ezilnila">
<div>
<textarea class="style1" cols="50" name="box1" onclick="startText();"
 onkeyup="startText();" onselect="startText();" rows="1" style="height: 112px;
 margin: 2px; width: 400px;"></textarea></div>
<div class="correction">
<input class="style2" onclick="toForm();" type="reset" value="திருத்தியமைக்க" /></div>


<div>

<textarea class="style1" cols="60" 
name="box2" rows="1" style="height: 119px; margin-bottom: 2px; margin-top: 2px;">
மேலேயுள்ள பெட்டியில் ஆங்கிலத்தில் (Anjal Style) தட்டச்சு செய்ய இங்கே யுனிகோடில் 
தமிழ் தெரியும்.&lt;br /&gt; உதாரணம்:  ammaa = அம்மா;    thamiz = தமிழ்</textarea></div>
<div class="copy">
<input class="style2" onclick="copyit('ezilnila.box2')" 
type="button" value="பிரதியெடுக்க" />

</div>

</form>
</div>
</div>
</div>

The purpose of this code is to talk to the FeedSweep servers and obtain the widget you have created, complete with fresh content, and inject it exactly where you inserted the code in your web page or blog template.
To obtain your Widget code, click on the "Get Code" button at the bottom of any of the FeedSweep editors and note the produced FeedSweep Widget Embedded Code. This is what you will copy and paste into your site's HTML source code or blog template.
Embedded Code Box
To copy your code, highlight the contents of the FeedSweep Widget Embedded Code box by clicking anywhere in this box with your mouse. You will see the entire contents are selected and highlighted automatically.
Next, from your browser's Edit menu, choose Copy in order to copy the highlighted area. If you prefer not to paste your code directly into your web page's HTML source code or blog template at this time, you can paste it into an alternate application such as Notepad for temporary storage.
If you make changes to your widget, you will have to update your web page or blog template with the new widget code.

2. Paste your Widget code into the Blogger template

Now you must log into your Blogger account using the credentials you would normally use. Do this in a separate browser window if possible. Your objective is to alter the template ‘code’ on your page where you wish to have your FeedSweep widget appear. To do this, follow these instructions:
a) Log in to your Blogger account at www.blogger.com.
b) Click on View Blog:
c) Click on Customise in the upper right-hand side of the page:

 
 d) Select the main tab labelled Layout and also the sub-tab labelled Page Elements:
e) In the sidebar region (on the right or left side) you should see a link called Add a Gadget (it used to be called Add a Page Element) and click on that link:
f) A page will pop up entitled Add a Gadget, showing a large selection of different types of elements. On the left, select Basics and in the list that is shown, locate HTML/JavaScript – Add third-party functionality or other code to your blog and click on the button to the right side of that labelled +.
 

g) Another popup page will appear: Paste the code you had previously copied in step 1 above into the box labelled Content. You can optionally fill in the Title box.

g) Click on Save at the bottom of the box. You will be returned to the Page Elements page where you can either select Preview or View Blog to see your changes.
h) When you are satisfied with what you have seen click on the large Save button near the top of the Add and Arrange Page Elements section.
That's all there is to it!