Adding custom fonts in vBulletin 5 is not possible without hacking the existing ckeditor JS files.
NOTE: Since this is a JS hack, these changes will not be carried over when you upgrade. New JS files are generated with a new suffix based off the version number (e.g. xxxxx-523.js for vB 5.2.3) when upgrading. So you need to re-apply these changes every time you upgrade.
The changes needed are not straightforward. You have to follow the following steps:
http://www.vbulletin.com/forum/forum...-font-to-forum
NOTE: Since this is a JS hack, these changes will not be carried over when you upgrade. New JS files are generated with a new suffix based off the version number (e.g. xxxxx-523.js for vB 5.2.3) when upgrading. So you need to re-apply these changes every time you upgrade.
The changes needed are not straightforward. You have to follow the following steps:
- Add the @font-face rule for the custom font at the very top of css_additional.css template or in Sitebuilder (Style > CSS Editor). The sample code below is for the custom font I'm using on this site.
Code:@font-face { font-family: 'Orbitron'; font-style: normal; font-weight: 700; src: local('Orbitron-Bold'), url(https://fonts.gstatic.com/s/orbitron/v7/Y82YH_MJJWnsH2yUA5AuYY4P5ICox8Kq3LLUNMylGO4.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000; }
- Edit /js/ckeditor/config.js file in a text editor to add the custom font and include css_additional.css to the editor. Insert the highlighted lines below before the closing }.
Code:CKEDITOR.editorConfig = function( config ) { ... ... ... [strike] [COLOR=#0000FF]// add css_additional.css which contains the @font-face rule for the custom font (by default, it was only adding css_editor.css) config.contentsCss = [ pageData.baseurl + '/' + pageData.ckeditorCss, pageData.baseurl + '/' + pageData.ckeditorCss.replace(/css_editor\.css/i, 'css_additional.css') ];[/COLOR][/strike][COLOR=#0000FF] // add custom font name (format: <font display name>/<actual font name>); // add as many custom fonts as needed and separate them with semicolon (e.g. 'Orbitron/Orbitron;Century Gothic/centurygothic;') config.font_names = [/COLOR][COLOR=#FF0000]'Orbitron/Orbitron;'[/COLOR][COLOR=#0000FF] + config.font_names;[/COLOR] };
- Edit /js/ckeditor-rollup-5xx.js file in a text editor. If your forum is version 5.2.3, then the file is ckeditor-rollup-523.js.
Search for: (comma included)
Code:customConfig:"",
Code:/* customConfig:"", */
http://www.vbulletin.com/forum/forum...-font-to-forum
Comment