@font-face
@font-face
Hello all,
@font-face Extension:
Here is an extension to support any type of font on any device or browser. All fonts are saved on your server and you do not relay on any external link etc. Basically it does bullet proof your web fonts.
The extension supports:
TTF for Firefox 3.5+ , Opera 10+, Safari 3.1+, Chrome 4.0.249.4+
EOT fonts for Internet Explorer 4+
WOFF fonts for Firefox 3.6+, Internet Explorer 9+, Chrome 5+
SVG fonts for iPad and iPhone
here is the demo:
http://www.virtualdesigners.co.uk/proje ... font-face/
http://virtualdesigners.co.uk/projects/ ... font-face1
This extension is for free of charge for now and you can download it including Help document from below links:
WB Version 7.X and 8.1
http://www.virtualdesigners.co.uk/proje ... .x-8.1.zip
WB Version 8.2
http://www.virtualdesigners.co.uk/proje ... ce-8.2.zip
Please email me your thoughts and feedback
reza@virtualdesigners.com
P.S. I have tested with 7.x, 8.1 and 8.2 and and it works sweet. I believe it does need more tweaking and work to make it with more options and more friendly which I will be doing in next version. but I think for now it does the basic job.
@font-face Extension:
Here is an extension to support any type of font on any device or browser. All fonts are saved on your server and you do not relay on any external link etc. Basically it does bullet proof your web fonts.
The extension supports:
TTF for Firefox 3.5+ , Opera 10+, Safari 3.1+, Chrome 4.0.249.4+
EOT fonts for Internet Explorer 4+
WOFF fonts for Firefox 3.6+, Internet Explorer 9+, Chrome 5+
SVG fonts for iPad and iPhone
here is the demo:
http://www.virtualdesigners.co.uk/proje ... font-face/
http://virtualdesigners.co.uk/projects/ ... font-face1
This extension is for free of charge for now and you can download it including Help document from below links:
WB Version 7.X and 8.1
http://www.virtualdesigners.co.uk/proje ... .x-8.1.zip
WB Version 8.2
http://www.virtualdesigners.co.uk/proje ... ce-8.2.zip
Please email me your thoughts and feedback
reza@virtualdesigners.com
P.S. I have tested with 7.x, 8.1 and 8.2 and and it works sweet. I believe it does need more tweaking and work to make it with more options and more friendly which I will be doing in next version. but I think for now it does the basic job.
Last edited by r3za on Sat Oct 26, 2013 11:33 am, edited 9 times in total.
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Re: @font-face
Reza thanks, its very usefull.
Its working with WB 8.2? Did you update it?
Joe
Its working with WB 8.2? Did you update it?
Joe
Re: @font-face
Hello Joe,
This is updated for 8.2 now.
thanks
This is updated for 8.2 now.
thanks
Last edited by r3za on Tue Jun 12, 2012 6:47 pm, edited 1 time in total.
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
- BaconFries
-
- Posts: 5621
- Joined: Thu Aug 16, 2007 7:32 pm
Re: @font-face
@r3za you may have to provide two versions of the extension why I hear you ask it you build the extension with EB4.0 then then it can only be used with WB8.2 so any user that is using any earlier version of ie WB 8.1.5 and below will not be able to use unless they update.
Re: @font-face
Yes, Actually when I build with E.B 3 it works with all versions but HTML rendering doesn't work with the actual extension when you add it to the page which is quite useful. Best practice as you said it is two versions. Thanks BaconFries for the heads up.
Last edited by r3za on Tue Jun 12, 2012 6:48 pm, edited 1 time in total.
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
- me.prosenjeet
-
- Posts: 1267
- Joined: Mon Dec 24, 2007 1:50 pm
- Location: Lucknow
- Contact:
Re: @font-face
Best is make it on EB 2.6, that way it works on WB 7x and WB 8x
Check the new Chat GPT and Malware detect extensions at the link below
Check my WB Extensions
Check my WB Templates
---------------------------------------------------------
www.Lucknowwebs.com
Check my WB Extensions
Check my WB Templates
---------------------------------------------------------
www.Lucknowwebs.com
Re: @font-face
Hello Prosenjeet,
E.B 2.6 didnt work for WB8.2 as the concept is different. I have used E.B 2.6 to build WB 8.1 and below and E.B. 3.0 for 8.2. This was only to make sure it is covered all options inc. Live HTML rendering.
thanks for feedback!
E.B 2.6 didnt work for WB8.2 as the concept is different. I have used E.B 2.6 to build WB 8.1 and below and E.B. 3.0 for 8.2. This was only to make sure it is covered all options inc. Live HTML rendering.
thanks for feedback!
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
- me.prosenjeet
-
- Posts: 1267
- Joined: Mon Dec 24, 2007 1:50 pm
- Location: Lucknow
- Contact:
Re: @font-face
I had mailed Support about this and I have his confirmation that all extensions made with EB2.6 or above will work with WB 8.2 and above. Only that extensions built with EB4 will work ONLY on 8.2 and above.
Check the new Chat GPT and Malware detect extensions at the link below
Check my WB Extensions
Check my WB Templates
---------------------------------------------------------
www.Lucknowwebs.com
Check my WB Extensions
Check my WB Templates
---------------------------------------------------------
www.Lucknowwebs.com
Re: @font-face
Thanks Prosenjeet. I will email as well. the problem is when i use the extension that is built with 2.6 for WB 8.2, it force the fonts to the ./fonts folder even though the code is not actual ./fonts and its root and from other side if on version 8.1 and lower, if i change the fonts directory to ./font in the code, it does not output the actual font files to fonts folder. so each way has disadvantage. when also I use EB3, it works for both versions but HTML LIVE rendering fails for for 8.2 which is quite useful for this purpose.
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Re: @font-face
@Reza Great stuff but do you have a live site that demonstrates this extension's capabilities?
Running WYSIWYG Web Builder since 2007...
Re: @font-face
hi Bendigo, Here are two links which one is a plain example and for other one I have user one of Pablo's templates:
http://virtualdesigners.co.uk/projects/ ... font-face1
http://virtualdesigners.co.uk/projects/ ... @font-face
http://virtualdesigners.co.uk/projects/ ... font-face1
http://virtualdesigners.co.uk/projects/ ... @font-face
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Re: @font-face
Hi Reza,
Don't know if you use these options in your extension(haven't tried it yet)
The last comment on following page.
http://www.brianhadaway.com/font-face-d ... d-devices/
Oh and here's a converter for fonts to use with your extension.
For the extra options for other devices
Use the expert option http://www.fontsquirrel.com/fontface/generator
Hans
Don't know if you use these options in your extension(haven't tried it yet)
The last comment on following page.
http://www.brianhadaway.com/font-face-d ... d-devices/
Oh and here's a converter for fonts to use with your extension.
For the extra options for other devices
Use the expert option http://www.fontsquirrel.com/fontface/generator
Hans
Re: @font-face
hi Haakoo,
thanks for the feedback. yes the extension works with Android and it covers the link.
thanks for the feedback. yes the extension works with Android and it covers the link.
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Re: @font-face
Glad to hear that it does.
Now only converting my ttf to other formats
Hans
Now only converting my ttf to other formats
Hans
Re: @font-face
How does this differ from the in-built @font-face ?
Re: @font-face
Paul,
When you watch your site on an android or iphone/pad the normal fontface isn't working
the extension that is= .eot
on different platforms you need different supported extensions like .woff,svg
Maybe Pablo might consider to put this in by default?
I know it would mean a bigger file.
But the support for tablets and smartphones must also be up to date as it would kill your site-estethics
Hans
When you watch your site on an android or iphone/pad the normal fontface isn't working
the extension that is= .eot
on different platforms you need different supported extensions like .woff,svg
Maybe Pablo might consider to put this in by default?
I know it would mean a bigger file.
But the support for tablets and smartphones must also be up to date as it would kill your site-estethics
Hans
Re: @font-face
I did not have much luck with the built in as it did not work on iPad/Mac.Adendum wrote:How does this differ from the in-built @font-face ?
Running WYSIWYG Web Builder since 2007...
Re: @font-face
I don't have an Android phone but I can view my own site on an iPad and an iPhone and the Papyrus font seen in the headings is fine. So the inbuilt @fontface appears to be working as far as I can see. But I do remember Pablo saying that not all fonts will work in @fontface, so maybe your experiences were with incompatible fonts?
Re: @font-face
Yes it would seem so. Customer subsequently
Dropped the request.
Dropped the request.
Running WYSIWYG Web Builder since 2007...
Re: @font-face
I don't have an iPad/phone,so can't tell
But for some browsers eot alone doesn't work
I do test before to use a font to make sure.
Hans
But for some browsers eot alone doesn't work
I do test before to use a font to make sure.
Hans
Re: @font-face
@Bendigo
Take a look here for troubles that might occur http://www.fontsquirrel.com/blog/2010/1 ... e-problems
And more explanation about fontface here http://www.fontsquirrel.com/blog/2010/1 ... e-problems
Hans
Take a look here for troubles that might occur http://www.fontsquirrel.com/blog/2010/1 ... e-problems
And more explanation about fontface here http://www.fontsquirrel.com/blog/2010/1 ... e-problems
Hans
Re: @font-face
Thank you Hakoo. I will take a look but for the next project I will be trying Reza's extension for the job and see how it goes.
Running WYSIWYG Web Builder since 2007...
Re: @font-face
Yes I would use that extension too, but you still need the other @fontface files.
like the svg,woff as explained in the links posted in my prev post
Hans
like the svg,woff as explained in the links posted in my prev post
Hans
Re: @font-face
Please use below links to download. not sure why it does not appear.givi20 wrote:i just need some information. i tried downloading the extension but it doesn't appear in the list of the installed ones... why??
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Re: @font-face
Great work,man.Truly appreciate your commitment.
Re: @font-face
Hi, Just tried to install @font-face on 8.2.1 but seems not able to install at all. Do you have the 8.2.1 extension for this as well? Thanks a lot.
Re: @font-face
jason wrote:Hi, Just tried to install @font-face on 8.2.1 but seems not able to install at all. Do you have the 8.2.1 extension for this as well? Thanks a lot.
hi Jason, have you tried this link: http://www.virtualdesigners.co.uk/proje ... ce-8.2.zip
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Re: @font-face
Dear Reza,
Thanks a lot. Initially it didn't work as I am using the Unicode version with file extension uwbx. I managed to solve this problem by using the extension builder to convert the wbx extension file to the uwbx file which will work in unicode version. And it really works like a charm. Thanks a lot, Reza.
Thanks a lot. Initially it didn't work as I am using the Unicode version with file extension uwbx. I managed to solve this problem by using the extension builder to convert the wbx extension file to the uwbx file which will work in unicode version. And it really works like a charm. Thanks a lot, Reza.
Re: @font-face
Your @font-face seem not working for me. You didn't explain well whether by just placing it on a page will work on the whole text on the page that uses the font or just works only for what is written inside its property.
Re: @font-face
Hello Frankus, strange that you could not manage to work it out. this is for defined heading or paragraohs within the extension.frankus wrote:Your @font-face seem not working for me. You didn't explain well whether by just placing it on a page will work on the whole text on the page that uses the font or just works only for what is written inside its property.
1- simply drag and drop the extension to where you want to have the text
2- enter font name
3- browse to fonts per screenshot
4- you caneither enter a heading or paragraph or both e.g. if you enter a heading and leave paragraph blank, it does show heading only with new font.
Please let me know how you getting on.
Reza
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Re: @font-face
What of bulleted text?
If you can make this extension in a way that when it is just pasted on a page it affects all the text on a page that uses the same font, it will very good.
If you can make this extension in a way that when it is just pasted on a page it affects all the text on a page that uses the same font, it will very good.
Re: @font-face
Hello Givi20,givi20 wrote:r3za wrote:Hello Frankus, strange that you could not manage to work it out. this is for defined heading or paragraohs within the extension.frankus wrote:Your @font-face seem not working for me. You didn't explain well whether by just placing it on a page will work on the whole text on the page that uses the font or just works only for what is written inside its property.
1- simply drag and drop the extension to where you want to have the text
2- enter font name
3- browse to fonts per screenshot
4- you caneither enter a heading or paragraph or both e.g. if you enter a heading and leave paragraph blank, it does show heading only with new font.
Please let me know how you getting on.
Reza
mine will probably be the most stupid question ever, i know
but.. can i just use the font by writing my text in the heading/pharagraph space?
if so, what if i need words in bold, or text which is centerd etc etc? thank you very much for what you are doing
This works with where you have dropped the location and I am not sure if I could bold or center it as it will loses some major functions.
Regards,
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
- protectourlands
-
- Posts: 426
- Joined: Sat May 24, 2008 2:16 am
- Contact:
Re: @font-face
I recommend rendering the text as an image, then apply your font.
Right Click > Object properties >Publish text as image
Use GIF optimized for best quality and apply your background color as the transparency color.
Right Click > Object properties >Publish text as image
Use GIF optimized for best quality and apply your background color as the transparency color.
- protectourlands
-
- Posts: 426
- Joined: Sat May 24, 2008 2:16 am
- Contact:
Re: @font-face
The reason you are having issues with the text is the text frame spacing. Large text produces large spacing.
You really should render it as an image. If you choose GIF optimized you get an image with a transparent background. This way it will not matter what is behind it.
Or you can use a graphics program to build this image from your text and import it into WB.
What is the font? I can build it for you if you don't have an app for this.
You really should render it as an image. If you choose GIF optimized you get an image with a transparent background. This way it will not matter what is behind it.
Or you can use a graphics program to build this image from your text and import it into WB.
What is the font? I can build it for you if you don't have an app for this.
- protectourlands
-
- Posts: 426
- Joined: Sat May 24, 2008 2:16 am
- Contact:
Re: @font-face
Cursive fonts like the one you have chosen have built in spacing, so using them large will always introduce larger spacing. This may explain it.
But you don't have to eliminate the background. If you build the image in PNG or GIF with transparent background, you can set it over anything you wish. I will be glad to build it for you and send via email. Just let me know what the font is.
But you don't have to eliminate the background. If you build the image in PNG or GIF with transparent background, you can set it over anything you wish. I will be glad to build it for you and send via email. Just let me know what the font is.
- protectourlands
-
- Posts: 426
- Joined: Sat May 24, 2008 2:16 am
- Contact:
Re: @font-face
Perfect! That's exactly how to do it. Now it will display properly in all scenarios.
Re: @font-face
Hello there and thanks for the question. I am not sure if I understand you. do you have skype? if so please add reza__admin (there are 2 underscores) or email me your full request to virtualdesigners@london.comiNsaneOS wrote:This is working for headers and text and such in 8.5.7, but is there any way to use a non web-safe font in a marquee? I really need this. I've been developing websites for nearly 10 years now, but I know nothing about CSS. I'm outdated. Thanks a lot to whoever can help me.
Reza
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!
Web Design and Search Engine Optimisation
Http://www.SEO25.com
Free URL Rate & Site Value Tool - Free Search Engine Submission!