I have had to right links for the font faces which I have to change when moving from my development server to live. Could fusion recognize these?

Comments

jeremycaldwell’s picture

Status: Active » Postponed (maintainer needs more info)

Depends on the formatting of them in the CSS declaration. Can you post them here for us to check out? If you are using @font-face or something similar it should work, just gotta try it out first to be sure but some of our custom themes use custom fonts and it works correctly there.

Trunkhorn’s picture

Sure can. I put the fonts in a file in the default drupal folder though as I had no idea where to put them where they would survive updating to the latest version of fusion.

Here's what I've done, and i found I had to put it in the fusion typography.css because it just wouldn't take over when put into Prosper's local.css file.

/* $Id: typography.css,v 1.1.2.4 2010/02/14 06:44:15 sociotech Exp $ */



/* Typography

-------------------------------------------------------------- */



@font-face {

	font-family: 'Museo Slab'; /* A font by Jos Buivenga (exljbris) -> www.exljbris.com */

	src: url('/fudge.net/sites/default/files/fonts/museo_slab_500-webfont.eot');

	src: local('☺'), url('/fudge.net/sites/default/files/fonts/museo_slab_500-webfont.woff') format('woff'), url('/fudge.net/sites/default/files/fonts/museo_slab_500-webfont.ttf') format('truetype'), url('/fudge.net/sites/default/files/fonts/museo_slab_500-webfont.svg#webfontQa8TWbkd') format('svg');

	font-weight: normal;

	font-style: normal;

}



@font-face {

	font-family: 'Museo Slab'; /* A font by Jos Buivenga (exljbris) -> www.exljbris.com */

	src: url('/fudge.net/sites/default/files/fonts/museo_slab_500italic-webfont.eot');

	src: local('☺'), url('/fudge.net/sites/default/files/fonts/museo_slab_500italic-webfont.woff') format('woff'), url('/fudge.net/sites/default/files/fonts/museo_slab_500italic-webfont.ttf') format('truetype'), url('/fudge.net/sites/default/files/fonts/museo_slab_500italic-webfont.svg#webfontQa8TWbkd') format('svg');

	font-weight: normal;

	font-style: italic;

}



@font-face {

	font-family: 'Museo Sans'; /* A font by Jos Buivenga (exljbris) -> www.exljbris.com */

	src: url('/fudge.net/sites/default/files/fonts/museosans_500-webfont.eot');

	src: local('☺'), url('/fudge.net/sites/default/files/fonts/museosans_500-webfont.woff') format('woff'), url('/fudge.net/sites/default/files/fonts/museosans_500-webfont.ttf') format('truetype'), url('/fudge.net/sites/default/files/fonts/museosans_500-webfont.svg#webfontQa8TWbkd') format('svg');

	font-weight: normal;

	font-style: normal;

}



@font-face {

	font-family: 'Museo Sans'; /* A font by Jos Buivenga (exljbris) -> www.exljbris.com */

	src: url('/fudge.net/sites/default/files/fonts/museosans_500_italic-webfont.eot');

	src: local('☺'), url('/fudge.net/sites/default/files/fonts/museosans_500_italic-webfont.woff') format('woff'), url('/fudge.net/sites/default/files/fonts/museosans_500_italic-webfont.ttf') format('truetype'), url('/fudge.net/sites/default/files/fonts/museosans_500_italic-webfont.svg#webfontQa8TWbkd') format('svg');

	font-weight: normal;

	font-style: italic;

}



@font-face {

	font-family: 'Calluna'; /* A font by Jos Buivenga (exljbris) -> www.exljbris.com */

	src: url('/fudge.net/sites/default/files/fonts/calluna-regular-webfont.eot');

	src: local('☺'), url('/fudge.net/sites/default/files/fonts/calluna-regular-webfont.woff') format('woff'), url('/fudge.net/sites/default/files/fonts/calluna-regular-webfont.ttf') format('truetype'), url('/fudge.net/sites/default/files/fonts/calluna-regular-webfont.svg#webfontQa8TWbkd') format('svg');

	font-weight: normal;

	font-style: normal;

}



@font-face {

	font-family: 'Anivers'; /* A font by Jos Buivenga (exljbris) -> www.exljbris.com */

	src: url('/fudge.net/sites/default/files/fonts/anivers_regular-webfont.eot');

	src: local('☺'), url('/fudge.net/sites/default/files/fonts/anivers_regular-webfont.woff') format('woff'), url('/fudge.net/sites/default/files/fonts/anivers_regular-webfont.ttf') format('truetype'), url('/fudge.net/sites/default/files/fonts/anivers_regular-webfont.svg#webfontQa8TWbkd') format('svg');

	font-weight: normal;

	font-style: normal;

}



@font-face {

	font-family: 'Museo'; /* A font by Jos Buivenga (exljbris) -> www.exljbris.com */

	src: url('/fudge.net/sites/default/files/fonts/museo500-regular-webfont.eot');

	src: local('☺'), url('/fudge.net/sites/default/files/fonts/museo500-regular-webfont.woff') format('woff'), url('/fudge.net/sites/default/files/fonts/museo500-regular-webfont.ttf') format('truetype'), url('/fudge.net/sites/default/files/fonts/museo500-regular-webfont.svg#webfontQa8TWbkd') format('svg');

	font-weight: normal;

	font-style: normal;

}



@font-face {

	font-family: 'Museo'; /* A font by Jos Buivenga (exljbris) -> www.exljbris.com */

	src: url('/fudge.net/sites/default/files/fonts/museo700-regular-webfont.eot');

	src: local('☺'), url('/fudge.net/sites/default/files/fonts/museo700-regular-webfont.woff') format('woff'), url('/fudge.net/sites/default/files/fonts/museo700-regular-webfont.ttf') format('truetype'), url('/fudge.net/sites/default/files/fonts/museo700-regular-webfont.svg#webfontQa8TWbkd') format('svg');

	font-weight: normal;

	font-style: bold;

}

So that works fine on my dev server, but will need to be constantly changed when I upload it. I'm hoping there is a way that fusion might be able to make a font folder relative to drupal so that it doesn't matter whether the site is local or online.

jeremycaldwell’s picture

Assigned: Unassigned » jeremycaldwell
Status: Postponed (maintainer needs more info) » Active

Looks good to me, just a bit too specific I think. I recommend you create a "fonts" directory in your Acquia Prosper theme folder and place the fonts there and then add that bit of CSS above to your theme's local.css file. It should work that way so not sure what was causing your local.css file to not see them.

From the code above you are loading the font face but not applying it to anything so might have to be specific with what you apply the font face to in this case.

Here is an example of how we are loading font face through the CSS of a theme:

/* Font face */
@font-face {
  font-family: 'QlassikMediumRegular';
  src:  url('../fonts/Qlassik_TB.eot');
  src:  local('Qlassik Medium Regular'), 
  local('QlassikMedium'), 
  url('../fonts/Qlassik_TB.woff') format('woff'), 
  url('../fonts/Qlassik_TB.otf') format('opentype'), 
  url('../fonts/Qlassik_TB.svg#QlassikMedium') format('svg');
}

Then we apply it like so:

#site-name {
  font-family: "QlassikMediumRegular", "Myriad Pro", "Myriad Web Pro Regular", "Lucida Grande", Geneva, "Trebuchet MS", sans-serif;
}

Hope that helps!

Trunkhorn’s picture

Excellent! I didn't realize you could use relative links in the themes directory (I thought that you couldn't do that because of the effect clean-urls has on a drupal installation). I will test this out!

Trunkhorn’s picture

Works superbly, I forgot to mention that the other reason I had it in default/files was because I was using it for imagecache actions. I just left a copy of that font folder in there and put another in prosper's folder. Thanks much!

jeremycaldwell’s picture

Status: Active » Fixed

Cool, glad I could help.

ehalber’s picture

I'm having a tough time getting this to work. I test it local in my browser outside of Drupal no problem. When I place the code into a stylesheet inside of the drupal install, no dice. i'm tried both relative and absolute paths to the files...arg! It seems like no one else is having this problem. Any ideas would be fantastic.

@font-face {
font-family: 'myriad';
src: url(/sites/sproutloud.com/themes/sproutloud/fonts/MyriadPro-BlackSemiCn.otf),
url(/sites/sproutloud.com/themes/sproutloud/MyriadPro-BlackSemiCn.ttf),
url(/sites/sproutloud.com/themes/sproutloud/MyriadPro-BlackSemiCn.eot);
}

h1 {
font-family: 'myriad' !important;
}

I have also tried putting the font files into the files folder => files/fonts/font.xxx

jeremycaldwell’s picture

I recommend redoing your fonts with Font Squirrel (http://www.fontsquirrel.com/fontface/generator) and using what it generates rather than the code you have above.

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

ehalber’s picture

An enthusiastic yes to last answer. Font Squirrel saved the day. I use it and others like it for all of my online projects now. Love it.