HTML input in Hindi or other non-english languages (Mostly Indian) - html

I want to take user input in Hindi in a HTML form.
How do i go about it?
I tried setting the font-family for the <input /> to some hindi font. But that doesn't work.
Is there any other way of doing it?
Even embedding Google Transliterate or something similar will do. But i need to store the data entered into a MySQL Database.
PS: I am using PHP to do the server side stuff.

Although from your question it's not clear what you are trying to do. But for the sake of this answer I'm going to assume that you want users to see hindi characters as they type with their keyboard. In that case changing font is not going to help. Changing font has nothing to do with what characters you type on keyboard and what characters you see on screen.
If you want to let users type hindi character with their QUERTY keyboard then you need to embed something like google transliterate.
Here is the developers documentation on how to do it
https://developers.google.com/transliterate/v1/getting_started
Hope it helps.

Just download a Hindi font and change the input field font family to a Hindi font name.

Related

Maintaining font style/formatting into a form that doesn't support html/markdown

I have looked into the previous postings to do with this area but haven't found any relevant answers as perhaps I am asking the wrong question.
On the popular design site Dribbble, there seem to be interesting formatting changes in profile names that break from the conventions of the site's styling.
Alot of people have been adding special characters (ΔδΓ etc.) that can be achieved by pasting into their profile form and saving changes, yet some users have somehow managed to enter formatted versions of their name, despite the profile form not supporting HTML or Markdown. You can see an example in the images below.
An example of copying the font to Google with maintained formatting
When opening in inspector, it also shows the formatted type
How could this be done in a simple text input form that doesn't support HTML/Markdown?
These are almost certainly Unicode characters, just like these characters that you reference in your question: ΔδΓ.
For example, Unicode's mathematical alphanumeric symbols section includes symbols that look like the ones in your screenshot. Since these are separate Unicode characters there is no need for additional formatting.
Users will need to have a font that supports those characters installed locally to view them.

Is it possible to sniff out what font a browser is currently using from server side?

Basically I want to echo back to the user what font they are using. Is it possible to do? If there is a Wordpress plugin for it, that would be extra nice.
The page in question is going to show Chinese characters. My friend wants to have one column with a character as it looks in mainland China, and then a column with how it looks in Taiwan (there are slight, but distinct, differences - see the article at the link), both these columns will be pictures. And then a third column that displays the character using your font. It would be neat if there was a way to know which variant the user's font is displaying. But now that I write it out, it seems like a very hard problem.
Hacking Chinese on character differences

Embed a symbol from a custom font

maybe this question is too easy, but I couldn´t find anything helpful.
I know how to define a custom font in a CSS file by #font-face.
What I don´t know is how I can find out which code I have to use to display a certain symbol.
To make my request clearer I can give you a simple example:
How can I display the second snoopy icon from this font on a webpage?
http://de.fontriver.com/font/snoopy_dings/
And how do you find out the code for a certain symbol?
Thank you for your efforts,
Robert
First of all you need to find out the relevant letter that maps to your symbol. for that download that font and install it to your computer, open up a word processor and use insert symbol feature. So you can find the relevant English letter. Lets say it is "L".
Then you just type L in HTML and set the font through CSS.
for your problem, it is "B" so to display the second snoopy icon from this font on a web page you need code below.
HTML
<span class="snoopy">B</span>
CSS
.snoopy{
font-family: "Snoopy Dings";
}
I guess your symbol is a letter, but the font is so weird that it doesn't look like a letter. Use you font and try to write the B letter. It should be your Snoopy icon.
Unless you have a alphabetic chart there's no easy way to find out what icon is linked to what other letter. The easiest solution is to just type out the letters in that font and see what pops up.
There's actually an option in the site to try each letter (under Probefahrt). That gives you an input in a normal font and outcome in the custom font.

'font-family: Symbol' and Windows-1252

I have a bunch of HTML documents that contain some simple text in Windows-1252 encoding, but throughout the text there are numerous appearances of span elements with font-family: Symbol.
For example:
<span style='font-family:Symbol'>Ñ</span>
Which appears as the greek delta - Δ in the browser.
Google told me that using the Symbol font might show different results on different systems, as it's not actually a well defined font.
Is this really true? Is it "unsafe" to use the Symbol font?
If so, is there any way to reliably convert (on my own system) such symbols in the Symbol font to their Windows-1252 counterparts?
It's been always unsafe to rely on having certain font installed on all the computers/smartphones/gadgets that visit your site. There're some font embedding techniques that work reasonably well in some modern browsers but you'd need to repack the Symbol font and I doubt the copyright owner allows you to do it.
Of course, most characters in the Symbol font are not in the Windows-1252 encoding but that should not be an issue. You can use the following map to obtain the appropriate HTML entities. However, you'll have to write a script or program using a programming language (HTML is just a markup language).
When using font-family, if neither of the listed font faces are found on the client, that is without the webfont embeds, may result in changing to default font of client hence a different font replacement for what you'd show to your users.
You may want to use UTF-8 encoding and put the delta (Δ) sign in your HTML content, or use webfont embeds to provide an option, "use the font I want from this".
The problem is that the greek letter you see is just the appearance, the actual letter is something completely different.
I can think of two ways to convert it:
1. Write a script (in your language of choice) that converts each letter to it's Greek counterpart. (Ñ => Δ)
2. Take a screenshot of the document/page and use an OCR-program to convert it to Greek text.

What is a good resource for HTML character codes -> glyph and

I've already found a good site to convert HTML character codes to their respective glyphs:
http://www.public.asu.edu/~rjansen/glyph_encoding.html
However, I need a bit more information. Does anyone know of a site like the one above that also provides information on what type of character code it is? Meaning, is it a special character? Is the glyph visible? Etc...
So far I have found some tables with this information, but they aren't as complete as the resource above. I would really like to get my hands on a complete table.
Thanks,
-Ben
HTML Entity Character Lookup
I like FileFormat.Info--e.g.: http://www.fileformat.info/info/unicode/char/20ac/index.htm
The character map on Ubuntu (and I assume most other Linux distros) is fantastic. You can search for any character by its name or description (e.g. "arrow") really easily.
Windows' character map is a poor imitation but kinda works too. It seems to decide that certain fonts (Arial, Verdana etc) can't display some characters, even though they work absolutely fine. (Hint: try MS's more recent font creations like Calibri for better results.)
Once you've found a character you can either:
Copy it and use it directly (requires pages to be UTF-8) like this: ↗
Insert it as a hexadecimal entity. The above character is "U+2197 North East Arrow" so the entity would be ↗
Convert the hex code to decimal (the calculators on Windows and Linux can do this). The above example is ↗
Here's a quick, low-footprint way to look them up: &what;