Как я могу добавить (программно) шрифты Google в ckeditor

Я только что скачал CKEditor, и это здорово. Хотя я заметил, что он тормозит шрифты. Поэтому я подумал, что было бы неплохо иметь возможность добавить веб-шрифты Google в CKEditor, чтобы расширить его функциональность.

Я искал в Интернете, но смог найти только то, как вручную войти и добавить каждый шрифт в файл config.js.

Может кто-нибудь, пожалуйста, помогите мне программно добавить все веб-шрифты Google в CKEditor и показать, как это сделать.


person praneybehl    schedule 21.12.2012    source источник


Ответы (2)


Хорошо, я нашел ответ. Я публикую его здесь, чтобы он мог быть полезен для всех, кто ищет то же самое. Итак, вот оно:

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);

Ваше здоровье,

Праней

person praneybehl    schedule 21.12.2012
comment
У меня это работает, но я получаю одну ошибку, а другие шрифты отсутствуют в раскрывающемся списке формата. >localhost:4200/ckeditor/contents.css», потому что его тип MIME («текст/html») не является поддерживаемым типом MIME таблицы стилей, и включена строгая проверка MIME. - person Srinivas M. P.; 18.09.2020

Вы можете использовать язык сценариев для получения списка всех веб-шрифтов Google с помощью API разработчика и автоматического создания строк конфигурации CKEditor.

Для использования API вам понадобится ключ API,

Чтобы получить ключ API, посетите Консоль API. На панели «Службы» активируйте Google Web Fonts Developer API; если появятся Условия использования, прочтите и примите их.

Затем перейдите на панель доступа к API. Ключ API находится в нижней части этой панели в разделе «Простой доступ к API».

Получив ключ API, ваше приложение может добавить параметр запроса key=yourAPIKey ко всем URL-адресам запросов.

Ключ API безопасен для встраивания в URL-адреса; ему не нужна кодировка.

Конечная точка для веб-шрифтов: https://www.googleapis.com/webfonts/v1/webfonts?key=YOURKEYHERE, и он возвращает ответ JSON, поэтому, например, вы можете использовать jQuery, например, для ajax в запросе и перебирать объекты, создавая строки конфигурации, а затем просто копировать и вставлять их.

person Daniel.    schedule 21.12.2012
comment
Спасибо за ваш ответ, но я только начал изучать javascript. Можно ли помочь мне с битом кодирования? - person praneybehl; 21.12.2012
comment
Эй, конечно, я написал код для его извлечения, напишите мне по электронной почте daniel [at] buildhq.co - person Daniel.; 31.12.2012
comment
Спасибо, приятель, я только что отправил тебе письмо. Будем признательны за вашу помощь. Ваше здоровье! - person praneybehl; 31.12.2012