Use specific glyph name with no Unicode value in HTML? - html

How can I use for example the glyph name "rcaron.terminal" which has no Unicode value in HTML? or any other such case? Is it even possible? I think it must be surely but I got no clue. It's easy for regular letters like the glyph "ß" where I would just type "&#xDF" and get that character or "&#223" (same result) but for glyphs without any Unicode value I don't know what I'm supposed to do...? I've tried also "&rcaron.terminal" but nothing, where as something like "&hearts" would work giving a heart glyph of god knows what font, probably Arial I dunno.
Do I need to use state some specific encoding aside from ANSI in my html document?
ie. < meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-8" > or something... like Im really lost lol
All I found on the net was this http://text-symbols.com/html/unicode/ but I cant find any more info so I came here.
Please help! Thanks! :)

There are no glyphs in HTML which do not have a Unicode name.
If you really need to have a glyph which is not representable using regular Unicode, you might want to create a font of your own and define the glyphs you need in the private use area; but obviously, then, your HTML will be impossible to use without that particular font.
Background links:
http://arstechnica.com/information-technology/2008/10/embedded-web-fonts/
http://www.font-face.com/
Practical guides:
http://blog.fogcreek.com/trello-uses-an-icon-font-and-so-can-you/
http://blogs.atlassian.com/2013/07/how-to-make-an-icon-font-the-8-step-guide/

First navigate to this site: https://fontdrop.info/#/?darkmode=true
Upload the file with your font
Click on the Ligatures tab.
Every Glyph should have a Components field
copy the components for the character you want to use
paste that string into HTML
You don't need any & or #, it just detects the string and converts it.

Related

How do I add a symbol in html?

I want to add a back link in html. Because my code makes a link open in a new tab I made my code close the current code. So I typed this:
↩ Back
But it shows up with this: ↩ Back not this: ↩ Now I'm wondering if you can't actually put symbols on to html.
If anyone knows the answer I will be very happy.
You can add the same symbol using Unicode. The html code is
&#8629 you can add different symbols on HTML even emojis. More on on this here. Hope this helps.
One way to show a Unicode symbol in HTML would be to substitute it for its character entity.
The character you're looking for in this case is either &larrhk;, &hookleftarrow;, ↩ or ↩:
<div>&larrhk;</div>
<div>&hookleftarrow;</div>
<div>↩</div>
<div>↩</div>
A full list of character entities can be found here for reference.
<meta charset="UTF-8"> to change your encoding? From w3schools. You might need a different encoding.

How to show special character in UTF-8 of Kmer symbol

I have got ឴symbol, that i can't display on web page (utf-8) content type. This symbol without width and can't see at all. How to show it? Code is ឴
for example here http://www.endmemo.com/unicode/khmer.php 6068 and 6069 are not visible, but i need to show it, at least space
Edited:
I'm using Arial or sans-serif. I think, that it is pretty usual fonts. What people do: they making UNIQUE text by inserting this symbol inside usual symbols. For example, user write: "a(invisible symbol of kmer)b(invisible symbol of kmer)" and so on. I see on page only "ab" without any spaces. I tried to put actual character inside html to see it, but with no luck. I thought that symbol, that is not present in font should be question mark or empty square, but not in that case. Solution can't just be simple replace in text.
If your page is UTF-8 then it's better to use the actual character rather than a HTML entity.
Your requested character is not present in many fonts. You can try finding the latest version of Code2000 which appears to support it.
You can see fonts that support this particular character here:
http://www.fileformat.info/info/unicode/char/17b4/fontsupport.htm
If you can't find a font and you want to display an empty space instead you could replace it before showing it in the page or put it in a container. The page you linked uses a table cell to hold the character.

How to convert MS Outlook smiley (Wingdings) to something displayable in a browser?

In the noble effort to re-invent every wheel, our company has recently rolled our own custom web-based e-mail app, of which I was the primary designer.
One thing I've noticed is that smileys coming in from MS Outlook-based e-mails (sent from third parties) are not appearing correctly. Example: A happy face just displays a J
The HTML of the inbound message comes in like this:
<span style="...;font-family:Wingdings;...">J</span>
I know that Firefox and Chrome do not support the Wingdings font because it is non-standard. However, I am tasked with coming up with a fix.
Is there a good way to either 1) force the browser to load and use Wingdings or 2) otherwise convert the J to a smiley?
I'd rather not do anything crazy like try some wingdings-detection-regex - or even worse, parse the DOM - just to get some stupid emoticons working. Maybe there is already some library out there that already handles this?
For what it's worth, GMail seems to not 'fix' this problem either. iOS doesn't in the message view, but puzzlingly does fix it in the inbox view (replaces the J w/ emoji)
EDIT
To clarify, this question is regarding inbound messages from third parties. Outlook, by default, autocorrects ":)" to the Wingdings smiley. There's nothing I can do to prevent this coming in. What I need is a solution to correct for this.
EDIT 2
Again, the app itself is a web based e-mail client (Gmail, etc.). E-mails go in to here, NOT to users' individual Outlook/phones/other e-mail clients. It only goes into the web app.
To avoid having to parse the HTML or manipulating the DOM, a simple solution would be to use CSS3 web fonts by linking the Wingdings font-family to a copy of the Wingdings font file on your server:
<style>
#font-face {
font-family: Wingdings;
src: url(link_to_wingdings_font_file.ttf);
}
</style>
However, a license is required for this approach.
You could embed the SWEC (Symbola-based Wingdings Emoticons Compatibility) font: https://drive.google.com/open?id=0BwDrnPQfa-aMOEx0bEZCQUNrSGs
It provides basic compatibility with Wingdings emoticons. (In Wingdings, "J" represents a smile, "K" represents a lack of expression, and "L" represents a frown.) Background: certain versions of Microsoft e-mail clients still in use change user-typed expressions such as ":)", ":|", and ":(" into "J", "K", and "L", respectively, and then specify Wingdings as the font family; recipients on systems which do not include a Wingdings-compatible font are not able to see the intended emoticons, which can cause confusion.
You need to manually substitute it prior to sending the email as you have no control over what fonts the reader has installed. You also can't include anything outside bland old html and css (unless you want to mess with VML)
First I would try running your wingding through a html converter to see if there is a html code for it.
Besides that, you could try a webfont wingdings equivalent, however there are issues with Outlook playing nice when webfonts are imported in email (ignores your font stack, falling back to Times New Roman).
Besides that, all that is left is ZephyrusDigital's suggestions of using an image or :).
Against my better judgement I have decided to go for the quick hack and just use a regular expression. Here it is for anyone else that runs into the same problem:
$html = preg_replace('/\<SPAN*?(Wingdings)*?[^\>]*\>J(\<o\:p\>\<\/o\:p\>)*\<\/SPAN\>/i', ' :) ', $html);
use :)
kidding!
why not save the wingdings smiley in photoshop as a png, or make another custom one? you could use <img src="http://something.com/images/smiley.png" style="display:inline-block;"/> and it won't look weird in a text block as long as it isn't taller than your line-height.

Displaying UTF-8 codes from JSON file as Emoticons

I am loading a JSON file that contains some UTF-8 codes, that represent emoticons.
The JSON content looks as follows:
"Studying! \uf4d6"
"Winning \uf40e\uf3c1 #4mile"
"Cheer me on \uf603 #werunamsterdam"
These UTF-8 codes are displayed as blocks in the browser. But when I look at this Unicode reference in Firefox, the codes are actually recognized!
(for example, UF4D6 is a book)
How do I convert the code from my json so that a browser can display them?
The code points from \uE000 to \uF8FF are in a private use area, so there aren't any standard glyphs associated with them.
You can, however, create your own font with suitable icons at these code points. This can be done quite easily using online tools like IcoMoon. Alternatively, use a string replacement routine to swap these characters with suitable markup (e.g., replace \uf4d6 with <img src="/icons/book.png" alt="[Book]" />)
These emoticons are encoded as regular characters as defined in Unicode, i.e. they're no different from the letter "A" or "%". All you need is a font that has glyphs for these "characters". Since not everyone can be expected to have such fonts installed (apparently you don't), if you want maximum compatibility, there are libraries for most languages that replace these characters with equivalent images. Google for one that suits your needs.

Trademark symbol is displayed as raw text

if you visit www.startwire.com you'll see in the center of the page (in the yellow box, under the video) the following:
StartWire™
in our dev and stage environments, this is not an issue, but it is in production. What could possibly be causing this?
If you look at the page source, you will see &trade; - you are double encoding the entity.
This should be simply ™.
In the HTML you have:
<h2>Sign-up now. StartWire&trade; is completely FREE.</h2>
whereas the correct would be:
<h2>Sign-up now. StartWire™ is completely FREE.</h2>
Notice the extraneous &. Look like you are double encoding something on the server.
If you check your page source it says:
&trade;
This means that probably it took ™ and transformed that into HTML. So the & becomes &. This is probably due to the use of a htmlentities() function.
Make sure you do not do this conversion twice...
A possible cause of this is that you are taking the contents from a database and that you have encoded the entries before inserting them into the database and you encode them a second time when you retrieve them from this database.
Is the content being "HTML encoded" (or whatever they call it) automatically, somewhere in the script? Because this is what appears in the HTML: &trade;.
My suggestions would be to just use the symbol in your code (™). If that doesn't work, try escaping the & of ™ using \ (so that it becomes \™).
not sure, but i have checked your site it shows like you have write like
&™
simple write ™