5

I'm on Joomla 3.4.

I have checked JCE editor and there's a way to simply add in the configuration an option so that each time I click on the option from "font family" it will add, in line, the custom/web family font to the element.

The fonts are loaded within the template.css, they work, and JCE simply adds the right font family to chosen element.

I don't really feel like I need JCE, especially that I was fine so far with tinyMCE. But I can't in any way seem to figure, how to add the same thing I added to JCE but to tinyMCE.

I googled and looked for some forum posts, they talked about some files... but for ooooold joomla, so those files aren't in the current joomla anymore so I can't edit them.

Any idea how to add custom web font in the font family selection in tinyMCE? Again, I have the font family loaded in the stylesheet already, I just need to be able to apply them in tinyMCE to the elements like I could the "default" fonts from font family editor selection.

Thanks in advance.

4

The solution is a bit tricky but it should work.

Open this file [root]/media/editors/tinymce/tinymce.min.js (yes, it's minified), try to find this part

function(){var n="Andale Mono=andale mono,times;

change it to

function(){var n="Your New font=your new font,sans-serif;Andale Mono=andale mono,times;

then open file [root]/templates/your_active_template/css/editor.css

add your @font-face decalaration in the top of file

@font-face {
font-family: 'Your New font';
src: url('fonts/samman/your-new-font.eot');
src: url('fonts/samman/your-new-font.eot?#iefix') format('embedded-opentype'),
     url('fonts/samman/your-new-font.woff') format('woff'),
     url('fonts/samman/your-new-font.ttf') format('truetype'),
     url('fonts/samman/your-new-font.svg#your-new-font') format('svg');
font-weight: normal;
font-style: normal;

}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.