Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Need help with @font-face CSS in Dreamweaver CS5

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #34319
    Triton
    Member

    Hi all, now i’m no amazing web designer but i know various bits and pieces to build a we site and my main forte is graphics design, Photoshop etc. but i’m really having difficulty getting my website to pick up custom fonts through using Dreamweaver CS5, the first thing i don’t quite understand is if i am creating a Style section containing the URL addresses of my font (i.e. where the custom font will be stored) do i also need to add CSS styling to the text in Dreamweaver because this seems to be confusing me. I have added the code which i have at the minute (this doesn’t seem to be working) and would appreciate it if someone could help me out with this problem.

    Many Thanks
    Andy

    My style contains :

    @font-face {
    font-family: ‘OratorStdMedium’;
    src: url(‘oratorstd-webfont.eot’);
    src: url(‘oratorstd-webfont.eot?#iefix’) format(’embedded-opentype’),
    url(‘oratorstd-webfont.woff’) format(‘woff’),
    url(‘oratorstd-webfont.ttf’) format(‘truetype’),
    url(‘oratorstd-webfont.svg#OratorStdMedium’) format(‘svg’);
    font-weight: normal;
    font-style: normal;

    }

    and where i want the font to appear contains the following code :

    align=”center” valign=”middle” id=”OratorStdMedium” font-family: ‘OratorStdMedium’, Verdana, Geneva, sans-serif; >Infire

    what am i doing wrong ?

    #87016
    Triton
    Member

    Srry my html code wasn’t quite clear above, please see below.

    "Infire" />
     
     


    Infire
     
     


     
     
     


     
     
     
    #87028
    thomas
    Member

    Does Dreamweaver CS5 support @font-face? A quick Google search turned this up: http://featofdesign.com/stephen/2011/06/21/318/

    From the article: …even though major support has been added to dreamweaver CS5.5 for CSS3 @font-face is not amongst the properties it has been expanded to include.

    #87032
    Ampitere
    Participant

    It’s in CS5.5 but I don’t think it’s in 5. Regardless, it’s not difficult to do yourself.. I suggest going to this website:

    http://fontsquirrel.com

    It’s by far the best @font-face related website I’ve found to date on the web and it’s extremely helpful, if they have the font you want to use the work is pretty much all done for you. But, it’s really not difficult to make your own packs.

    Try it out, and just apply it after you’re done working in Dreamweaver.

    #87036
    tommyb
    Member

    Like Ampitere suggested

    I would

    1. go to http://fontsquirrel.com
    2. Find the font you would like, download the @font face kit
    3. ftp these files to your server
    4. Use them with your page

    The fonts will not show up in Dreamweaver design view, but will work correctly on your pages. I put the @font face files in the folder “fonts” so my css looks like this:

    @font-face {
    font-family: 'LeagueGothicRegular';
    src: url('http://www.yoursite.com/fonts/League_Gothic-webfont.eot');
    src: url('http://www.yoursite.com/fonts/League_Gothic-webfont.eot?#iefix') format('embedded-opentype'),
    url('http://www.yoursite.com/fonts/League_Gothic-webfont.woff') format('woff'),
    url('http://www.yoursite.com/fonts/League_Gothic-webfont.ttf') format('truetype'),
    url('http://www.yoursite.com/fonts/League_Gothic-webfont.svg#LeagueGothicRegular') format('svg');
    font-weight: normal;
    font-style: normal;

    }

    Than use the new font family like this:

    h1 {font-family: 'LeagueGothicRegular', arial, sans-serif; }

    Does that answer your questions?

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.