Html For Displaying Tibetan
<h3 class="heading-h6"><a name="THLToolboxHomegtDevelopersZonegtWebdevelopmentgtMakingWebPagesInTibetanUnicodegtHTMLforTibetanFonts" class="anchorpoint"></a><a href="/tools/wiki/Home.html">THL Toolbox</a> > <a href="/tools/wiki/Developers%27%20Zone.html">Developers' Zone</a> > <a href="/tools/wiki/Web-development.html">Web-development</a> > <a href="/tools/wiki/Making%20Web%20Pages%20In%20Tibetan%20Unicode.html">Making Web Pages In Tibetan Unicode</a> > HTML for Tibetan Fonts</h3><p class="paragraph">
</p><h3 class="heading-h1"><a name="HTMLforTibetanFonts" class="anchorpoint"></a>HTML for Tibetan Fonts</h3><p class="paragraph"><strong class="bold">Contributor(s):</strong> Nathaniel Grove</p><p class="paragraph">Creating HTML pages that display Unicode Tibetan font is fairly straightforward provided that the viewing computer is properly set up. For Windows machines this means that they must have XP or later, have a suitable version of Uniscribe (usp10.dll), and have the Tibetan Machine Uni font (or some other OpenType Unicode font). For information of setting up a computer, see <img src="/" alt="external link: " title="external link"/><span class="nobr"><a href="http://www.thdl.org/xml/showEssay.php?xml=/tools/fonts/tibfontuse.xml." target="rwikiexternal">http://www.thdl.org/xml/showEssay.php?xml=/tools/fonts/tibfontuse.xml.</a></span> For Macs, the only thing that works consistently in viewing Tibetan fonts on line is <span class="nobr"><img src="/" alt="external link: " title="external link"/><a href="http://www.xenotypetech.com/osxTibetan.html" target="rwikiexternal">Xenotypes Tibetan Language Kit</a></span>.</p><p class="paragraph">The HTML code that is needed can be done in one of two ways, using THL styles or using in-line styles.
Using THL Styles</p><p class="paragraph">Any THL page that uses the <img src="/" alt="external link: " title="external link"/><span class="nobr"><a href="http://www.thdl.org/styles/thdl-styles.css" target="rwikiexternal">http://www.thdl.org/styles/thdl-styles.css</a></span> as all THL pages must can simply use the .tib class style. This is done by adding a class="tib" attribute to whatever element contains the Tibetan. It should contain only Tibetan script as the style changes the font to Tibetan Machine Uni at a larger size so English will look strange. To select just the Tibetan text within a mixed language paragraph use the <span> element. An example is:</p><ul class="star"><li><span class="tib">Tibetan here</span></li></ul><p class="paragraph">An example using this is (view code to see it):</p><p class="paragraph"> འདིར་བོད་སྐད་འབྲི།</p><p class="paragraph"><strong class="bold">Note:</strong> Most browsers/systems do not presently recognize the Tibetan <em class="italic">tsek</em>, or intersyllabic dot, as a line-breaking point. For this reason, when producing the Unicode Tibetan for inclusion in HTML pages, to induce proper line-breaking, each <em class="italic">tsek</em> should be replaced by a <em class="italic">tsek</em> followed by a zero-width space. In Unicode, this would mean replacing each occurrence of U+0F0B with U+0F0B U+200B.
</p><h3 class="heading-h2"><a name="UsingInLineStyles" class="anchorpoint"></a>Using In-Line Styles</h3><p class="paragraph">The in-line style to achieve the same thing uses the style attribute on whatever element one one's to appear in Tibetan. To effect this you must set the font-family to "Tibetan Machine Uni" and "XenoType Tibetan New", set the font-size to 16pt or larger, set the line-height to 20pt or larger, and set the text-align to left. If the text align is not set to left, the characters may not properly stack in some browsers but will be stretched out over the line with the subscribed dotted-circles. The example for this markup will also use a span tag.</p><ul class="star"><li><span style="font-family: 'XenoType Tibetan New','Tibetan Machine Uni'!important; font-size: 16pt; text-align: left;">Tibetan here</span></li></ul><p class="paragraph">An example using this is (view code to see it):</p><p class="paragraph"> འདིར་བོད་སྐད་འབྲི།
</p><h3 class="heading-h2"><a name="CommonProblems" class="anchorpoint"></a>Common Problems</h3><p class="paragraph"><strong class="bold">The Tibetan displays in the browser but it does not stack properly. Each stacked character appears in its own space with a dotted circle. Something like this:</strong></p><p class="paragraph">འདིར་བོད་སྐད་འབྲི།
This is because the font is being justified. Add "text-align: left;" to the style attribute of the element. If necessary, use the "important" declaration, i.e. "text-align: left!important;".</p><p class="paragraph"><strong class="bold">The Tibetan appears fine in browsers on Windows but not on Macs</strong></p><p class="paragraph">This is because there is no declaration of the Xeno type font in the style. The Xeno type font must be declared first as in the above example. Windows will ignore it and use the second font, but somehow Macs don't do the same thing.
</p><h3 class="heading-h6"><a name="ProvidedforunrestrictedusebythespanclassnobrimgsrcsakairwikitoolimagesicklearrowgifaltexternallinktitleexternallinkahrefhttpwwwthdlorgtargetrwikiexternalTibetanandHimalayanLibraryaspan" class="anchorpoint"></a><em class="italic">Provided for unrestricted use by the <span class="nobr"><img src="/" alt="external link: " title="external link"/><a href="http://www.thdl.org" target="rwikiexternal">Tibetan and Himalayan Library</a></span></em></h3><p class="paragraph">
</p>