On-Screen Keyboard
Urdu Keyboard
1. Urdu: Koha > Administration > System Preferences > OpacCustomSearch
Paste the following code here:
<script type="text/javascript">
function WriteLetter(Letter) {
textfield = document.getElementById("translControl1");
textfield.value = textfield.value + Letter;
}
function DisplayUrduKeyboardFunction () {
x = document.getElementById("UrduKeyboard");
if (x.style.display == "none") {
x.style.display = "block";
}
else if (x.style.display == "block") {
x.style.display = "none";
}
}
</script>
<style type="text/css">
#divUrduKeyboardcontainer {
}
#DisplayUrduKeyboard {
color: white;
cursor: pointer;
margin-left:2px;
}
#UrduKeyboard {
height: 130px;
}
#FirstLine, #SecondLine, #ThirdLine, #FourthLine {
text-align: center;
height: 30px;
}
.UrduKey {
font-size: 16px;
font-weight: bold;
color: #ffffff;
background: #3498db;
background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
background-image: -moz-linear-gradient(top, #3498db, #2980b9);
background-image: -ms-linear-gradient(top, #3498db, #2980b9);
background-image: -o-linear-gradient(top, #3498db, #2980b9);
background-image: linear-gradient(to bottom, #3498db, #2980b9);
-webkit-border-radius: 2;
-moz-border-radius: 2;
border-radius: 2px;
width: 20px;
height: 20px;
cursor:pointer;
display: inline-block;
text-align: center;
margin-top: 10px;
padding: 2px;
}
.UrduKey:hover {
background: white;
color: black;
}
.UrduKey:active {
background: white;
color: gray;
position:relative;
top:2px;
}
.UrduKeySpace {
font-size: 20px;
color: white;
background: #3498db;
background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
background-image: -moz-linear-gradient(top, #3498db, #2980b9);
background-image: -ms-linear-gradient(top, #3498db, #2980b9);
background-image: -o-linear-gradient(top, #3498db, #2980b9);
background-image: linear-gradient(to bottom, #3498db, #2980b9);
border:0px solid #4a3a00;
border-radius: 2px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
width: 200px;
height: 20px;
cursor:pointer;
display: inline-block;
text-align: center;
margin-top: 10px;
}
.UrduKeySpace:hover {
background: white;
color: black;
}
.UrduKeySpace:active {
background: white;
color: yellow;
position:relative;
top:2px;
}
#translControl1 {
}
/* End of CSS for Koha CoverFlow Plugin */
.mastheadsearch {
color:#FFF;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
padding: .8em;
margin: .5em 0;
background: #c7c7c1;
background: -moz-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(38%, #c7c7c1), color-stop(100%, #a7a7a2));
background: -webkit-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: -o-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: -ms-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: linear-gradient(to bottom, #0B0B23, rgb(70, 71, 113) 100%);
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#c7c7c1', endColorstr='#a7a7a2', GradientType=0);
}
</style>
<form name="searchform" method="get" action="/cgi-bin/koha/opac-search.pl" id="searchform" class="form-inline">
<label for="masthead_search">
Search
</label>
<select name="idx" id="masthead_search">
<option value="">Library catalog</option>
<option value="ti">Title</option>
<option value="au">Author</option>
<option value="su">Subject</option>
<option value="nb">ISBN</option>
<option value="se">Series</option>
<option value="bc">Accession No.</option>
<option value="callnum">Call number</option>
</select>
<input type="text" title="Type search term" class="transl1" id="translControl1" name="q"><span id="translControl"></span>
<div class="input-append">
<button type="submit" id="searchsubmit" class="btn btn-primary">Go</button>
<span id="DisplayUrduKeyboard" onclick="DisplayUrduKeyboardFunction();" class="btn btn-primary">اردو</span>
</div>
</form>
<div id="divUrduKeyboardcontainer">
<center>
<!-- <span id="DisplayUrduKeyboard" onclick="DisplayUrduKeyboardFunction();">اردو</span> -->
<div id="UrduKeyboard" style="display: none;">
<div id="FirstLine">
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ذ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ڈ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">د</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">خ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ح</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">چ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ج</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ث</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ٹ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ت</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">پ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ب</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">آ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">أ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ا</div>
<div class="UrduKey" onclick="WriteLetter2(this.innerHTML);">ّ</div>
</div>
<div id="SecondLine">
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ق</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ف</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">غ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ع</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ظ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ط</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ض</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ص</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ش</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">س</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ژ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ز</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ڑ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ر</div>
</div>
<div id="ThirdLine">
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ے</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ي</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ى</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ء</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ھ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ه</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ؤ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">و</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ن</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">م</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ل</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">گ</div>
<div class="UrduKey" onclick="WriteLetter(this.innerHTML);">ک</div>
</div>
<div id="FourthLine">
<div class="UrduKeySpace" onclick="WriteLetter(this.innerHTML);"> </div>
</div>
</div>
</center>
</div>
Sindhi Keyboard
2. Sindhi: Koha > Administration > System Preferences > OpacCustomSearch
<script type="text/javascript">
function WriteLetter(Letter) {
textfield = document.getElementById("translControl1");
textfield.value = textfield.value + Letter;
}
function DisplaySindhiKeyboardFunction () {
x = document.getElementById("SindhiKeyboard");
if (x.style.display == "none") {
x.style.display = "block";
}
else if (x.style.display == "block") {
x.style.display = "none";
}
}
</script>
<style type="text/css">
#divSindhiKeyboardcontainer {
}
#DisplaySindhiKeyboard {
color: white;
cursor: pointer;
margin-left:2px;
}
#SindhiKeyboard {
height: 150px;
}
#FirstLine, #SecondLine, #ThirdLine, #FourthLine, #FifthLine {
text-align: center;
height: 30px;
}
.SindhiKey {
font-size: 16px;
font-weight: bold;
color: #ffffff;
background: #3498db;
background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
background-image: -moz-linear-gradient(top, #3498db, #2980b9);
background-image: -ms-linear-gradient(top, #3498db, #2980b9);
background-image: -o-linear-gradient(top, #3498db, #2980b9);
background-image: linear-gradient(to bottom, #3498db, #2980b9);
-webkit-border-radius: 2;
-moz-border-radius: 2;
border-radius: 2px;
width: 20px;
height: 20px;
cursor:pointer;
display: inline-block;
text-align: center;
margin-top: 10px;
padding: 2px;
}
.SindhiKey:hover {
background: white;
color: black;
}
.SindhiKey:active {
background: white;
color: gray;
position:relative;
top:2px;
}
.SindhiKeySpace {
font-size: 20px;
color: white;
background: #3498db;
background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
background-image: -moz-linear-gradient(top, #3498db, #2980b9);
background-image: -ms-linear-gradient(top, #3498db, #2980b9);
background-image: -o-linear-gradient(top, #3498db, #2980b9);
background-image: linear-gradient(to bottom, #3498db, #2980b9);
border:0px solid #4a3a00;
border-radius: 8px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
width: 200px;
height: 20px;
cursor:pointer;
display: inline-block;
text-align: center;
margin-top: 10px;
}
.SindhiKeySpace:hover {
background: white;
color: black;
}
.SindhiKeySpace:active {
background: white;
color: yellow;
position:relative;
top:2px;
}
#translControl1 {
}
/* End of CSS for Koha CoverFlow Plugin */
.mastheadsearch {
color:#FFF;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
padding: .8em;
margin: .5em 0;
background: #c7c7c1;
background: -moz-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(38%, #c7c7c1), color-stop(100%, #a7a7a2));
background: -webkit-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: -o-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: -ms-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: linear-gradient(to bottom, #0B0B23, rgb(70, 71, 113) 100%);
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#c7c7c1', endColorstr='#a7a7a2', GradientType=0);
}
</style>
<form name="searchform" method="get" action="/cgi-bin/koha/opac-search.pl" id="searchform" class="form-inline">
<label for="masthead_search">
Search
</label>
<select name="idx" id="masthead_search">
<option value="">Library catalog</option>
<option value="ti">Title</option>
<option value="au">Author</option>
<option value="su">Subject</option>
<option value="nb">ISBN</option>
<option value="se">Series</option>
<option value="bc">Accession No.</option>
<option value="callnum">Call number</option>
</select>
<input type="text" title="Type search term" class="transl1" id="translControl1" name="q"><span id="translControl"></span>
<div class="input-append">
<button type="submit" id="searchsubmit" class="btn btn-primary">Go</button>
<span id="DisplaySindhiKeyboard" onclick="DisplaySindhiKeyboardFunction();" class="btn btn-primary">سنڌي</span>
</div>
</form>
<div id="divSindhiKeyboardcontainer">
<center>
<!-- <span id="DisplaySindhiKeyboard" onclick="DisplaySindhiKeyboardFunction();">سنڌي</span> -->
<div id="SindhiKeyboard" style="display: none;">
<div id="FirstLine">
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">چ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڃ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">جھ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڄ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ج</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ث</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ٺ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ٽ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ٿ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ت</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڀ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">پ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ٻ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ب</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ا</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">آ</div>
</div>
<div id="SecondLine">
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ص</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ش</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">س</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ز</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڙ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ر</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ذ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڍ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڊ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڏ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڌ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">د</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">خ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ح</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڇ</div>
</div>
<div id="ThirdLine">
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڱ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">گھ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڳ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">گ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ک</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڪ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ق</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڦ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ف</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">غ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ع</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ظ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ط</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ض</div>
</div>
<div id="FourthLine">
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ي</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ء</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ھ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">و</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ڻ</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ن</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">م</div>
<div class="SindhiKey" onclick="WriteLetter(this.innerHTML);">ل</div>
<div id="FifthLine">
<div class="SindhiKeySpace" onclick="WriteLetter(this.innerHTML);"> </div>
</div>
</div>
</div>
</center>
</div>
Arabic Keyboard
3. Arabic: Koha > Administration > System Preferences > OpacCustomSearch
<script type="text/javascript">
function WriteLetter(Letter) {
textfield = document.getElementById("translControl1");
textfield.value = textfield.value + Letter;
}
function DisplayArabicKeyboardFunction () {
x = document.getElementById("ArabicKeyboard");
if (x.style.display == "none") {
x.style.display = "block";
}
else if (x.style.display == "block") {
x.style.display = "none";
}
}
</script>
<style type="text/css">
#divArabicKeyboardcontainer {
}
#DisplayArabicKeyboard {
color: white;
cursor: pointer;
margin-left:2px;
}
#ArabicKeyboard {
height: 160px;
}
#FirstLine, #SecondLine, #ThirdLine, #FourthLine #FifthLine{
text-align: center;
height: 30px;
}
.ArabicKey {
font-size: 16px;
font-weight: bold;
color: #ffffff;
background: #3498db;
background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
background-image: -moz-linear-gradient(top, #3498db, #2980b9);
background-image: -ms-linear-gradient(top, #3498db, #2980b9);
background-image: -o-linear-gradient(top, #3498db, #2980b9);
background-image: linear-gradient(to bottom, #3498db, #2980b9);
-webkit-border-radius: 2;
-moz-border-radius: 2;
border-radius: 2px;
width: 20px;
height: 20px;
cursor:pointer;
display: inline-block;
text-align: center;
margin-top: 10px;
padding: 2px;
}
.ArabicKey:hover {
background: white;
color: black;
}
.ArabicKey:active {
background: white;
color: gray;
position:relative;
top:2px;
}
.ArabicKeySpace {
font-size: 20px;
color: white;
background: #3498db;
background-image: -webkit-linear-gradient(top, #3498db, #2980b9);
background-image: -moz-linear-gradient(top, #3498db, #2980b9);
background-image: -ms-linear-gradient(top, #3498db, #2980b9);
background-image: -o-linear-gradient(top, #3498db, #2980b9);
background-image: linear-gradient(to bottom, #3498db, #2980b9);
border:0px solid #4a3a00;
border-radius: 2px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
width: 200px;
height: 20px;
cursor:pointer;
display: inline-block;
text-align: center;
margin-top: 10px;
}
.ArabicKeySpace:hover {
background: white;
color: black;
}
.ArabicKeySpace:active {
background: white;
color: yellow;
position:relative;
top:2px;
}
#translControl1 {
}
/* End of CSS for Koha CoverFlow Plugin */
.mastheadsearch {
color:#FFF;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
padding: .8em;
margin: .5em 0;
background: #c7c7c1;
background: -moz-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(38%, #c7c7c1), color-stop(100%, #a7a7a2));
background: -webkit-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: -o-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: -ms-linear-gradient(top, #c7c7c1 38%, #a7a7a2 100%);
background: linear-gradient(to bottom, #0B0B23, rgb(70, 71, 113) 100%);
filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#c7c7c1', endColorstr='#a7a7a2', GradientType=0);
}
</style>
<form name="searchform" method="get" action="/cgi-bin/koha/opac-search.pl" id="searchform" class="form-inline">
<label for="masthead_search">
Search
</label>
<select name="idx" id="masthead_search">
<option value="">Library catalog</option>
<option value="ti">Title</option>
<option value="au">Author</option>
<option value="su">Subject</option>
<option value="nb">ISBN</option>
<option value="se">Series</option>
<option value="bc">Accession No.</option>
<option value="callnum">Call number</option>
</select>
<input type="text" title="Type search term" class="transl1" id="translControl1" name="q"><span id="translControl"></span>
<div class="input-append">
<button type="submit" id="searchsubmit" class="btn btn-primary">Go</button>
<span id="DisplayArabicKeyboard" onclick="DisplayArabicKeyboardFunction();" class="btn btn-primary">عربی</span>
</div>
</form>
<div id="divArabicKeyboardcontainer">
<center>
<!--<span id="DisplayArabicKeyboard" onclick="DisplayArabicKeyboardFunction();">عربی</span> -->
<div id="ArabicKeyboard" style="display: none;">
<div id="FirstLine">
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">د</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ج</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ح</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">خ</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ه</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ع</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">غ</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ف</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ق</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ث</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ص</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ض</div>
</div>
<div id="SecondLine">
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ط</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ك</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">م</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ت</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ا</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ل</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ب</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ي</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">س</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ش</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ذ</div>
</div>
<div id="ThirdLine">
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ظ</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ز</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">و</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ة</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ى</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ل</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ر</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ؤ</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ء</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ئ</div>
</div>
<div id="FourthLine">
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">إ</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">أ</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">آ</div>
<div class="ArabicKey" onclick="WriteLetter(this.innerHTML);">ئ</div>
</div>
<div id="FifthLine">
<div class="ArabicKeySpace" onclick="WriteLetter(this.innerHTML);"> </div>
</div>
</div>
</center>
</div>
Credits
Mr. M. Ibrahim & Abid Hussain (Urdu Keyboard)
Mr. Iftikhar Ali Shah (Sindhi Keyboard)
Abdul Rauf (Arabic Keyboard)