6 Replies Latest reply on Apr 14, 2014 2:13 PM by RKLG

    Why does the font Trajan change to something generic when I publish it? It looked perfect in preview

    RKLG

      I watched a lynda.com video about Fonts (Edge Animate Essential Training). I followed the tutorial perfectly. I typed in the Font Fallback List code and the Embed code to get the font "Trajan". When I hit command-enter (to preview it), my font showed up perfectly in the preview. Then I publish it (making sure to check runtime files on Adobe CDN), and when I open my “ACtest2.html” file in Google Chrome, the Trajan font no longer shows up. It’s been turned into a generic font. (The html file I'm clicking on lives in the "web" folder within the "publish" folder so it's not like I'm clicking on the wrong HTML file.) Same issue when I bring my .OAM file into Adobe Muse: incorrect font. What am I doing wrong? The only yellow triangle warning I'm getting is about a non-supported gradient.

        • 1. Re: Why does the font Trajan change to something generic when I publish it? It looked perfect in preview
          TimJaramillo Level 4

          Are you loading the font locally (is the actual font in a directory on your computer), or remotely through Typekit servers?

           

          Do you have a Typekit account?

           

          It's my understanding that Trajan is an Adobe font that must be licensed through Typekit ($$) to be fully functional. I'm thinking that maybe once you actually publish the file, there's a legal flag being thrown that's pinging Typekit servers, and not allowing the font to render.

           

          This is just a hunch.

          1 person found this helpful
          • 2. Re: Why does the font Trajan change to something generic when I publish it? It looked perfect in preview
            RKLG Level 1

            Am I loading the font locally? Trajan 3 is in Adobe Typekit AND my computer in the same folder as the project. (And it's also in the fontbook).

             

            Yes I have a typekit account

            • 3. Re: Why does the font Trajan change to something generic when I publish it? It looked perfect in preview
              Liz, Typekit Support Adobe Employee

              Hi RKLG,

               

              I'm sorry that you ran into trouble with this.

               

              "...when I open my “ACtest2.html” file in Google Chrome, the Trajan font no longer shows up. It’s been turned into a generic font. (The html file I'm clicking on lives in the "web" folder within the "publish" folder so it's not like I'm clicking on the wrong HTML file.)"

               

              It sounds like you may be opening the HTML file in the browser as file://.  The HTML needs to be hosted on a web server (a localhost server will work fine) and viewed in the browser as http:// or https:// in order for the Typekit fonts to load.

               

              Remember to include your localhost domain name in the listing on your kit as well:

              http://help.typekit.com/customer/portal/articles/6857-using-typekit-while-developing-local ly

               

              If you still have trouble getting the fonts to load, please send a URL or your HTML file to support@typekit.com and we can take a closer look.

               

              Thanks!
              -- liz

              1 person found this helpful
              • 4. Re: Why does the font Trajan change to something generic when I publish it? It looked perfect in preview
                RKLG Level 1

                Liz,

                 

                You're correct. I am opening it as "file://"

                 

                "The HTML needs to be hosted on a web server". I don't know how to do that because I'm a video editor. I'm using Edge Animate CC because my company told me that they want me to learn how to make animated web banners. So I started learning Edge Animate CC through video tutorials on the internet. I don't know too much about HTML or hosting, etc. Do you know of a website you can point me to that will let me host a web server? Or can you point me in the direction of a video that will explain how to setup a web server and host html on it?

                 

                I'm assuming this animated web banner I'm creating will eventually be put on the website of our client. I don't have access to the website editor. And I'm assuming that I won't be tasked with putting the HTML web banner on the client's website. I'm assuming i'll just hand off the files to whoever authors my client's website, for them to post the web banner.  But before I hand it off to said person, I'd like to test it myself to see if it works. And I feel like I have no way to test it because I don't know anything about hosting. Can you recommend a website where I can host my HTML files on a web server?

                 

                " (a localhost server will work fine)". In that link you provided above, I'm looking at the screenshot and I typed in localhost to my typekit, but I still don't know how to preview my web banner on "local host". All the videos I watched didn't cover this. This topic is really foreign and new to me, and I'm not finding a lot of support to tell me how to do all of this.

                 

                So confused.

                • 5. Re: Why does the font Trajan change to something generic when I publish it? It looked perfect in preview
                  Liz, Typekit Support Adobe Employee

                  Hi RKLG,

                   

                  There are a couple options you can consider for web hosting.  A localhost server runs on your own computer and lets you view webpages locally. Typekit doesn't provide instructions on how to set up the localhost server, because there are several options depending on your operating system (OS X, Windows, etc) and version.

                   

                  There are many good tutorial online; we recommend searching for information specific to your setup, e.g. "localhost website OS X Mavericks".

                   

                  If that feels like too much setup, though, there are some online services that provide code "sandboxes" and take care of this for you.  CodePen is one that works with Typekit: http://codepen.io/.

                   

                  Basically, you just copy your HTML, CSS, and JS into the CodePen site and you can see preview it immediately.  This help page shows how to set up the Typekit side:

                  http://help.typekit.com/customer/portal/articles/1510698-using-typekit-with-codepen

                   

                  I hope that this helps,

                  -- liz

                  1 person found this helpful
                  • 6. Re: Why does the font Trajan change to something generic when I publish it? It looked perfect in preview
                    RKLG Level 1

                    My coworker gave me instructions on how to host files on a blank webpage. [Instructions below.] I followed those instructions, and my "trajan" font showed up perfectly on my temporarily published website. But then I opened the URL on my iPhone and the font Trajan isn't there any more. It's been replaced by a generic font. How can I fix this? Why is this happening?

                     

                    How to test your animated web banner to see if it truly works by hosting it on a server

                    1. In Edge Animate, publish an OAM
                    2. Open a new blank page in Adobe Muse.
                    3. Drag your OAM file into Adobe
                    4. Go to file -> Publish
                    5. A box will come up that asks you to choose a name/title for your site. I chose “test” and typed that into the “site name:” box. Then click “OK”. [the name "test" was made up for the sake of this example / this forum post. That's not actually the name I entered for the webpage]
                    It took me to this website: http://test02.businesscatalyst.com/index.html (which will be hosted there for 30 days). And boom, my font Trajan works beautifully.