Results 1 to 37 of 37

Thread: Web fonts & Font Mapping

  1. #1
    Axure Support/Admin
    Join Date
    Jul 2011
    Location
    San Diego, CA
    Posts
    1,668
    Thanks
    264
    Thanked 622 Times in 307 Posts


    Post Web fonts & Font Mapping

    Add a web font with your prototype by following these simple instructions! We'll use the free Google Fonts service in this example:

    Webfonts

    1) Search for the web font you want to use (check out Google Fonts). Select the font by clicking the red "+" button.

    Name:  Plus.png
Views: 10026
Size:  14.0 KB

    2) A black notification bar will appear at the bottom of the page, indicating "1 Family Selected". Click the notification to expand the options, and then copy the embed URL presented.

    Name:  FontURL.png
Views: 10131
Size:  50.6 KB


    3) In Axure RP, open up the Generate HTML dialog ("Publish > Generate HTML Files"), and select Web Fonts. Click the green "+" icon, then name your font and paste the URL.

    Name:  HTML.png
Views: 10154
Size:  30.7 KB


    4) Google also provides a local download for the font, which you can get by clicking the download icon shown below. After you restart Axure RP, the font will be listed in the font drop-down. When you apply that font to text in Axure and generate the HTML, the web font will be used to render it in the browser.

    Name:  Download.png
Views: 10087
Size:  21.0 KB


    Font Mapping (optional)

    You can also choose to map a different font in your prototype to the web font. For example, you can make all the text with Arial generate to the web font.

    1) Open the "Font Mappings" tab in the HTML generator, then press the green "+" icon and select the font that you want to have replaced by your webfont when generated. Enter the name of the webfont.

    Name:  FontMapping.png
Views: 10097
Size:  29.4 KB

    ---

    (Update) In conclusion, check out this cool use (and library)... Font Awesome!
    Last edited by Alex Axure; 08-26-2016 at 05:35 PM. Reason: Google Fonts update

  2. The Following 8 Users Say Thank You to Paul Axure For This Useful Post:

    borryshasian (07-01-2013), brianinseattle (10-02-2013), desk (04-11-2015), Jenn (10-13-2014), l-i-n-k (12-12-2013), lemon (07-08-2013), Philippe Billon (07-02-2013), Scrappy (11-14-2016)

  3. #2
    Apprentice Level
    Join Date
    Dec 2012
    Location
    London
    Posts
    47
    Thanks
    5
    Thanked 3 Times in 3 Posts


    Is there anyway to include and use an icon font like Entypo?

  4. The Following User Says Thank You to artdog For This Useful Post:

    chriscavallucci (07-10-2013)

  5. #3
    Apprentice Level
    Join Date
    Nov 2008
    Posts
    19
    Thanks
    0
    Thanked 1 Time in 1 Post


    Quote Originally Posted by artdog View Post
    Is there anyway to include and use an icon font like Entypo?
    Vote for icon font, too.

  6. #4
    Apprentice Level
    Join Date
    Feb 2011
    Location
    Baltimore, MD
    Posts
    95
    Thanks
    2
    Thanked 35 Times in 22 Posts


    My Twitter
    I tried a few ways to setup Entypo and Font Awesome, but every time I would paste an icon—specifically from Font Awesome—Axure would crash. I'm hoping there's a way around this.
    --
    Panayiotis Karabetis : Director of Ux @ LMO Advertising

  7. #5
    Apprentice Level
    Join Date
    May 2012
    Location
    Elkins Park, PA
    Posts
    25
    Thanks
    41
    Thanked 7 Times in 4 Posts


    My Twitter
    I'm using icomoon.io which includes the FontAwesome library. I agree that icon fonts are a good way to go.

  8. #6
    Axure Fu Master
    Join Date
    Jun 2012
    Location
    Manchester, UK
    Posts
    143
    Thanks
    17
    Thanked 15 Times in 12 Posts


    Sync Webfonts to your computer

    Just trying out web fonts, I found this useful: Download Google Fonts - Fonts.com

    SkyFonts - automatically syncs Google fonts to your computer so you can see them in Axure itself too.

    The only complication now is you can't tell if you're seeing the webfont or the local font in the prototype until you view it on your phone or something.

    But it looks like if you have the font locally and use it in Axure, the Font Mapping step isn't required - can you confirm this is the case, Paul?
    Last edited by Milkbomb; 07-15-2013 at 04:13 AM.

  9. #7
    Apprentice Level
    Join Date
    Oct 2012
    Location
    Munich
    Posts
    28
    Thanks
    1
    Thanked 7 Times in 2 Posts


    Quote Originally Posted by artdog View Post
    Is there anyway to include and use an icon font like Entypo?
    Does anyone now how this works, the complete workflow to include a special fonts, which is installed on my computer?
    It seems that the options in the "Web font" dialogue doesn't work.

    Is this the only solution:
    http://www.axure.com/forum/tips-tric...nts-axure.html

    This solution doesn't work on Axure Share!
    Are there any better solutions?

    Since "Render text as images" is not available for new axure files, i can not present any wireframe with special fonts to my clients (who haven't installed the fonts on their computer).

    Please help!

    Martin
    Last edited by fishmi222; 07-16-2013 at 11:31 PM.

  10. #8
    Axure Fu Master
    Join Date
    Jun 2012
    Location
    Manchester, UK
    Posts
    143
    Thanks
    17
    Thanked 15 Times in 12 Posts


    No, Fishmi222 - in the v7 Beta it is the simple process detailed above and only works with web fonts, not local fonts.

    The only additional step is to install the font locally if you want to see it in Axure itself - as I understand it.

  11. #9
    Apprentice Level
    Join Date
    Oct 2012
    Location
    Munich
    Posts
    28
    Thanks
    1
    Thanked 7 Times in 2 Posts


    Milkbomb, thanks for your answer.

    The problem is, that we are using special fonts to show icons and pictures.
    We don't want to convert these fonts into images, they should remain scalable for adaptive views.

    Is there any possibility to use these fonts in Axshare?

    The most important question would be:
    Can we use converted Fonts (for font-face) from our own server in Axshare?

    I have tried the options with "Web Font", but without success.

    Thanks for your help.

    Martin

  12. #10
    Axure Fu Master
    Join Date
    Jun 2012
    Location
    Manchester, UK
    Posts
    143
    Thanks
    17
    Thanked 15 Times in 12 Posts


    You'd need to convert your fonts to web fonts and put them on a webserver somewhere. Then you could refer to them in the same way as Google Fonts above.

    Probably.

  13. The Following User Says Thank You to Milkbomb For This Useful Post:

    jimparrillo (04-07-2016)

  14. #11
    Apprentice Level
    Join Date
    Oct 2012
    Location
    Munich
    Posts
    28
    Thanks
    1
    Thanked 7 Times in 2 Posts


    Quote Originally Posted by Milkbomb View Post
    You'd need to convert your fonts to web fonts and put them on a webserver somewhere. Then you could refer to them in the same way as Google Fonts above.

    Probably.
    It is unbelievable, but i have found a solution for showing special fonts on Axshare!
    Yes, it works.

    1.
    First open Create Your Own @font-face Kits | Font Squirrel, upload your font(s), use "Optimal settings" and download the generated ZIP file.

    2.
    The most important step:
    Generate your Prototype with Axure on a local Machine where all your special fonts are installed!
    "Render Text as images" must be disabled under "Advanced" (if this function is available, at this time not in new Beta 7 Files)
    Open the prototype with Firefox and Firebug Extension.
    Select with Firebug the Text with the special fonts.

    In the Style pane you see something like that:
    #u128 {
    font-family: 'wmpeople1 Regular','wmpeople1';
    font-size: 220px;
    }

    Copy the second, short value of font-family, in this case "wmpeople1".

    Open the CSS File in the folder of the generated Fonts (from Fontsquirrel).
    Replace the copied font-family name at two places (Bold):

    font-family: 'wmpeople1 regular';

    url('wmpeople1-webfont.svg#wmpeople1 regular') format('svg');

    After that the example should look like this:

    font-family: 'wmpeople1';

    url('wmpeople1-webfont.svg#wmpeople1') format('svg');

    Save the CSS File.

    If you want to use more than one special fonts, copy all the generated fonts to one folder and combine all CSS-Files in one CSS file.
    For each fonts must be a @font-face declaration with the correct font-family name!

    3.
    Transfer the folder with the CSS and the generated fonts files to a server of your choice

    If you want to show the special fonts in Firefox you have to create an .htaccess File with this content:

    <FilesMatch "\.(ttf|otf|eot|woff)$">
    <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
    </IfModule>
    </FilesMatch>

    Copy this .htaccess File in the same Folder on your Server (only in the folder with the css and the fonts files)

    Get (copy) the Link (the URL) to the CSS File, e.g.

    http://www.yourdomain.de/specialfonts/stylesheet.css


    4.
    Open your Axure File.
    Klick F8 and in the opend dialog "Web Fonts"
    Check "Include Webfonts"
    Click the Plus Icon
    Name doesn't matter
    Paste your Link (URL) to the CSS File in the field "URL".
    Click "Generate" (or close the dialog)

    5.
    Publish your Axure File on Axshare
    And now, hopefully everything works :-)



    Martin
    Last edited by fishmi222; 07-26-2013 at 06:02 AM.

  15. The Following 3 Users Say Thank You to fishmi222 For This Useful Post:

    jimparrillo (04-07-2016), Julia (07-18-2017), Sasja (08-19-2013)

  16. #12
    Apprentice Level
    Join Date
    Nov 2008
    Posts
    19
    Thanks
    0
    Thanked 1 Time in 1 Post


    My vote for icon fonts, too.

  17. #13
    Newbie Level
    Join Date
    Aug 2010
    Posts
    4
    Thanks
    2
    Thanked 0 Times in 0 Posts


    Use Axure 7's font embedding capabilities and link to one of the web hosted icon fonts available via We Love Icon Fonts.
    For example, for Entypo use "http://weloveiconfonts.com/api/?family=entypo"

  18. #14
    Axure Fu Master
    Join Date
    Mar 2012
    Location
    San Francisco
    Posts
    137
    Thanks
    1
    Thanked 13 Times in 12 Posts


    My LinkedIn
    im using font-awsome without any issues, works great.
    Our company always uses Myriad pro font and since it's not native to tablets, we use to use a hack to get it to work, but now with the new function it makes it so much easier to accommodate this.

  19. #15
    Apprentice Level
    Join Date
    Sep 2009
    Posts
    30
    Thanks
    5
    Thanked 1 Time in 1 Post


    Serious issue using the @font-face option in the Web Fonts dialog

    Hi there,

    Currently using Axure 7.0.0.3127, I have a serious issue using the @font-face option in the Web Fonts dialog (under Generate prototype). I hope someone can tell me what I do wrong:

    I recently discovered the Redacted font, a 'scribble'-font which makes text a step more abstract than the usual Lorem Ipsum tekst does (especially the combination of Lorem Ipsum rendered in Redacted does a good job). On Github.com, I found a zip file. This file contains 4 fonts (redacted-regular, redacted-script-bold, redacted-script-light and redacted-script-regular) in 4 different file formats (eot, svg, ttf and woff) and a css file.

    I placed the 4 ttf fonts in my Windows font directory, and the fonts appear in Axure as 2 fontnames: Redacted and Redacted Script.

    I made some tests to have both fonts with their variations on the page; which of coarse renders fine locally.
    In meanwhile I uploaded all 16 fonts (4 fonts in 4 formats) to mywebsite.ext/font directory.

    The css file(from the downloaded zip) looks like this:
    @font-face {
    font-family: 'redactedregular';
    src: url('redacted-regular.eot');
    src: url('redacted-regular.eot?#iefix') format('embedded-opentype'),
    url('redacted-regular.woff') format('woff'),
    url('redacted-regular.ttf') format('truetype'),
    url('redacted-regular.svg#redactedregular') format('svg');
    font-weight: normal;
    font-style: normal;
    }
    @font-face {
    font-family: 'redacted_scriptbold';
    src: url('redacted-script-bold.eot');
    [... etcetera for the other formats ...]
    }
    @font-face {
    font-family: 'redacted_scriptlight';
    src: url('redacted-script-light.eot')
    [... etcetera for the other formats ...]
    }
    @font-face {
    font-family: 'redacted_scriptregular';
    src: url('redacted-script-regular.eot');
    [... etcetera for the other formats ...]
    }

    First, I changed " src: url(' " everywhere into " src: url('http://www.mywebsite.ext/font/ ".

    Then I added 4 times a new Web Font (+ symbol) in the Web Fonts dialog;

    Named it redactedregular (redacted_scriptbold, redacted_scriptlight and redacted_scriptregular - the names appearing as font-family names);

    Then I choose the @font-face option and;

    Filled out:
    @font-face {
    font-family: 'redactedregular';
    src: url('http://www.mywebsite.ext/font/redacted-regular.eot');
    src: url('http://www.mywebsite.ext/font/redacted-regular.eot?#iefix') format('embedded-opentype'),
    url('http://www.mywebsite.ext/font/redacted-regular.woff') format('woff'),
    url('http://www.mywebsite.ext/font/redacted-regular.ttf') format('truetype'),
    url('http://www.mywebsite.ext/font/redacted-regular.svg#redactedregular') format('svg');
    font-weight: normal;
    font-style: normal;
    }

    (... and filled out the same @font-face declaration for the other 3 fonts)

    Finally I published the file to Axshare, but unfortunatally, no custom fonts showed up.

    Anybody an idea what goes wrong?
    Thanks in advance.

    regards,
    Igor

  20. #16
    Apprentice Level
    Join Date
    Dec 2012
    Location
    London
    Posts
    47
    Thanks
    5
    Thanked 3 Times in 3 Posts


    I think part of the problem with using standardized icon fonts is that they will put the icons in the private use area. In this case how would you type the character in Axure? There would need to be some mechanism to insert a unicode character wouldn't there?

    I will try to create a custom font with the icons mapped to letters but I am not hopeful this will work either.

  21. #17
    Apprentice Level
    Join Date
    Aug 2012
    Location
    United States
    Posts
    36
    Thanks
    10
    Thanked 3 Times in 1 Post


    My Twitter My LinkedIn
    These instructions start in the middle....

    I don't see any "quick use" button anywhere.

    I just want to be able to use icomoon! Help?

  22. #18
    Sifu
    Join Date
    Sep 2008
    Location
    Minnesota
    Posts
    1,178
    Thanks
    83
    Thanked 384 Times in 271 Posts


    My LinkedIn
    Hi, kblock111. The "quick use" button is on Google Fonts, on pages like this one:

    https://www.google.com/fonts

    Jeff
    Jeff Harrison
    Axure Trainer at Evantage Consulting

  23. #19
    Axure QA Manager
    Join Date
    Dec 2012
    Location
    San Diego, CA
    Posts
    660
    Thanks
    129
    Thanked 178 Times in 135 Posts


    Hey Kblock,

    A quick heads-up if you're going to be using icoMoon: icoMoon doesn't do a good job of telling us which font it wants to be on the Mac, so to use it on the Mac you'll need to:

    1. Copy your glyph.

    2. Paste it into Axure RP.

    3. Highlight the glyph.

    4. Apply icoMoon to the glyph.

    On PC it should be a bit smoother. We're looking into ways to improve the workflow on the Mac, but we want to make sure that we don't introduce other font bugs in doing so.

  24. #20
    Apprentice Level
    Join Date
    Aug 2012
    Location
    United States
    Posts
    36
    Thanks
    10
    Thanked 3 Times in 1 Post


    My Twitter My LinkedIn
    I"m on a pc at work. Icomoon isn't on Google so I guess I'm still unsure if there is a way to get it into Axure?

  25. #21
    Apprentice Level
    Join Date
    May 2012
    Location
    Chicago
    Posts
    94
    Thanks
    69
    Thanked 8 Times in 6 Posts


    Can someone update this, all the images are broken.

  26. #22
    Axure QA
    Join Date
    Jul 2014
    Location
    San Diego, CA
    Posts
    261
    Thanks
    11
    Thanked 67 Times in 50 Posts


    Hey gothate,

    I'm not seeing any broken images--are they still appearing as broken for you? If so, are you referring to the screenshots from Paul's original post in this thread?

    Update: Ah, looks like I have a cached version of this thread, which is why I didn't see the problem at first. I am, however, seeing the same issue you described in a different browser. Thanks for the heads up! We'll look into this and get it fixed.

    Update: Alright, this should be all fixed up now!
    Last edited by Julie Axure; 07-28-2014 at 03:29 PM. Reason: Added update

  27. The Following User Says Thank You to Julie Axure For This Useful Post:

    gothate (07-29-2014)

  28. #23
    Apprentice Level
    Join Date
    Aug 2013
    Location
    Costa Mesa, CA, USA
    Posts
    66
    Thanks
    10
    Thanked 2 Times in 2 Posts


    My Twitter My LinkedIn
    What's up with Axure spitting out weird CSS for fonts?

    I can't get fonts to show up properly on Chrome. Firefox seems to generate the proper fonts for now, but this used to work for Chrome, and I haven't changed any of my font settings.

    Attaching screenshots of code Axure is spitting out. Not sure why it's selecting weights of 400 and 600, since my font doesn't have that available, and I don't have that weight selected anywhere.

    Name:  Screen Shot 2014-09-04 at 9.24.35 AM.png
Views: 29379
Size:  16.6 KBName:  Screen Shot 2014-09-04 at 9.24.43 AM.png
Views: 29301
Size:  17.5 KB

  29. #24
    Axure QA
    Join Date
    Jul 2014
    Location
    San Diego, CA
    Posts
    261
    Thanks
    11
    Thanked 67 Times in 50 Posts


    Hi Erick,

    Macs handle fonts in a particular way, so font weight conversions are a bit of an inexact science. Because of this, the best solution is to use web fonts and font mapping when an exact match is necessary.

    For your situation, you'd want to use the font mapping feature to map your font to its font-family (Museo Sans 700) and the font-weight 700. That should take care of things so you don't see unexpected weights in the output.

  30. #25
    Apprentice Level
    Join Date
    Oct 2015
    Posts
    14
    Thanks
    6
    Thanked 4 Times in 4 Posts


    Font-Awesome blank square in Condition Builder

    Hello,

    Im not sure if this belongs here or as a new post.

    I have successfully gotten Font-Awsome onto my computer's Font folder as well as into my Axure Library. I have no problem with them rendering or using them in my prototypes, screens etc.

    The issue I am having is in the "Widget Interactions" and the "Condition Builder". Font-Awesome appears as blank squares. This is problematic when i want to perform an interaction based on the "icon".

    For example, if text = "^" then set widget to "true".

    I have seen lots of "blank square" issues, but none that address the font-awesome not appearing in the Condition Builder.

    Thanks in advance!

    Name:  fa.png
Views: 16812
Size:  74.1 KB
    Attached Images Attached Images  
    Last edited by trillaggee; 01-14-2016 at 04:37 PM. Reason: forgot to add title and image

  31. #26
    Axure Support/Admin
    Join Date
    Jul 2014
    Location
    San Diego
    Posts
    1,344
    Thanks
    85
    Thanked 204 Times in 199 Posts


    Hi trillaggee,

    Thanks for following up on this. Currently I'm afraid rendering the icons in the conditional builder isn't supported, but we've logged similar feature requests lately, and yours definitely hasn't gone unnoticed. Though interactions seem to be correctly governed by the copied-and-pasted icon in the condition, showing an actual representation of the icon in the condition builder isn't available at the moment. We'll look into this!

  32. The Following User Says Thank You to Alex Axure For This Useful Post:

    trillaggee (01-19-2016)

  33. #27
    Apprentice Level
    Join Date
    Oct 2015
    Posts
    14
    Thanks
    6
    Thanked 4 Times in 4 Posts


    Thank you for responding!

    Has a suggestion of having the font-awesome item "pop up" on a hoverover in the "Conditional Builder" and/or "Widget Interactions"?

    Essentially the same functionality that is in the "Widget Manager".

  34. #28
    Axure Support/Admin
    Join Date
    Jul 2014
    Location
    San Diego
    Posts
    1,344
    Thanks
    85
    Thanked 204 Times in 199 Posts


    Quote Originally Posted by trillaggee View Post
    Thank you for responding!

    Has a suggestion of having the font-awesome item "pop up" on a hoverover in the "Conditional Builder" and/or "Widget Interactions"?

    Essentially the same functionality that is in the "Widget Manager".
    Hi trillaggee,

    Not off the top of my head, but it seems we've got a similar discussion going on in a related Feature Request thread: [Feature Request] Support webfont rendering in Interactions Panel

    Nonetheless, I'll log your request here--thanks!

  35. #29
    Apprentice Level
    Join Date
    Apr 2016
    Posts
    25
    Thanks
    3
    Thanked 1 Time in 1 Post


    Hi. I'm trying to follow this tutorial, but Google seems to have changed its system, to the point where Step #4 no longer works.

    The picture shows me clicking an icon with a downward pointing arrow on the Google site to download a local copy of the font that I can use in Axure. However, there are two problems with that:

    1. Google is urging me not to use the "Google Fonts" URL from Step 1, instead giving me a popup that says "A new version of Google Fonts is available. Take me there." If I go to the new URL, there is no Download button like the one in step 4.

    2. If I instead stay on the "old" page and click that Download icon, I get this popup message:

    Name:  Download Fonts message.png
Views: 10924
Size:  26.4 KB

    In case that image doesn't display correctly, the text says:

    ________________________________

    Download fonts

    You do not need to download the font to use it on your webpages. Instead, refer to the "Use" section.
    There are no fonts in your Collection yet.
    Sync Google fonts to your desktop using SkyFonts
    Download all font families, including source files, at the Google Fonts Github project
    ________________________________

    There doesn't seem to be a section on that page called "Use."

    I thought I should try SkyFonts, AKA Fonts.com, but heading off there, I got even more confused, trying to follow steps from this tutorial:
    10 steps to get Web Fonts in your Axure 7 prototype |

    Unfortunately, step 2 of that tutorial is "2. Create a project within your account," and I can't find any kind of "create a project" action on the Fonts.com site


    By now, I had wandered so far from these instructions that I thought I should come back here and ask: Is there an update? Is there some new way I can follow the intention of step 4 on this page?

    Thanks in advance.

  36. #30
    Axure Support/Admin
    Join Date
    Jul 2014
    Location
    San Diego
    Posts
    1,344
    Thanks
    85
    Thanked 204 Times in 199 Posts


    Hi there,

    Thanks for pointing out this step here as well. I see what you mean, and I'll log this discrepancy for our team to update. For now, I'll include a couple screenshots below:

    First, try adding the font to your collection, here:

    Screenshot | Add to Collection

    Then click Use or Review in the bottom pane, for the Collection entry:

    Screenshot | Review/Use

    Afterward, when you click the down-arrow button to download, an option to download a zipped archive ought to be presented in the pop-up.

    Hope this helps!

  37. #31
    Apprentice Level
    Join Date
    Apr 2016
    Posts
    25
    Thanks
    3
    Thanked 1 Time in 1 Post


    15-AUG-2016 FOLLOW-UP: THIS NO LONGER WORKS.

    It looks like the steps below won't work anymore.

    The steps involve going to "www.google.com/fonts" rather than "fonts.google.com." However, that first URL now simply forwards you to the second URL.

    I'll leave the steps below intact, in case they are helpful in some other way.

    _________________________________________



    Wow! Okay, I think you found a tricky path to the correct branch off the old fonts page, but it seems to work. It looks to me like these are the steps to take:


    How to download a Google font, without using SkyFonts:

    1. Use the *old* Google Fonts page: http://www.google.com/fonts/

    It will offer you a link which you have to ignore:

    Name:  1 bad link.png
Views: 10682
Size:  3.5 KB

    The link says: "A new version of Google Fonts is available. Take me there."
    And the link takes you to https://fonts.google.com/
    Don't click the link.

    2. Search for a font.

    3. (staying on the old version of the font site) Click "Add to Collection":
    2016-08-02_1518 - alexkuo's library

    Don't click the "Quick Use" button at this point, or you won't be offered a chance to download the zip. You will instead end up getting a popup message that says "You do not need to download the font..." that looks like this:

    Name:  2 two links.png
Views: 10701
Size:  19.5 KB

    (Note: That version of the popup does not let you download a zip file.)

    4. Having added the font to your collection, you can click either the Review or Use buttons at the bottom of the screen:
    2016-08-02_1528 - alexkuo's library

    5. Whichever button you clicked, it will take you to a page where you can find an Arrow button that means Download. It'll be there, somewhere toward the top right. When you click the arrow, you will still get a popup that says "You do not need to download the font..."
    However, you'll now see 3 choices rather than 2, the first choice being an option to download the zip file.

    Name:  3 three links.png
Views: 10702
Size:  22.1 KB


    6. What to do after downloading the zip? My experience is that I then:
    - move the font into the C:\Windows\Fonts folder,
    - double-click it, then
    - choose Install.

    When I *skipped* the "choose Install" step, the font DIDN'T show up, in either Microsoft Word or Axure.
    When I *performed* the "choose Install" step, the font DID show up, in both Microsoft Word and Axure.


    I'm going to try a few more tests, with double-clicking fonts that aren't yet in the C:\Windows\Fonts folder, and with moving fonts originally obtained thru SkyFonts to the C:\Windows\Fonts folder. I don't know if I should first copy the font, "uninstall" it, etc.

    So far, this is my working hypothesis:

    Windows can consider a font "installed" even if it is not in the C:\Windows\Fonts folder.
    Axure, however, will not. Axure needs the font to both be "installed" and be in the C:\Windows\Fonts folder.
    Last edited by Analytical Guy; 08-15-2016 at 03:09 PM. Reason: Correcting my instructions to say they no longer work

  38. The Following User Says Thank You to Analytical Guy For This Useful Post:

    jason.arnesen (11-15-2016)

  39. #32
    Apprentice Level
    Join Date
    Apr 2016
    Posts
    25
    Thanks
    3
    Thanked 1 Time in 1 Post


    I have a quick follow-up detail, for anyone who might be using SkyFonts. I suppose this might pertain to certain others who have a font on their system that's not showing up in Axure.

    BEFORE:
    When I downloaded fonts using default SkyFonts functionality, the font was downloaded to this folder:
    C:\Users\[myUsername]\AppData\Roaming\Monotype\skyfonts-google

    but it also showed up, as installed, in this folder:
    C:\Windows\Fonts

    Under those conditions, the font didn't appear in Axure's dropdowns.


    AFTER:
    I left everything the same, except that I dragged the fonts I wanted from the first folder to the second folder.

    i.e., I dragged them from this folder:
    C:\Users\[myUsername]\AppData\Roaming\Monotype\skyfonts-google

    into this folder:
    C:\Windows\Fonts

    Windows balked a bit, giving me an "Install Font" popup, telling me each font was already installed, asking "Do you want to replace it?"

    I said yes.

    When the process was through, everything still looked the same as "Before." i.e., The fonts still appeared in both folders!

    Also, when I opened Axure, the font was right there in the dropdown, just as surely as Arial or Courier New.

    So, that's probably the end of my quest for now, but I hope I shared enough detail for the guy who googles for "Axure can't read fonts installed with SkyFonts" or "Axure can't use Google fonts, etc."
    Last edited by Analytical Guy; 11-15-2016 at 12:47 PM.

  40. #33
    Newbie Level
    Join Date
    Feb 2016
    Location
    Portland, OR
    Posts
    8
    Thanks
    7
    Thanked 1 Time in 1 Post


    My LinkedIn
    This worked like a charm! Thanks

  41. #34
    Apprentice Level
    Join Date
    Aug 2013
    Location
    Costa Mesa, CA, USA
    Posts
    66
    Thanks
    10
    Thanked 2 Times in 2 Posts


    My Twitter My LinkedIn
    Quote Originally Posted by Julie Axure View Post
    Hi Erick,

    Macs handle fonts in a particular way, so font weight conversions are a bit of an inexact science. Because of this, the best solution is to use web fonts and font mapping when an exact match is necessary.

    For your situation, you'd want to use the font mapping feature to map your font to its font-family (Museo Sans 700) and the font-weight 700. That should take care of things so you don't see unexpected weights in the output.

    Thanks, just saw this. Recently getting some weird issues with the latest Axure. Just wanted to chime in on this and say "BEEN THERE. DONE THAT." Still got wonky code. It would become "750" instead of "700" weights. Also, from MAC to WIN, depending who's doing our QA and what platform they were on, it would show up as Times Roman or Arial. I gave up and used ARIAL for everything and had my team hate me for that.

    Haven't been experiencing this issue lately because I went to Sketch, Principle and Flinto, but am back to using Axure since the latest updates. If anything shows up, I'll chime in, but that's for the reply!!!

  42. #35
    Newbie Level
    Join Date
    Jul 2016
    Location
    Bangalore, India
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts


    My LinkedIn
    Is there a way to add "2 web font" in the prototype?

  43. #36
    Apprentice Level
    Join Date
    Sep 2016
    Location
    London, U.K
    Posts
    80
    Thanks
    1
    Thanked 15 Times in 15 Posts


    My LinkedIn
    Embedding is possible and look at the first screen shot by Paul or click on 'Publish' button within Axure then you will get a prompt with load of options, select Web Fonts from the left and define name, URL then click on '+' and repeat the process.
    Hasan

  44. #37
    Apprentice Level
    Join Date
    Nov 2011
    Location
    Mountain View, CA
    Posts
    24
    Thanks
    15
    Thanked 1 Time in 1 Post


    I've tried so many ways and fishmi222's solution works!! Big thanks to fishmi222!

Similar Threads

  1. (Answered) Axure Sketchy Font (Handwriting, render text mockup, fonts)
    By Paul Axure in forum 6.x Archived Discussions
    Replies: 10
    Last Post: 12-04-2015, 11:17 AM
  2. Replies: 1
    Last Post: 10-24-2014, 09:17 AM
  3. Custom Fonts in AxShare? (Viewing customized font into AxShare)
    By Paul Axure in forum AxShare General Discussion
    Replies: 18
    Last Post: 09-27-2013, 06:15 PM
  4. (Answered) Installing and Importing Fonts (install, import, custom, font)
    By Paul Axure in forum 6.x Archived Discussions
    Replies: 8
    Last Post: 07-28-2013, 12:37 PM

Search Engine Friendly URLs by vBSEO 3.6.0 PL2