User Tools

Site Tools


phplugins_adobe_typekit

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

phplugins_adobe_typekit [2013/05/10 05:29]
admin [Apply Font-families to your page(s)]
phplugins_adobe_typekit [2013/05/10 05:39] (current)
admin [Apply Font-families to your page(s)]
Line 60: Line 60:
 ===== Apply Font-families to your page(s) ===== ===== Apply Font-families to your page(s) =====
  
-From here, you have a choice how to proceed.+From here, you have a choice how to proceed
 + 
 +  * You may add the Typekit fonts via a custom stylesheet. 
 +  * You may add the Typekit fonts via the Typekit Editor. 
 + 
 +Either way, you can use the following CSS as a reference for setting fonts in CE3.
  
 <code> <code>
-html body +/* paragraphs, lists, etc. */ 
 +p, ol, ul, dl, address, ins, mark  
 { font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; } { font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; }
  
-html h1, html .h1, html h2, html .h2, html h3, html .h3, html h4, html .h4, html h5, html .h5, html h6, html .h6 +/* headings */ 
 +h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 
 { font-family: Futura, "Century Gothic", AppleGothic, sans-serif; } { font-family: Futura, "Century Gothic", AppleGothic, sans-serif; }
  
-html blockquote +/* blockquotes */ 
 +blockquote 
 { font-family: "Droid Serif", Georgia, Times, "Times New Roman", serif; } { font-family: "Droid Serif", Georgia, Times, "Times New Roman", serif; }
  
-html pre, html code, html kbd, html samp +/* code, monospace */ 
 +pre, code, kbd, samp 
 { font-family: Consolas, "Lucida Console", Monaco, monospace; } { font-family: Consolas, "Lucida Console", Monaco, monospace; }
 </code> </code>
  
 +You can copy and paste selectors or groups of selectors from above into the Typekit Editor:
 +
 +{{:wiki:typekit-selectors.png?nolink|}}
 +
 +Press the "Publish" button in the Typekit Editor and your site should shortly be updated with your chosen fonts.
 +
 +If you'd rather work via custom stylesheet, you can copy and paste the above CSS into your custom.css file, then edit the font-families to include your new fonts.
phplugins_adobe_typekit.txt · Last modified: 2013/05/10 05:39 by admin