[TH] Fonts Manager [Deleted]

[BobbyWibowo]

That's the option. The attached link tag for the editor looks like this:

https://fonts.googleapis.com/css?family=Exo%3A300%2C400%2C700%7CMontserrat%3A400%2C700%7CMontserrat%7CExo

It has the same content as:

https://fonts.googleapis.com/css?family=Montserrat:400,700|Exo:300,400,700

So I guess that'll do for now. Thanks!

 

[m1ne]

Anyone got this working with tinymce?

 

[Lukas W.]

Anyone got this working with tinymce?

There's no code included for TinyMCE and I had no plans to include it in the future (until maybe some more request this), sorry.

 

[KeVo]

Would anyone happen to know how to get Century Gothic font added into here? I can't quite seem nail it like it is on vBulletin or other forum software.

 

[BobbyWibowo]

@KeVo

Look for Century Gothic in that screenshot and copy the settings you need.

 

[KeVo]

@KeVo
View attachment 134238
Look for Century Gothic in that screenshot and copy the settings you need.

Thank you so much, @BobbyWibowo!

 

[Neutral Singh]

@katsulynx

How do i activate the add font button, currently i only see Edit Mode button... Thank you

 

[Dadparvar]

There isn't any add font button.
When you add a font in last empty field and save it, it will add new empty field.

 

[Neutral Singh]

Oops! in the add-on overview page, i saw an attached image which shows a Add Button...

 

[Neutral Singh]

For example, at the following page:
http://www.sikhphilosophy.net/pages/download-gurmukhi-fonts/

I want to install the GurbaniAkhar Font... how should i add it...

How do i find the Font Stack?
Font Type?
How would i know that it is a google webfont?
What is a local font?
What is a custom font?

My apologies for too many questions...

Thanks for the help.

 

[BobbyWibowo]

How do i find the Font Stack?

Font stack is pretty much the list of font families that you want to use. Read this short answer in Stack Overflow to get the gist of it.

Font Type?

Use "Custom Font" if you want to use font names that weren't available in XenForo by default, but you are sure that it'll be universally available in your visitors' PC. You can take Comic Sans font as an example, I'm pretty sure it's available universally (don't quote me on this). If you want to use your own font, then choose "Local Font". After that you'll have to upload the font files. And if you want to use Google Font, then choose "Google Webfont". The add-on will automatically add the necessary code for the font to be embedded in your site.

How would i know that it is a google webfont?

You'd know that it was a Google Font if you had found the font in Google Fonts.

What is a local font?
What is a custom font?

See my answer to the previous quotes.
Also, this is just a guess, but it may be better to manually add "local font", like, by providing multiple types of the fonts (truetype, woff, etc?) for browser compatibility. That's just a guess though. My knowledge in web fonts is pretty outdated.

 

[Lukas W.]

Font Type?

See below.

How would i know that it is a google webfont?

Google Webfonts is a service, that provides free fonts for use on your websites. They are served from the google webserver to your client, so your website traffic is not increased, but the page load time for your users is.

What is a local font?

A local font is a font that you provide locally from your server. It has to be in .woff-Format, cause I was too lazy and not skilled enough to do any type of conversion for that. .WOFF is the most widely recognized format together with .TTF (which is inferior to .woff) and works with all modern browsers. Various fonts can be found throughout the web and you can upload them to your server.

What is a custom font?

Custom fonts are fonts, that are already available to the users system, so the only thing your website has to do is to request them. A list of Web Safe Font Stacks can be found here.

 

[Ahtsham Jutt]

How to upload new custom font? I cant fine the option.

 

[Lukas W.]

Select "Local Font" from the dropdown on the last entry in the font list (Javascript needs to be enabled).

 

[BobbyWibowo]

There's no code included for TinyMCE and I had no plans to include it in the future (until maybe some more request this), sorry.

(until maybe some more request this)

+1 request, lol

also, ref here for quicker implementation

 

[Lukas W.]

That seems fairly easy, I'll see that I can add it for the next version.
On a side note: I'm currently reworking the interface to make it easier to understand and better to handle.

 

[Lukas W.]

Some Previews of what I have been working on the last days:


I'm glad that I finally got the upload troubles sorted out. Also you will now be able to add multiple fonts at once and I tidied up the interface.
Don't worry if something in the interface doesn't seem clear now, there'll be enough explanation.
I yet have to revamp the Webfonts list in a similar way, so it may take a few more days before the update goes live (testing and stuff included).

 

[BobbyWibowo]

Oh nice, preview of the font stack as well, lol
Will you still make it possible to do this though? I see that the Google Fonts option will now have the ability to choose the font style (bold, italic, etc.), but I'm concerned that the order of the font size differs on the CSS URL. You know, that 400,700 part in Montserrat:400,700, for example. Though I suppose they would always be ordered from smallest to highest and that you would code the add-on to do exactly that.
Anyway, good job there. Can't wait. And don't forget about the integration with TinyQuattro when you have the time

 

[Lukas W.]

The order does not matter, but they're sorted ascending either way.
Don't worry about the TinyMCE-Thingy, that'll be done in (comparatively) no time.

Spoiler

 

[Lukas W.]

On a quick side note: Fonts on the front end will also be cached now, so there will no longer be any extra database call everytime a user loads a page.