cufon fonts+localization+javascript WordPress
- REFUNDED
Hi,
Please kindly assist me - it involves Javascript.
The site, http://www.shlomitart.com/, for the following issues:
The left side of the main page contains widgets.
1. Some of the widgets headers, in Hebrew, are not showing - "coral mainpage portfolio" (the first line, above the black & white portrait).
2. Where it does present Hebrew text in the widgets, it displays only part of the title (for example, instead of 'recent work', it only shows 'recent').
3. The main sentance, below the logo, the text is not looking good. too much space, and also, it does not present the full text, only part of it.
4. I would like to decrease the spaces in the navigation menu ( so I will be able to increase the font and still see the nabigation in one line).
5. The hebrew fonts are not working on Explorer and Firefox. Only on chrome.
Is it possible to remove ALL cufon fonts and just use Arial? this would be the best solution!!
Thanks in advance,
Sharon
Answers (1)
Christianto answers:
Hi,
If some word not appear, it means cufon isn't support it,
I run a test and include all possible character/glyphs on [[LINK href="http://cufon.shoqolate.com/generate/"]]cufon font generator[[/LINK]], and has same result.
the font might support the character but not cufon.
Also cufon isn't support RTL natively anymore, you can see [[LINK href="https://github.com/sorccu/cufon/issues/4"]]here[[/LINK]], I don't know if there are add-on that really work like cufonRTL.js to support RTL.
If you could use other font replacement method, why not using @font-face?
you can try to [[LINK href="http://fontface.codeandmore.com/index.php"]]generate required font-face font here[[/LINK]]
and include the font by adding css rules, for example:
@font-face {
font-family: 'QuicksandBook-Regular';
src: url('quicksandbook.eot');
src: url('quicksandbook.eot?#iefix') format('embedded-opentype'),
url('quicksandbook.woff') format('woff'),
url('quicksandbook.ttf') format('truetype'),
url('quicksandbook.svg#quicksandbook') format('svg');
font-weight: normal;
font-style: normal;
}
#accordion h3 a,
.quote,
.infobar .greet,
.infobar h1,
.infobar h2,
.infobar h3,
.infobar h4,
.contents h1,
.contents h2,
.contents h3,
.contents h4,
.contents .dropcaps,
.contents .relatedbigtitle,
.infobar h3,
.infobar .title,
.contents .portfoliotitle,
.fullwidth-title,
.contents .postsingletitle,
.contents .categorytitle,
#sidebar .sidebartitle
{
font-family: 'QuicksandBook-Regular'
}
I've made test if you need to check it, [[LINK href="https://www.dropbox.com/s/ryn32vqntcu8bra/test.zip"]]please download here[[/LINK]]
cloudnclear comments:
Hi,
Thank you for your reply.
I would like to use font-face instead!
You wrote: "you can try to generate required font-face font here"
I'm not sure what I should do there? which file should I upload to convert?
Sharon
Christianto comments:
Hi Sharon,
its just example site if you need to generate/convert font to use in @font-face,
there is another tool like:
http://www.fontsquirrel.com/fontface/generator
you can upload True Type (TTF), Open Type (OTF), or PostScript (PFB),
to generate other font-face file type such as .eot (for Internet Explorer), .woff, or .svg format.
And get the example files so you can check the source code to see @font-face rules.
It's necessary to get different font format, because some browser only support certain font format,
for example IE with its own proprietary format, Embedded Open Type (.eot), and older mobile browser using .svg
you can also use font on [[LINK href="http://www.google.com/webfonts"]]google webfont[[/LINK]] which using @font-face too.
just need to include the files by link/@import/javascript, and set font-family to target element.