2012-12-21 32 views
6

我剛剛下載CKEditor及其偉大的。儘管我已經注意到它鬆弛了字體。 所以我認爲能夠將Google Web字體添加到CKEditor以添加其功能將是一個不錯的主意。如何添加(編程)谷歌字體ckeditor

我在網上搜索,但我只能找到如何手動進去,並添加config.js文件中的每個字體。

有人可以幫助我以編程方式將所有Google Web字體添加到CKEditor並顯示如何。

回答

10

好的,我找到了答案。我在這裏發佈它,這對任何正在尋找相同內容的人都有幫助。所以在這裏,它是:

myFonts = ['Aclonica', 'Allan', 'Allerta', 'Allerta Stencil', 'Amaranth', 'Angkor', 'Annie Use Your Telescope', 'Anonymous Pro', 'Anton', 'Architects Daughter', 'Arimo', 'Artifika', 'Arvo', 'Astloch', 'Bangers', 'Battambang', 'Bayon', 'Bentham', 'Bevan', 'Bigshot One', 'Bokor', 'Brawler', 'Buda', 'Cabin', 'Cabin Sketch', 'Calligraffitti', 'Candal', 'Cantarell', 'Cardo', 'Carter One', 'Caudex', 'Chenla', 'Cherry Cream Soda', 'Chewy', 'Coda', 'Coda Caption', 'Coming Soon', 'Content', 'Copse', 'Corben', 'Cousine', 'Covered By Your Grace', 'Crafty Girls', 'Crimson Text', 'Crushed', 'Cuprum', 'Damion', 'Dancing Script', 'Dangrek', 'Dawning of a New Day', 'Didact Gothic', 'Droid Sans', 'Droid Sans Mono', 'Droid Serif', 'EB Garamond', 'Expletus Sans', 'Fontdiner Swanky', 'Francois One', 'Freehand', 'GFS Didot', 'GFS Neohellenic', 'Geo', 'Goudy Bookletter 1911', 'Gruppo', 'Handlee', 'Hanuman', 'Holtwood One SC', 'Homemade Apple', 'IM Fell DW Pica', 'IM Fell DW Pica SC', 'IM Fell Double Pica', 'IM Fell Double Pica SC', 'IM Fell English', 'IM Fell English SC', 'IM Fell French Canon', 'IM Fell French Canon SC', 'IM Fell Great Primer', 'IM Fell Great Primer SC', 'Inconsolata', 'Indie Flower', 'Irish Grover', 'Josefin Sans', 'Josefin Slab', 'Judson', 'Jura', 'Just Another Hand', 'Just Me Again Down Here', 'Kenia', 'Khmer', 'Koulen', 'Kranky', 'Kreon', 'Kristi', 'Lato', 'League Script', 'Lekton', 'Limelight', 'Lobster', 'Lora', 'Luckiest Guy', 'Maiden Orange', 'Mako', 'Maven Pro', 'Meddon', 'MedievalSharp', 'Megrim', 'Merriweather', 'Metal', 'Metrophobic', 'Michroma', 'Miltonian', 'Miltonian Tattoo', 'Molengo', 'Monofett', 'Moul', 'Moulpali', 'Mountains of Christmas', 'Muli', 'Neucha', 'Neuton', 'News Cycle', 'Nobile', 'Nova Cut', 'Nova Flat', 'Nova Mono', 'Nova Oval', 'Nova Round', 'Nova Script', 'Nova Slim', 'Nova Square', 'Nunito', 'OFL Sorts Mill Goudy TT', 'Odor Mean Chey', 'Old Standard TT', 'Open Sans', 'Open Sans Condensed', 'Orbitron', 'Oswald', 'Over the Rainbow', 'PT Sans', 'PT Sans Caption', 'PT Sans Narrow', 'PT Serif', 'PT Serif Caption', 'Pacifico', 'Paytone One', 'Permanent Marker', 'Philosopher', 'Play', 'Playfair Display', 'Podkova', 'Preahvihear', 'Puritan', 'Quattrocento', 'Quattrocento Sans', 'Radley', 'Raleway', 'Reenie Beanie', 'Rock Salt', 'Rokkitt', 'Ruslan Display', 'Schoolbell', 'Shanti', 'Siemreap', 'Sigmar One', 'Six Caps', 'Slackey', 'Smythe', 'Sniglet', 'Special Elite', 'Sue Ellen Francisco', 'Sunshiney', 'Suwannaphum', 'Swanky and Moo Moo', 'Syncopate', 'Tangerine', 'Taprom', 'Tenor Sans', 'Terminal Dosis Light', 'The Girl Next Door', 'Tinos', 'Ubuntu', 'Ultra', 'UnifrakturCook', 'UnifrakturMaguntia', 'Unkempt', 'VT323', 'Vibur', 'Vollkorn', 'Waiting for the Sunrise', 'Wallpoet', 'Walter Turncoat', 'Wire One', 'Yanone Kaffeesatz']; 

config.font_names = 'serif;sans serif;monospace;cursive;fantasy'; 

for(var i = 0; i<myFonts.length; i++){ 
      config.font_names = config.font_names+';'+myFonts[i]; 
      myFonts[i] = 'http://fonts.googleapis.com/css?family='+myFonts[i].replace(' ','+'); 
} 

config.contentsCss = ['/ckeditor/contents.css'].concat(myFonts); 

乾杯,

Praney您的回覆

4

您可以使用腳本語言使用開發人員API提取所有Google WebFonts的列表,並自動生成CKEditor配置行。

要使用這個API,你需要一個API密鑰,

要獲取API密鑰,請訪問APIs Console。在「服務」窗格中,激活Google Web Fonts Developer API;如果出現服務條款,請閱讀並接受它們。

接下來,轉到API訪問面板。 API鍵位於該窗格的底部附近,標題爲「簡單API訪問」。

在您擁有API密鑰後,您的應用程序可以將查詢參數key = yourAPIKey附加到所有請求URL。

API密鑰對於嵌入到URL中是安全的;它不需要任何編碼。

webfonts的端點是https://www.googleapis.com/webfonts/v1/webfonts?key=YOURKEYHERE,它返回一個JSON響應,例如,您可以在請求中使用jQuery作爲示例,並遍歷這些對象,構建配置行然後將其複製並粘貼到

+0

謝謝,但我纔開始學習JavaScript。有沒有可能幫助我編碼位? – praneybehl

+0

嘿,當然,我寫了代碼拉它,給我發一封電子郵件daniel [在] buildhq.co –

+0

謝謝隊友,我剛剛給你發了一封電子郵件。將感謝您的幫助。乾杯! – praneybehl