Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

only seeing some FA Pro icons after update to 4.7 #170

Open
dylanmcleod opened this issue Mar 19, 2019 · 32 comments
Open

only seeing some FA Pro icons after update to 4.7 #170

dylanmcleod opened this issue Mar 19, 2019 · 32 comments

Comments

@dylanmcleod
Copy link

Hi,

I can't seem to get the FA Pro fonts to work properly since updating to 4.7. After updating, I went to add an icon and all the fonts I'd installed were missing.

I've followed the steps as listed here which previously worked with the pro icon set.

I seem to be able to pull through some of the icons for each weight as shown here but am still missing a lot of the icons in the SVG fonts.

Thanks.

@keremciu
Copy link
Owner

hello @dylanmcleod

I didn't change anything related to fonts in 4.7 but can you describe me more about your case right now? cause it looks like you need to install your ttf or otf file again, I'm preparing 4.8 for font-awesome pro icon support then you don't need to change font names but yes this is not related to don't show some icons properly

Cheers,

@adamkool
Copy link

@keremciu I have the exact same problem. I see the exact same limited icon set as @dylanmcleod posted.

@dylanmcleod
Copy link
Author

i've tried activating both TTF and OTF font files and get the same issue, should it be one or the other or are both fine to use? your video which shows how to install the font bundle shows you installing an OTF font, but the video that shows how to install pro icons shows TTF...

i've now uninstalled the plugin, reinstalled with the original font bundle (which works, but with some missing icons), updated the SVG fonts as per your video, installed them via the plugin and tried activating both OTF and TTF fonts to no avail...

@keremciu
Copy link
Owner

@dylanmcleod ttf or otf there's no big difference between them in this case. I will gonna try to uninstall everything and install again maybe I could reproduce this case then I will write here

@mamuts12
Copy link

Font-Awesome-5.zip

Had the same issue with font awesome 5 not all icons were appearing after looking for solutions found one at http://fontello.com/ by using font awesome 5 given svg's and creating a new ttf file from the site.

Simply drag the given svgs from free or pro version into the website, name the font and download.
Works with all svg's.

Once unzipping the folder download created ttf to you're font book and import the font with the svg.
All icons should appear at the end.

Attached Working Font Awesome 5 Free icon set that contains all versions Brand+Solid+Regular.

@frankparadiso
Copy link

Hey @keremciu,
same for me. After I've updated the plugin, I lost ALL THE FONT.

BTW, thank you for your work. ❤️

@keremciu
Copy link
Owner

@mamuts12 thank you so much for sharing, I think I'm gonna put free font-awesome 5 files into main-font-bundle to help people cause many people are trying to use them and having problems.

@frankparadiso sorry to hear that, I wrote this one into readme file:

⚠️ BEFORE UPDATE: If you're using custom icon fonts, please export your font bundle like this: VIDEO then update the plugin, you can install the your custom-font-bundle without losing your custom fonts.

but of course this plugin needs to update the way of handling icons. I'm so surprised people following a lot of instructions to use this one. I wasn't using it really last 2 years that's why I couldn't put any effort to update it but I'm gonna update it soon to make it simple.

My plan is get rid of these ttf and otf file handling, just using SVG files of icon-fonts. Let's see

@frankparadiso
Copy link

frankparadiso commented Mar 20, 2019

@keremciu oh, great! I missed it. Why don't you add this warning to version 4.7 section (here)?
Maybe it's more visible.

I can't live without this plugin. Seriously!
I understand what do you mean. Every FA PRO update it's a war!
I commented with a fix in another issue too.

@adamkool
Copy link

Where can I get past versions?

@keremciu
Copy link
Owner

@adamkool past versions of the plugin? https://github.com/keremciu/sketch-iconfont/releases or font-awesome?

@keremciu
Copy link
Owner

@frankparadiso perfect! this words keeps me work on more :) thank you

actually this readme file is garbage, I need to make CHANGELOD.md for this version updates. I hope I will make a solution for all of this font-awesome pro problems soon

@adamkool
Copy link

@keremciu That's what I was looking for. I wanted to try some older versions to see if they worked with FA 5 Pro. Unfortunately it didn't work.

@frankparadiso
Copy link

frankparadiso commented Mar 20, 2019

Hey @adamkool,
it works with FA PRO, I use it with FA PRO on a daily basis.
Only a little work around:
(my)solution
and, in general:
issue#30

Does it solve your issue?

@adamkool
Copy link

@frankparadiso I have update the names in the SVG files as I normally have when using FA Pro. I've been using it for a year without a problem and it stopped working. I onboarded a new employee and he has the same issue right out of the gate. I'm using FA Pro 5.7.2

@mamuts12
Copy link

@adamkool adjusted font awesome 5 pro light mind testing this if it still doesn't work for you.
Simply install the font and import SVG
font-awesome-5-pro-light.zip

@dylanmcleod
Copy link
Author

thanks for your workaround @mamuts12...it's working perfectly for me.

thanks for your help too @keremciu and for the awesome plugin! i use it daily so would be nice if there was a fix for the importing issue but understand your busy!

@keremciu
Copy link
Owner

@adamkool did you try to use fontello solution? I think your installed ttf files doesn't match with svg icon aliases and it could be a problem. There's no change to import fonts

@frankparadiso
Copy link

frankparadiso commented Mar 21, 2019

@adamkool I think you are right. 😢
After dozens of attempts, I'm stuck in this situation:

FA

I'm using:
<font id="Font Awesome 5 Pro Light" horiz-adv-x="512" > <font-face font-family="Font Awesome 5 Pro Light" font-weight="300" font-stretch="normal" units-per-em="512" panose-1="2 0 3 3 0 0 0 0 0 0" ascent="448" descent="-64" bbox="-0.124756 -66.9502 672 448.15" underline-thickness="25" underline-position="-51" unicode-range="U+0020-F833" />
and .otf font and FA PRO 5.7.2.

@keremciu any ideas? Does it work on your side?

p.s. I also tried Fontello but the website crashed.

@adamkool
Copy link

adamkool commented Mar 21, 2019

@mamuts12 That works. How did you get that working? I noticed that the formatting of the code is much different than what you get from Font Awesome

@keremciu The Fontello option works, but I can't easily replace one font with the other in sketch. Just dumps in a [?] for all the icons.

@frankparadiso Here is the Fontello version of the light icon set if needed. No matter what I try with the Font Awesome files, I get the exact result that you posted.
fontello.zip

@frankparadiso
Copy link

@adamkool the only solution for me is to roll back to FA PRO 5.6.1. I think that is something related to font, .otf and naming. It's related to font itself not to the plugin. So weird.

@mamuts12
Copy link

mamuts12 commented Mar 21, 2019

@adamkool It's actually very simple came across a platform called fontello that converts svgs into a font. Posted a short tutorial above where font-awesome-5.zip is contained.

If it's still unclear will make a video on it

@frankparadiso Fontello didnt crash for me even if i tried 1500+ icons. It just loads slowly and might show that it stopped but after a while it will load the svg's or select all svgs that were selected

@adamkool
Copy link

adamkool commented Mar 21, 2019

@mamuts12 I know how to get it all working, but the way you formatted it, it doesn't match with older versions of the font naming (probably a Fontello limitation?)

@frankparadiso Thanks for the heads up about rolling back to 5.6.1. I've done that for now and will probably send an email over to Font Awesome asking what they changed.

@mamuts12
Copy link

mamuts12 commented Mar 21, 2019

@adamkool Yeah it seems to be Fontellos limitations.
Buuuuuut did some digging and found a possibly better version of Fontello called IconMoon which allows you to change names without limitations and edit your current font made from IconMoon in the future.

And better icon import handling

@frankparadiso
Copy link

@adamkool my two cents, you are welcome! Please, keep us updated about FA answer.
BTW, after another hour of trying, I packed all my patience and I converted all the font with Fontello (following @keremciu's tutorial and @mamuts12's hint).

@keremciu
Copy link
Owner

@frankparadiso @adamkool oh yes maybe they changed the alias and that's why there's this problem. It makes sense. I can make it programmatically but I need names likes what alias are you using 5.6.1 in what's not working with the new one? then I can start digging to build a update solution for this case

@username1290
Copy link

username1290 commented May 25, 2019

one way could be using the Postscript name, that would help settle on what names to use for ID/font-family inside the SVG.
Also, that could help avoid the issue of repeated names in the ID, something common in Font Awesome.

@frankparadiso
Copy link

@sogen so there isn't a solution that doesn't involve using Fontello? 😕

@keremciu
Copy link
Owner

@frankparadiso the problem is matching pro font family name with system font family name, we can try some try/learn cases if you want. I can send you different plugin versions with different system font-family matchings maybe one of them works and everyone can use it.

If you'd like to involve you can just me an e-mail with possible system font-family. after installing pro font to your mac, you can send me the screenshot of your font book result which shows that new font.

@username1290
Copy link

@frankparadiso not that I know so far, you'd have to repeat the steps to keep font awesome for every new FA release.

@keremciu
For FAv5, they seem to have settled on using a PS name without spaces:
FontAwesome5Pro-Regular
FontAwesome5Pro-Solid

Font Awesome Pro Regular:

	PostScript name	FontAwesome5Pro-Regular
	Full name	Font Awesome 5 Pro Regular
	Family	Font Awesome 5 Pro
	Style	Regular
	Kind	OpenType PostScript
	Language	Asu, Bemba, Bena, Cebuano, Chiga, Cornish, English, Gusii, Ido, Indonesian, Interlingua, Jju, Kalenjin, Kinyarwanda, Lojban, Luo, Luyia, Machame, Makhuwa-Meetto, Makonde, Malay, Morisyen, North Ndebele, Nyankole, Oromo, Rombo, Rundi, Rwa, Samburu, Sangu, Shambala, Shona, Soga, Somali, South Ndebele, Southern Sotho, Swahili, Swati, Taita, Taroko, Teso, Tsonga, Vunjo, Xhosa, Zulu
	Script	Latin
	Version	330.241 (Font Awesome version: 5.10.1)
	Location	/Users/myusername/Library/Fonts/Font Awesome 5 Pro-Regular-400.otf
	Unique name	Font Awesome 5 Pro Regular-5.10.1
	Copyright	Copyright (c) Font Awesome
	Description	The web's most popular icon set and toolkit.
	Enabled	No
	Duplicate	No
	Copy protected	No
	Glyph count	1,715

Font Awesome Pro Solid

	PostScript name	FontAwesome5Pro-Solid
	Full name	Font Awesome 5 Pro Solid
	Family	Font Awesome 5 Pro
	Style	Solid
	Kind	OpenType PostScript
	Language	Asu, Bemba, Bena, Cebuano, Chiga, Cornish, English, Gusii, Ido, Indonesian, Interlingua, Jju, Kalenjin, Kinyarwanda, Lojban, Luo, Luyia, Machame, Makhuwa-Meetto, Makonde, Malay, Morisyen, North Ndebele, Nyankole, Oromo, Rombo, Rundi, Rwa, Samburu, Sangu, Shambala, Shona, Soga, Somali, South Ndebele, Southern Sotho, Swahili, Swati, Taita, Taroko, Teso, Tsonga, Vunjo, Xhosa, Zulu
	Script	Latin
	Version	330.241 (Font Awesome version: 5.10.1)
	Location	/Users/myusername/Library/Fonts/Font Awesome 5 Pro-Solid-900.otf
	Unique name	Font Awesome 5 Pro Solid-5.10.1
	Copyright	Copyright (c) Font Awesome
	Description	The web's most popular icon set and toolkit.
	Enabled	No
	Duplicate	No
	Copy protected	No
	Glyph count	1,715

I don't use the other ones (brands, duotone, light), but let me know if you'd like those too.

@keremciu
Copy link
Owner

keremciu commented Oct 19, 2019

@sogen
actually I'll try to make new versions just adding conditions here

maybe it would work with adding below line but yes, there're a lot of possibilities, first we need to match what's fontname when we import that font and then we just need to find fontname for sketch typography tool.
if (fontname == "fontawesome5proregular") fontname = "FontAwesome5Pro-Regular"
https://github.com/keremciu/sketch-iconfont/blob/master/iconfont.sketchplugin/Contents/Sketch/const/import.js#L17

@frankparadiso
Copy link

Hey @keremciu, I really appreciate your support and sure, tell me what I can do and I'll do it.
I just sent an email at address I found on you git GitHub profile (is it correct?). Hope it helps.
And please, keep us updated. Thank you again. 🙇

@sogen same here! The point for me is avoid using Fontello because, you know, it's slow and a little bit frustrating.

@keremciu
Copy link
Owner

hi @frankparadiso I sent an e-mail to yours, I just discontinued to use info@kerem.ws e-mail, sorry about this inconvenience situation.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants