Announcement

Collapse
No announcement yet.

How to add custom font in CKEditor in vBulletin 5

Collapse
This is a sticky topic.
X
X
Collapse
First Prev Next Last
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • glennrocksvb
    replied
    Blackhorse, I'm not sure. Just try it. But make backups of the files first before editing them. If it doesn't work, then revert back to the backup.

    Leave a comment:


  • Blackhorse
    replied
    Hello Glenn,

    is is still valid to add font through these steps?


    Thanx

    Leave a comment:


  • glennrocksvb
    replied
    msouefi, did you follow all the steps and it's not working for you?

    Leave a comment:


  • msouefi
    replied
    hello all
    my website http://aqarspot.com is in Arabic language do i have to make other steps

    Leave a comment:


  • glennrocksvb
    replied
    Did you do step 1?

    Leave a comment:


  • SpaceStar
    replied
    hi Glen

    First of all, thanks for a superb blog.

    I went through all setting and got the Font in CKeditor box and could also choose it, but it didn't showed up as thought.

    Any hint?

    Leave a comment:


  • Felix2
    replied
    I went though something like this a while back when I went to a dark theme. Black text and black background just wasn't working for me.
    Got very frustrated all the CSS didn't work.
    Turned out, the .JS was injecting its own CSS and ignoring my CSS. Hate these sort of hacks, but sometimes you must.
    Appreciate this Font hack.
    Somewhat off topic here, I have made a number of such hacks, forgot most, but the one I can't seem to nail down is the maximize function.
    In the default CKEditor it exists, and in older version of vB. But not in 5x that I can tell.
    Click image for larger version

Name:	Clipboard01.jpg
Views:	30
Size:	100.0 KB
ID:	963

    I upgraded the code to the latest 4.5.11, but I think it is the extra vB .js files which are hiding it, something like the config.removeButtons function.
    I also don't get the special character or spell checker buttons, but these I know are overwritten for browser support functions.

    This is how my edit box appears-

    Click image for larger version

Name:	image.jpg
Views:	51
Size:	304.3 KB
ID:	1602

    You can see I have the advanced editor, search engine tools, photo gallery, short URL, Polling, advance Smilies... also, I can collapse the entire tools bar. I can also stretch the edit window vertically. I just can't get it to go full screen and back.
    Any ideas what needs to be edited/hacked to return that function?

    Leave a comment:


  • glennrocksvb
    commented on 's reply
    Glad you sorted it out.

  • Calamity
    replied
    Sorry, I edited my reply just as you wrote that. I managed to fix my errors.

    Leave a comment:


  • glennrocksvb
    replied
    It works for me.

    Click image for larger version

Name:	custom-font.png
Views:	24
Size:	8.6 KB
ID:	594

    Leave a comment:


  • Calamity
    replied
    I guess that I spoke too soon, actually. It works as in it's in the list and stuff, but when I tried to actually write with it (Century Gothic) then the box would just show "Fonts" again, and the default font would apply instead. I don't think there should be an issue with my css_fonts.css file, but we'll see. And yes I did change the config to match css_fonts.css instead of css_additional.css.

    * Update: It was indeed an issue with the css_fonts.css. I had moved my theme around in Style Manager. Before it was a child of one of the premade VB ones, and that's why it inherited templates from them, so I had to edit the css_fonts.css in "Default Style", as it wouldn't let me do it any other way. I completely forgot that I moved my theme so it doesn't have any other "parents" anymore. My bad! It's working great now.
    Last edited by Calamity; 09-06-2016, 02:48 PM.

    Leave a comment:


  • glennrocksvb
    replied
    Glad to help!

    Thanks for confirming this hack works.

    Leave a comment:


  • Calamity
    replied
    I now edited it with Notepad++ instead, and I noticed pretty quickly that I had somehow managed to put a "," after "/* customConfig:"", */".

    Tested now with your .css code and font, and it worked perfectly! Just gonna edit it for my own font(s) now. Thanks a lot! Awesome work!!

    Leave a comment:


  • glennrocksvb
    replied
    This means there's a syntax error in the js file. Did you include the trailing comma in the code that needs to be removed or commented out?

    Leave a comment:


  • Calamity
    replied
    After I edited the ckeditor-rollup523.js, then I got this error:

    "There was an error loading the rich text editor. You may use the plain text editor, or you may reload the page to try again. If the problem persists, please contact the administrator."
    Last edited by Calamity; 09-06-2016, 01:43 PM.

    Leave a comment:

Working...
X